@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

.clear:after { 
    content:""; 
    display:block; 
    clear:both;
}
* { margin:0; padding:0; outline:none; box-sizing:border-box; }
html { font-size: 10px; }
body {
line-height:1; font-size:14px; font-weight:400; color:#000; font-family: 'Noto Sans KR', sans-serif; word-wrap: break-word; word-break: keep-all;
overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 { margin:0; font-family: 'Noto Sans KR', sans-serif; line-height:1; font-size: 1em; }
ul, ol { list-style:none; margin:0; padding: 0; }
a { outline:0; text-decoration:none; color: #000; }
a:focus { outline:none; }
figure,dl,dd,input[type=radio], input[type=checkbox]  { margin: 0; padding: 0; }
img { border:none; outline:none; max-width: 100%; }
p { margin:0; padding:0; word-wrap: break-word; word-break: keep-all;  }
button, input, submit { border: none; background: none; }
dt { font-weight: normal; }

/* 탭 초기화 */
.tabBox1 .nav { border: none; }
.tabBox1 .nav > li { margin: 0; float: none; }
.tabBox1 .nav > li > a { padding: 0; margin: 0; border-radius:0; border: 0; }
.tabBox1 .nav > li:hover > a { background: none; }
.tabBox1 .nav > li.active > a { border: none; background: none; }

:root {
	/* 컨텐츠 너비 */
	--containerV1-width : 1400px;

	--main-color : #e60000; /* mainColor */

	/* 해드 높이 값 */
	--header-height: 100px;
}
@media (max-width:768px) {
	:root {
		/* 해드 높이 값 */
		--header-height: 65px;
	}
}

/* container */
.containerV1 { width: 100%; margin: 0 auto; max-width: var(--containerV1-width,1400px); }
@media (max-width:1430px) {
	.containerV1 { padding: 0 15px; }
}
.containerV2 { width: 100%; margin: 0 auto; max-width: 1540px; }
@media (max-width:1570px) {
	.containerV2 { padding: 0 15px; }
}

/* 애니메이션 */
@keyframes ani_opacity {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

/* 해드세팅 */
	.header_wrap { 
		/* 폰트 사이즈 pc */
		--head-font-size-pc: 18;
		/* 폰트 사이즈 mob */
		--head-font-size-mob:15;

		font-size: min( calc( var(--head-font-size-mob) / 350 * 100vw ), calc(var(--head-font-size-pc) * 1px) );
		position:fixed; right:0; top:0; width:100%; z-index:2000; transition:0.4s; background: rgba(0,0,0,0.4);
		box-shadow:0 0 10px rgba(0,0,0,0.2);
	}

	#header { 
		-ms-display:flex; -ms-justify-content:space-between; -ms-align-items:center;
		display:flex; justify-content:space-between; align-items:center;
	}

	/* 로고 */
	.logo{
		/* 로고 너비 */
		--logo-width:235;
		width:calc( var(--logo-width) / var(--head-font-size-pc) * 1em );
	}
	.logo a { 
		display: block; background-repeat: no-repeat; background-position: center; background-size:cover;
		background-image: url(./img/logo-white.png); padding-bottom: calc(70 / var(--logo-width) * 100% );
	}


	/* 대메뉴 */
	#h_menu .outer > li { position:relative; } 


	/* 스크롤 했을 때 해드 효과 */
		.header_wrap.scroll { box-shadow:0 0 10px rgba(0,0,0,0.2); background: #fff; }
		.header_wrap.scroll .logo a { background-image: url(./img/logo.png); }




	@media (min-width:991px) {/* pc */
		#h_menu { 
			/* 스크롤 컬러 */
			--scroll-color: #fff;
			display:flex; align-items:center;
		}

		/* menu */
		/*---------------------------------------- outer ---------------------------------------------*/
		#h_menu .outer { 
			/* 대메뉴 갭 */
			--h-menu-gap:60;
			display:flex; 
			gap: calc( var(--h-menu-gap) / var(--head-font-size-pc) * 1em );
		}
		#h_menu .outer > li > a {
			display:block; font-size:inherit; font-weight:bold; text-align:center; transition:0.4s; color: var(--scroll-color); height: var(--header-height); 
			line-height: var(--header-height);
		}
		#h_menu .outer > li > a::before{
			content: "";
			position: absolute;
			width: 0%;
			height: 2px;
			background: var(--scroll-color);
			top: 70%;
			transform: translateY(70%);
			transition: all 0.3s;
		}
		#h_menu .catalog { color: var(--scroll-color); font-size: 0.72em; margin-left: 4.61em; }
		#h_menu .catalog > li > a { display: block; color: inherit; height: var(--header-height); line-height: var(--header-height); }
		#h_menu .catalog > li > a > i { margin-left: 0.2em; transform:translateY(-7%); }

		/*---------------------------------------- //outer ---------------------------------------------*/

		/*---------------------------------------- inner ---------------------------------------------*/
		#h_menu .outer > li > .inner {
			/* 소메뉴 너비 */
			--inner-width:220;
			width: calc( var(--inner-width) / var(--head-font-size-pc) * 1em );
			position:absolute; left:0; transform:translateX(-50%); top:100%; z-index:1; border-top:2px solid var(--main-color);
			background:#fff; padding:0.3em 0; display:none; box-shadow:0 5px 10px rgba(0,0,0,0.1);
		}
		#h_menu .outer > li > .inner > li > a { display:block; transition:all 0.4s; padding:0.83em 1.1em; font-size:0.83em; color: #000; }

		/*---------------------------------------- //inner ---------------------------------------------*/

		/* hover */
		#h_menu .outer > li:hover > a::before {width: 100%;}
		#h_menu .outer > li:hover > .inner { display:block; } 
		#h_menu .outer > li > .inner > li > a:hover { color:#fff; background:var(--main-color); } 
		#h_menu .outer > li.g01:hover .g01Inner { display: block; }

		/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
		#h_menu .outer > li > a.on::before{width: 100%;} 

		/* 스크롤 했을 때 해드 효과 */
			.header_wrap.scroll #h_menu  { 
				/* 스크롤 컬러 */
				--scroll-color: #000;
			}
	}


	@media (max-width:1200px) {
		.header_wrap { --head-font-size-pc: 16; }
		/* 로고 */
		.logo{
			/* 로고 너비 */
			--logo-width:200;
		}
		.logo a { background-size: 100%; }
		#h_menu .outer { --h-menu-gap:30; }
	}



	@media (max-width:991px) {/* 모바일 */
		.header_wrap { padding: 0; z-index:9000; }

		.logo{
			/* 로고 너비 */
			--logo-width:160;
		}

		/* 메뉴 안의 로고 */
		.logo_mob { 
			padding: 1.2em 1em;
		}
		.logo_mob > div {
			--logo-mob-width:160;
			width:calc( var(--logo-mob-width) / var(--head-font-size-mob) * 1em );
		}
		.logo_mob a { 
			display: block; background-repeat: no-repeat; background-position: center; background-size:cover;
			background-image: url(./img/logo.png); padding-bottom: calc(48 / var(--logo-mob-width) * 100% );
		}

		/* 모바일 열기 버튼 */
		.header_wrap .open_btn { font-size:20px; cursor:pointer; color:#fff; }


		/* menu */
		.menu_box { 
			--close-btn-size:50px;
			background-color:#fff; width: 80%; height: 100%; transform:translateX( calc(100% + var(--close-btn-size)) ) ;
			position: fixed; right:0; top: 0; z-index:9999; transition: 0.3s;
		}
		.menu_box_bg { position: absolute; right: 0; top: 0; z-index:8000; width: 100%; height: 100vh; background: rgba(0,0,0,0.5); }

		/* 모바일닫기버튼 */
		.close_btn { 
		position: absolute; left: 0; top: 20px; transform:translateX(-100%); background: #fff;
		width:50px; height:50px; cursor:pointer;
		}
		.close_btn > i { display:block; color:#000; text-align:center; line-height:50px; font-size:30px; }

		#h_menu {
		width: 100%; height: 100%; overflow-x: hidden; overflow-y:auto; position: absolute;  top:0; display:grid; align-content:start;
		}
		#h_menu .outer { order:3; }
		#h_menu .outer > li > a { 
		display: flex; justify-content:space-between; border-bottom: 1px solid #bbb; padding: 1em; color: #313131; transition:0.3s;
		}
		#h_menu .outer > li.dropDown > a { pointer-events:none; }
		#h_menu .outer > li.dropDown > a:after { content: '\f105'; font-family: fontAwesome; opacity: 0.6; transition:0.3s; }

		#h_menu .catalog { color: #fff; font-size: 0.8em; background: #a0a0a0; padding: 1em; text-align: center;  }
		#h_menu .catalog > li > a { display: block; color: inherit; }
		#h_menu .catalog > li > a > i { margin-left: 0.2em; transform:translateY(-7%); }

		#h_menu .outer > li > .inner { 
		border-bottom: 1px solid #bbb; display:grid; gap:0.8em; height: 0; visibility:hidden; opacity: 0; transition:0.2s;
		}
		#h_menu .outer > li > .inner > li > a { 
			--inner-mob-font-size:13;
			font-size:calc( var(--inner-mob-font-size) / var(--head-font-size-mob) * 1em );
			display:block; color: #313131; padding: 0 1.4em;
		}



		/* 모바일메뉴박스 보이게 하는 클래스 */
		.menu_box.inactive { transform:translateX(0); } 

		/* 클릭시 드롭다운 화살표 효과 */
		#h_menu .outer > li.dropDown.on > a:after { transform:rotate(90deg); opacity: 1; }

		/* 모바일에서 outer li 클릭했을때 inner 나오는 효과 */
		#h_menu .outer > li.on .inner { height: auto; visibility:visible; opacity: 1; padding: 1em 0; }

		/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
		#h_menu .outer > li > a.on { color: var(--main-color); } 

		/* 스크롤 했을 때 해드 효과 */
		.header_wrap.scroll .open_btn { color: #000; }
	}
	@media (max-width:768px) {
		.header_wrap { 
			height: var(--header-height);
		}
	}




/*--------------------------------------------------- 인덱스세팅 ----------------------------------------------------------------------------*/



#index { min-height: 50vh; }

/* 타이틀 */
#index .titleBox .text1 { 
font-size: min(4.29vw,18px); display: inline-block; position: relative; padding-bottom: 0.7em;
}
#index .titleBox .text1:after { 
content: ''; position: absolute; left: 50%; bottom: 0; transform:translateX(-50%); width: 100%; height: 3px; background: var(--main-color);
}
#index .titleBox .text2 { font-size: min(6.29vw,45px); line-height: 1.3em; padding-bottom: 0.25em; }
#index .titleBox .text3 { font-size: min(3.43vw,15px); line-height: 1.6em; }
#index .titleBox.text-white { color: #fff; }
@media (max-width:768px) {
	#index .titleBox .text1 { padding-bottom: 0.5em; margin-bottom: 0.2em; }
	#index .titleBox .text1:after { height: 2px; }
	#index .titleBox .text2 { line-height: 1.1; padding: 0.2em 0 0.4em; }
}

/* 타이틀애니메이션 */
#index .char {
display: inline-block;
animation-delay: calc(0.1s + var(--char-index) * 0.1s);
transition: all 0.1s calc(0.1s + var(--char-index) * 0.1s);
}

#index .titleBox .text1[data-scroll] { opacity: 0; transition:2s; }
#index .titleBox .text1[data-scroll]:after { width: 0; transition:1s; }
#index .titleBox .text1[data-scroll='in'] { opacity: 1; }
#index .titleBox .text1[data-scroll='in']:after { width: 100%; }
#index .titleBox .text1[data-scroll='out'] { opacity: 0; }
#index .titleBox .text1[data-scroll='out']:after { width: 0; }

#index .titleBox .text2 { transition:1s; }
#index .titleBox .text2[data-scroll='out'] { opacity: 0; transform:translateY(20%); }

#index .titleBox .text3[data-scroll] { opacity: 0; transition:2s; }
#index .titleBox .text3[data-scroll='in'] { opacity: 1; }
#index .titleBox .text3[data-scroll='out'] { opacity: 0; }
/* //타이틀애니메이션 */

/* view more */
#index .moreV1 {
--transition:0.4s;
text-align: center; font-size: min(3.71vw,15px);
}
#index .moreV1 a { display: inline-block;  color: #fff; padding: 0.6em 1.6em 0.8em; position: relative; transition:var(--transition); }
#index .moreV1 a:before { 
content: ''; position: absolute; left: 50%; bottom: 0; transform:translateX(-50%);
width: 100%; height: 100%; background: var(--main-color); border-radius:0.5em; transition:var(--transition);
}
#index .moreV1 a span { position: relative; z-index: 1; }
#index .moreV1 a .text { transition:var(--transition); position: relative; }
#index .moreV1 a .text:before { 
content: ''; position: absolute; left: 0; top: 0; background: url(./img/index_icon1.png) no-repeat center / cover; width: 1em; height: 1.2em;
transform:translate(0,-30%); transition:var(--transition); opacity: 0;
}
#index .moreV1 a .icon:before { content: '\f101'; font-family: fontAwesome; margin-left: 0.2em; }

#index .moreV1 a:hover { transform:scale(1.3); }
#index .moreV1 a:hover:before { height: 10%; width: 70%; bottom: 0.4em; }
#index .moreV1 a:hover .text { color: #000; padding-left: 1em; }
#index .moreV1 a:hover .text:before { opacity: 1; }
#index .moreV1 a:hover .icon { color: #000; }

/* section */
#index .section { font-size: min(7.14vw,50px); overflow: hidden; }

/* 애니메이션 */
#index .section > *[data-scroll] { 
opacity: 0; 
will-change:transform,scale,opacity; 
transform:translateY(6rem) scale(0.97); 
transition:all 0.8s cubic-bezier(0.165,0.84,0.44,1);
}
#index .section > *[data-scroll='in'] {
	opacity: 1;
	transform:translateY(0) scale(1);
}
#index .section > *[data-scroll='out'] {
	opacity: 0;
}

/* section1 */
#index .section1 { padding: 1.6em 0; background: url(./img/index_section1_bg.jpg) no-repeat center / cover; }
#index .section1 .titleBox { padding-bottom: 0.6em; }
#index .section1 .titleBox .text1 { color: #434343; }
#index .section1 .titleBox .text3 { color: #434343; }

/* section1 - nav */
#index .section1 .tabBox1 { --tab-color:#d6061c; }
#index .section1 .tabBox1 .nav { display:flex; justify-content:center; gap:2em; font-size: min(4.29vw,20px); font-weight: 500; color: #898989; }
#index .section1 .tabBox1 .nav > li > a { color: inherit; position: relative; }
#index .section1 .tabBox1 .nav > li > a span { position: relative; z-index: 1; color: inherit; }
#index .section1 .tabBox1 .nav > li > a:before { 
content: ''; position: absolute; left: 50%; top: 60%; transform:translate(-50%,0); width: 110%; height: 38%; background: #fbb9b9; 
border-radius:50%; display: none;
}
#index .section1 .tabBox1 .nav > li.item1 > a:before { border-radius:43%; }
#index .section1 .tabBox1 .nav > li.item2 > a:before { border-radius:55%; }
#index .section1 .tabBox1 .nav > li.item3 > a:before { border-radius:43%; }
#index .section1 .tabBox1 .nav > li.item4> a:before { border-radius:50%; }
#index .section1 .tabBox1 .nav > li:not(:last-child) > a:after {
content: '|'; font-size: 0.8em; position: absolute; right: -1.6em; top: 50%; transform:translateY(-50%);
}

/* section1 - tab-content */
#index .section1 .tabBox1 .tab-content > li { font-size: min(4.29vw,20px); padding: 1.5em 0 2.5em; }

/* active & hover */
#index .section1 .tabBox1 .nav > li > a:hover { color: var(--tab-color); }
#index .section1 .tabBox1 .nav > li.active > a { color: var(--tab-color); }
#index .section1 .tabBox1 .nav > li.active > a:before { display: block; }
@media (max-width:768px) {
	#index .section1 .titleBox .text2 b { display: block; }
}



/* section3 */
#index .section3 { 
--transition:0.4s;
padding: 1.8em 0; background: #eee;
}
#index .section3 .titleBox { padding-bottom: 0.84em; }
#index .section3 .itemBox { 
font-size: min(3.43vw,15px); display:grid; grid-template-columns:repeat(2,1fr); gap:1.2em 2em;
}
#index .section3 .itemBox > li > a { display:flex; background: #fff; border: 1px solid #959595;  }

#index .section3 .itemBox > li > a .img { width: 21.4em; overflow: hidden; }
#index .section3 .itemBox > li > a .img img { transition:var(--transition); }
#index .section3 .itemBox > li > a .textBox { 
flex:1; padding: 2em 1em 1.4em 1.6em; display:grid; align-content:space-between;
}
#index .section3 .itemBox > li > a .textBox .title { 
font-size: 1.6em; color: #000; font-weight: bold; justify-self:start; position: relative; transition:var(--transition);
}
#index .section3 .itemBox > li > a .textBox .title:before { 
content: ''; position: absolute; left: 0; top: 0; background: url(./img/index_icon1.png) no-repeat center / cover; width: 1em; height: 1.2em;
transform:translate(0,-40%); opacity: 0; transition:var(--transition);
}
#index .section3 .itemBox > li > a .textBox .text1 { font-size: 1.2em; color: #000; font-weight: 500; line-height: 1.4em; }
#index .section3 .itemBox > li > a .textBox .text2 { font-size: 1.06em; color: #898989; line-height: 1.6em; transform:translateY(-0.3em); }
#index .section3 .itemBox > li > a .textBox .moreV2 { position: relative; padding:0 0.4em; justify-self:start; color: #000; }
#index .section3 .itemBox > li > a .textBox .moreV2 .icon1 { 
position: absolute; left: 0; bottom: 0; width: 1.6em; height: 1.6em; background: #fbb9b9; border-radius:50%; transition:var(--transition);
}
#index .section3 .itemBox > li > a .textBox .moreV2 .text { position: relative;  }
#index .section3 .itemBox > li > a .textBox .moreV2 i { margin-left: 0.5em; font-size: 1.1em; transform:translateY(0.05em); }

/* hover & active */
#index .section3 .itemBox > li > a:hover .img img { transform:scale(1.05); }
#index .section3 .itemBox > li > a:hover .textBox .title { padding-left: calc(1em - 2px ); }
#index .section3 .itemBox > li > a:hover .textBox .title:before { opacity: 1; }
#index .section3 .itemBox > li > a:hover .textBox .moreV2 .icon1 { width: 100%; border-radius:0.5em; }

/* 애니메이션 */
#index .section3 .itemBox .item1[data-scroll] { opacity: 0; transition:1.5s; transform:translateY(-3rem); }
#index .section3 .itemBox .item1[data-scroll='in'] { opacity: 1; transform:translateY(0); }
#index .section3 .itemBox .item1[data-scroll='out'] { opacity: 0; transform:translateY(-3rem); }

#index .section3 .itemBox .item2[data-scroll] { opacity: 0; transition:1.5s; transform:translateX(3rem); }
#index .section3 .itemBox .item2[data-scroll='in'] { opacity: 1; transform:translateX(0); }
#index .section3 .itemBox .item2[data-scroll='out'] { opacity: 0; transform:translateX(3rem); }

#index .section3 .itemBox .item3[data-scroll] { opacity: 0; transition:1.5s; transform:translateX(-3rem); }
#index .section3 .itemBox .item3[data-scroll='in'] { opacity: 1; transform:translateX(0); }
#index .section3 .itemBox .item3[data-scroll='out'] { opacity: 0; transform:translateX(-3rem); }

#index .section3 .itemBox .item4[data-scroll] { opacity: 0; transition:1.5s; transform:translateY(3rem); }
#index .section3 .itemBox .item4[data-scroll='in'] { opacity: 1; transform:translateY(0); }
#index .section3 .itemBox .item4[data-scroll='out'] { opacity: 0; transform:translateY(3rem); }

@media (max-width:1500px) {
	#index .section3 .itemBox { gap:1.2em; }
	#index .section3 .itemBox > li > a { font-size: 0.85em; }
	#index .section3 .itemBox > li > a .img { font-size: 1.2em; }
}
@media (max-width:1200px) {
	#index .section3 .itemBox { gap:1em; }
	#index .section3 .itemBox > li > a { font-size: 0.72em; }
	#index .section3 .itemBox > li > a .img { font-size: 1.05em; }
	#index .section3 .itemBox > li > a .textBox { padding: 1.4em 1em 1.4em 1.4em; }
	#index .section3 .itemBox > li.item2 > a .textBox br { display: none; }
}
@media (max-width:991px) {
	#index .section3 .itemBox { grid-template-columns:repeat(2,auto); justify-content:center; gap:1.5em; }
	#index .section3 .itemBox > li > a { font-size: 0.9em; display:grid; grid-template-rows:auto 1fr; max-width: 323px; margin: 0 auto; height: 100%;  }
	#index .section3 .itemBox > li > a .img { font-size: 1em; width: 100%; height: 0; padding-bottom: 73.52%; }
	#index .section3 .itemBox > li > a .textBox { width: 100%; flex:auto; gap:0.8em }
}
@media (max-width:768px) {
	#index .section3 .itemBox { grid-template-columns:1fr; }
}


/* section4 */
#index .section4 { padding: 1.8em 0; }
#index .section4 .titleBox { padding-bottom: 1em; }
#index .section4 .titleBox .text3 { color: #535353; }
#index .section4 .tabBox1 { 
--transition:0.4s;
--tab-color:#0e1138;
padding-bottom: 0.8em;
}

/* section4 - nav */
#index .section4 .tabBox1 .nav { 
display:flex; font-size: min(3.14vw,18px); font-weight: 500; color: #898989; border-bottom: 2px solid #dcdcdc; margin-bottom: 2.22em;
}
#index .section4 .tabBox1 .nav > li { flex:1 1 auto; text-align: center; position: relative; }
#index .section4 .tabBox1 .nav > li:not(:last-child):after {
content: '|'; font-size: 0.8em; position: absolute; right: -1px; top: 50%; transform:translateY(-50%);
}
#index .section4 .tabBox1 .nav > li > a { color: inherit; display: block; position: relative; padding: 0.5em 0; transition:var(--transition); }
#index .section4 .tabBox1 .nav > li > a:after {
content: ''; position: absolute; left: 0; bottom: -2px; width: 100%; height: 2px; background: var(--tab-color); opacity: 0;
transition:var(--transition);
}
#index .section4 .tabBox1 .nav > li > a span { position: relative; z-index: 1; color: inherit; }

/* section4 - tab-content */
#index .section4 .tabBox1 .tab-content > li { font-size: min(3.71vw,16px); }

/* active & hover */
#index .section4 .tabBox1 .nav > li > a:hover { color: var(--tab-color); }
#index .section4 .tabBox1 .nav > li.active > a { color: var(--tab-color); }
#index .section4 .tabBox1 .nav > li.active > a:after { opacity: 1; }

@media (max-width:991px) {
	#index .section4 .tabBox1 .nav:before, 
	#index .section4 .tabBox1 .nav:after { display: none; }
	#index .section4 .tabBox1 .nav { 
	display:grid; grid-template-columns:repeat(2,1fr); border-bottom: none; gap:0.4em;
	}
	#index .section4 .tabBox1 .nav > li { flex:auto; }
	#index .section4 .tabBox1 .nav > li:not(:last-child):after { display: none; }
	#index .section4 .tabBox1 .nav > li > a { border: 1px solid var(--tab-color); color: var(--tab-color); }
	#index .section4 .tabBox1 .nav > li > a:after { display: none; }

	#index .section4 .tabBox1 .nav > li > a:hover { color: #fff; background: var(--tab-color); }
	#index .section4 .tabBox1 .nav > li.active > a { color: #fff; background: var(--tab-color); }
}


/* section5 */
#index .section5 { padding: 1em 0 0.8em; background: url(./img/index_section5_bg.jpg) no-repeat center / cover; }
#index .section5 .itemBox { display:grid; grid-template-columns:repeat(2,1fr); align-items:end; gap:20px; }

/* seciton5 - item1 */
#index .section5 .itemBox .item1 { font-size: 15px; }
#index .section5 .itemBox .item1 .titleBox { padding-bottom: 1.2em; }
#index .section5 .itemBox .item1 .titleBox .text3 { padding-bottom: 1em; }
#index .section5 .itemBox .item1 .titleBox .text4 { font-size: min(5.14vw,25px); font-weight: bold; line-height: 1.5em; padding: 0.3em 0; }
#index .section5 .itemBox .item1 .info { color: #fff; font-size: min(3.71vw,18px); line-height: 1.6em; padding-bottom: 1em; }
#index .section5 .itemBox .item1 .info a { color: inherit; }
#index .section5 .itemBox .item1 .moreV3 {
--transition:0.5s;
font-size: min(3.43vw,15px); padding-top: 1.4em;
display:flex; gap:1em; max-width: 560px;
}
#index .section5 .itemBox .item1 .moreV3 > li > a {
display:flex; align-items:center; gap:2em; border: 1px solid #fff; padding:1em 2.6em 0.8em; border-radius:0.5em; color: #fff;
overflow: hidden; position: relative; transition:var(--transition);
}
#index .section5 .itemBox .item1 .moreV3 > li > a > .icon { position: relative; z-index: 1; width: 3.4667em; }
#index .section5 .itemBox .item1 .moreV3 > li > a .inner { flex:1; }
#index .section5 .itemBox .item1 .moreV3 > li > a .inner p { font-size: 1.6em; font-weight: 500; padding-bottom: 0.6em; position: relative; z-index: 1; }
#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 { padding:0 0.4em; justify-self:start; color: #fff; }
#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 .icon1 { 
position: absolute; left: 50%; top: 50%; transform:translate(-50%,25%); width: 1.6em; height: 1.6em; background: #ff7680; border-radius:50%; 
transition:var(--transition);
}
#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 .text { position: relative; z-index: 1; }
#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 i { margin-left: 0.5em; font-size: 1.1em; transform:translateY(0.05em); }

/* seciton5 - map */
#index .section5 .itemBox .map { padding: 0 20px; }
#index .section5 .itemBox .root_daum_roughmap { width: 100%; }
#index .section5 .itemBox .root_daum_roughmap .wrap_map { height: 0; padding-bottom: 70%; }
#index .section5 .itemBox .root_daum_roughmap .map { position: absolute; }

/* hover */
#index .section5 .itemBox .item1 .moreV3 > li > a:hover .inner .moreV2 .icon1 { 
left: 50%; top: 50%; transform:translate(-50%,-50%); width: 103%; height: 103%; border-radius:0.5em;
}

/* 애니메이션 */
#index .section5 .titleBox .text4[data-scroll] { opacity: 0; transition:1.5s; transform:translateX(-2rem); }
#index .section5 .titleBox .text4[data-scroll='in'] { opacity: 1; transform:translateX(0); }
#index .section5 .titleBox .text4[data-scroll='out'] { opacity: 0; transform:translateX(-2rem); }

#index .section5 .itemBox .item1 .info[data-scroll] { opacity: 0; transition:1.5s; transform:translateX(2rem); }
#index .section5 .itemBox .item1 .info[data-scroll='in'] { opacity: 1; transform:translateX(0); }
#index .section5 .itemBox .item1 .info[data-scroll='out'] { opacity: 0; transform:translateX(2rem); }

#index .section5 .itemBox .item1 .moreV3 > .item1[data-scroll] { opacity: 0; transition:1.5s; transform:translateX(-1rem); }
#index .section5 .itemBox .item1 .moreV3 > .item1[data-scroll='in'] { opacity: 1; transform:translateX(0); }
#index .section5 .itemBox .item1 .moreV3 > .item1[data-scroll='out'] { opacity: 0; transform:translateX(-1rem); }

#index .section5 .itemBox .item1 .moreV3 > .item2[data-scroll] { opacity: 0; transition:1.5s; transform:translateX(1rem); }
#index .section5 .itemBox .item1 .moreV3 > .item2[data-scroll='in'] { opacity: 1; transform:translateX(0); }
#index .section5 .itemBox .item1 .moreV3 > .item2[data-scroll='out'] { opacity: 0; transform:translateX(1rem); }


@media (max-width:1200px) {
	#index .section5 .itemBox { grid-template-columns:1fr; gap:40px 0; }
	#index .section5 .itemBox .map { padding: 0; }
	#index .section5 .itemBox .root_daum_roughmap .wrap_map { padding-bottom: 40%; }
}
@media (max-width:768px) {
	#index .section5 .itemBox .item1 .titleBox .text4 br { display: none; }
	#index .section5 .itemBox .item1 .moreV3 > li { flex:1; }
	#index .section5 .itemBox .item1 .moreV3 > li > a { font-size: 0.9em; }
	#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 { position: relative; }
	#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 .icon1 { transform:translate(0,0); left: 0; bottom: 0; top: auto; }
	#index .section5 .itemBox .root_daum_roughmap .wrap_map { padding-bottom: 56.25%; }

	#index .section5 .itemBox .item1 .moreV3 > li > a:hover .inner .moreV2 .icon1 { height: 150%; }
}
@media (max-width:550px) {
	#index .section5 .itemBox .item1 .moreV3 > li > a { font-size: 0.85em; padding:1em 1.5em 0.8em; gap:1em; justify-content:center; }
	#index .section5 .itemBox .item1 .moreV3 > li > a > .icon { width: 3em; }
	#index .section5 .itemBox .item1 .moreV3 > li > a .inner p { font-size: 1.4em; }
}
@media (max-width:480px) {
	#index .section5 .itemBox .item1 .moreV3 { flex-wrap:wrap; max-width: 250px; margin: 0 auto;  }
	#index .section5 .itemBox .item1 .moreV3 > li { flex:auto; width: 100%; }
	#index .section5 .itemBox .item1 .moreV3 > li > a  { display:grid; grid-template-columns:40px auto; padding: 10px 15px; }
	#index .section5 .itemBox .item1 .moreV3 > li > a > .icon { width: auto; }
	#index .section5 .itemBox .item1 .moreV3 > li > a .inner { flex:auto; }
	#index .section5 .itemBox .item1 .moreV3 > li > a .inner p { font-size: 15px; }
	#index .section5 .itemBox .item1 .moreV3 > li > a .inner .moreV2 { font-size: 11px; }
	#index .section5 .itemBox .root_daum_roughmap .wrap_map { padding-bottom: 70%; }
}


/* section6 */
#index .section6 { padding: 1em 0;  }
#index .section6 .titleBox { padding-bottom: 1em; }
#index .section6 .itemBox { position: relative; padding-bottom: 56.25%; }
#index .section6 .itemBox iframe { width: 100%; height: 100%; position: absolute;  }

/*--------------------------------------------------- 인덱스세팅 끝 ----------------------------------------------------------------------------*/



/*--------------------------------------------------- 푸터세팅 ----------------------------------------------------------------------------*/
/* footer*/
footer { 
--footer-color1: #fff; font-size: 15px;
background: #313131;
overflow: hidden;
}

footer > .contents_box[data-scroll] { opacity: 0; transition:1s; transform:translateY(0.5em); }
footer > .contents_box[data-scroll='in'] { opacity: 1; transform:translateY(0); }
footer > .contents_box[data-scroll='out'] { opacity: 0; transform:translateY(0.5em); }

footer .info { border-bottom: 1px solid #6e6e6e; }
footer .info .containerV1 { 
-ms-display:flex; -ms-flex-wrap:wrap; 
display:flex; flex-wrap:wrap; 
text-align: center; padding-top: 1em; padding-bottom: 1em;
}
footer .info .containerV1 > li { position:relative; }
footer .info .containerV1 > li:before { 
content:''; position:absolute; right:0.5em; top:50%; transform:translateY(-45%); width:1px; height:0.8em; background:var(--footer-color1); 
}
footer .info .containerV1 > li:last-child:before { display:none; }
footer .info .containerV1 > li > a { 
display:block; color:var(--footer-color1); line-height:1.8; margin-right:1.3em; 
}  

footer .contents { display:flex; flex-wrap:wrap; gap:1em; padding: 2.6em 0 1.6em; }
footer .contents .item1 { flex:1; }
footer .contents .item1 .f_logo { transform:translateY(-15px); display: inline-block; }
footer .contents .item2 { flex:2.4; display:grid; align-content:space-between; }
footer .contents .item2 > div { line-height: 1.6; color: var(--footer-color1); }
footer .contents .item2 > div a { color: inherit;}
footer .contents .item2 .text > span { position: relative; margin-right:1.2em; font-weight: inherit;  }
footer .contents .item2 .text > span:before { 
content:''; position:absolute; right:-0.8em; top:50%; transform:translateY(-45%); width:1px; height:0.8em; background:var(--footer-color1); 
}
footer .contents .item2 .text > span:last-child:before { display:none; }
footer .contents .item2 > .copy { text-transform: uppercase; font-weight: inherit; align-self:end; }
footer .contents .item3 { flex:1; align-self:center; }
footer .contents .item3 .inner { display:flex; justify-content:flex-end; gap:0.2em; }



@media (max-width:1200px) {
	footer .contents .item2 { flex:auto; width: 100%; }
	footer .contents .item1 { order:1; display:flex; justify-content:center; }
	footer .contents .item2 { order:3; text-align: center; }
	footer .contents .item3 { order:2; align-self:start; }
	footer .contents .item3 .inner { justify-content:center; }
}


@media (max-width:768px) {
	footer { font-size: 13px; --footer-color1: #747474; background: #fff; }
	footer > .contents_box { padding: 0; }
	footer > .contents_box .containerV1 { padding: 0; }

	footer .info { background: #fff; border-top: 1px solid #777; border-bottom: 1px solid #777; }
	footer .info .containerV1 { margin-top: 0; padding-top: 0.5em; padding-bottom: 0.5em; font-size: 0.9em; }
	footer .info .containerV1 > li { width:50%; }
	footer .info .containerV1 > .li1 { order:1; }
	footer .info .containerV1 > .li2 { order:4; }
	footer .info .containerV1 > .li3 { order:3; }
	footer .info .containerV1 > .li4 { order:2; }
	footer .info .containerV1 > li:before { right: 0; }
	footer .info .containerV1 > li:nth-child(2n):before { display:none; }
	footer .info .containerV1 > li > a { margin-right: 0; font-weight: bold; }

	footer .contents { gap:0; padding: 0; }
	footer .contents :is(.item1,.item3) { display: none; }
	footer .contents .item2 { text-align: left; background: #f9f9f9; }
	footer .contents .item2 > div { padding: 2em 1em; font-size: 0.85em; }
	footer .contents .item2 .text { display:grid; grid-template-columns:1fr 2fr; }
	footer .contents .item2 .text > span:before { display: none; }
	footer .contents .item2 > .copy { text-align: center; font-size: 0.8em; font-weight: bold; padding: 1em 0; background: #eee; color: #777; }
	footer .contents .item2 > .copy a { font-weight: inherit; color: #777; }
}
/*--------------------------------------------------- 푸터세팅 끝 ----------------------------------------------------------------------------*/








/* 서브페이지 패딩 */
.tmt_sub_frame { padding:40px 0 50px; min-height: 70vh; overflow: hidden; }
.tmt_sub_frame .containerV1[data-scroll] { 
opacity: 0; 
will-change:transform,opacity; 
transform:translateY(1rem); 
transition:all 1s cubic-bezier(0.165,0.84,0.44,1);
}
.tmt_sub_frame .containerV1[data-scroll='in'] {
	opacity: 1;
	transform:translateY(0);
}
.tmt_sub_frame .containerV1[data-scroll='out'] {
	opacity: 0;
}


/* 게시판 및 게시판헤드 등 기타 버튼들 기본컬러 변경 */
.btn.btn-color {border: 1px solid var(--main-color); background-color: var(--main-color);}
.btn.active.btn-color, .btn.btn-color:hover, .btn.btn-color:focus, .btn.btn-color:active {background-color: var(--main-color);}
.border-color, i.border-color, img.border-color {border-color: var(--main-color);}

/* 모달 z-index높이기 (해드에 가려지는 경우 발견해서) */
.modal { z-index: 9999; }
.modal-backdrop { z-index: 9998; }