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


@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



.clear:after { 
    content:""; 
    display:block; 
    clear:both;
}
* { margin:0; padding:0; outline:none; }
html { position: relative; 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;  }
ul, ol { list-style:none; margin:0; }
a { outline:0; text-decoration:none; }
a:focus { outline:none; }
img { border:none; outline:none; max-width: 100%; }

p { margin:0; padding:0; word-wrap: break-word; word-break: keep-all;  }

/* html 폰트 사이즈 */
/* 1024이상 - 낮은 해상도의 pc, 태블릿 가로 */
@media (max-width:1400px) {
	html { font-size: 9px; }
}
@media (max-width:1023px) { /* 태블릿 가로 */
	html { font-size: 8.5px; }
}
@media (max-width:767px) { /* 태블릿, 모바일 가로 */
	html { font-size: 7.5px; }
}
@media (max-width:480px) { /* 모바일 */
	html { font-size: 6.5px; }
}

/*
mainColor
#054a95

*/

/* container */
.containerV1 { width: 1200px; margin: 0 auto; max-width: 100%; }
@media (max-width:1230px) {
	.containerV1 { padding: 0 15px; }
}


/*페이지 변수	*/

:root{
	--font-size13: min(3.43vw, 13px);
	--font-size14: min(3.71vw, 14px);
	--font-size15: min(4vw, 15px);
	--font-size16: min(3.71vw, 16px);
	--font-size18: min(4.29vw, 18px);
	--font-size20: min(4.86vw, 20px);
	--font-size25: min(6.25vw, 25px);
	--font-size30: min(5.71vw, 30px);
	--font-size40: min(8.57vw, 40px);
	--font-size50: min(12.50vw, 50px);

	--color-main: #323bb0; /*파란색*/
	--color-main2: #f6cf4e; /*노란색*/
	--color-main3: #ef3f3f; /*빨간색*/
	--color-main4: #99d9d9; /*민트색*/
	
}



/*--------------------------------------------------- 해드세팅 ----------------------------------------------------------------------------*/
.header_wrap { 
position: sticky; right:0; top:0; width:100%; z-index:1001; background: #fff;
}

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

}

.logo a { 
display: block; transition:0.4s;
}


/* menu */
/*---------------------------------------- main_menur ---------------------------------------------*/
#h_menu .main_menu { -ms-display:flex; display:flex; }
#h_menu .main_menu > li { position:relative; margin-right: 8.5rem;} 
#h_menu .main_menu > li:last-child { margin-right: 15px;}
#h_menu .main_menu > li > a {
display:block; font-size: var(--font-size18); font-weight:500; text-align:center; transition:0.3s; color: #000; height: 10rem; line-height: 10rem;}


/*span-before*/
#h_menu .main_menu > li > a > span {position: relative;}
#h_menu .main_menu > li > a > span::after {content:""; position: absolute; border-radius: 50%; top: 10%; left: -15%; width: 0px; height: 0px; background: #333;
transition: all 0.3s; transform: translate(-50%, -50%); opacity: 0; visibility: hidden;}

#h_menu .main_menu > li:nth-child(1) > a > span::after {background: #000;}
#h_menu .main_menu > li:nth-child(2) > a > span::after {background: var(--color-main);}
#h_menu .main_menu > li:nth-child(3) > a > span::after {background: var(--color-main2);}
#h_menu .main_menu > li:nth-child(4) > a > span::after {background: var(--color-main3);}

#h_menu .main_menu > li:last-child > a > span {font-size: min(5.75vw, 23px);}
#h_menu .main_menu > li:last-child > a > span::after {display: none;}

/*유튜브 영상 링크*/
#h_menu a {display: none;}
#h_menu .main_menu > li:last-child > a span i{color: #ff2c2c;}
/*---------------------------------------- //main_menu ---------------------------------------------*/


/*---------------------------------------- sub_menu ---------------------------------------------*/
#h_menu .main_menu > li > .sub_menu {
position:absolute; right:0; top:100%; z-index:-1; border-radius: 10px; margin-top: 0px; border: 1px solid #ccc; 
width:20rem; background:#fff; padding:10px 0;  box-shadow:0 5px 5px rgba(0,0,0,0.2); opacity: 0; visibility: hidden; transition: all 0.2s;}

/*opacity: 0; visibility: hidden;*/
#h_menu .main_menu > li > .sub_menu > li > a  { display:block; transition:all 0.4s; padding:15px 20px; font-size:15px; text-align:right; }
#h_menu .main_menu > li > .sub_menu > li > a span {position: relative; left: 0; transition: left 0.4s;}
/*---------------------------------------- //sub_menu ---------------------------------------------*/


/*opacity: 1; visibility: visible;*/
/* hover */
#h_menu .main_menu > li:hover > a > span::after {opacity: 1; visibility: visible; width: 8px; height: 8px;}
#h_menu .main_menu > li:hover > .sub_menu {opacity: 1; visibility: visible; margin-top: 5px; z-index: 2;}
#h_menu .main_menu > li:nth-child(1) > .sub_menu > li > a:hover { color:#fff; background: #000; } 
#h_menu .main_menu > li:nth-child(2) > .sub_menu > li > a:hover { color:#fff; background: var(--color-main); } 
#h_menu .main_menu > li:nth-child(3) > .sub_menu > li > a:hover { color:#fff; background: var(--color-main2); } 
#h_menu .main_menu > li:nth-child(4) > .sub_menu > li > a:hover { color:#fff; background: var(--color-main3); } 
#h_menu .main_menu > li > .sub_menu > li > a:hover span {left: 5px;}

/* 스크롤 했을 때 해드 효과 */
.header_wrap.scroll {border-bottom: 1px solid #00000024;}
/*.header_wrap.scroll #header { height: 6.2rem;  }*/
/*.header_wrap.scroll .logo a { margin-bottom: 0; }*/
/*.header_wrap.scroll #h_menu .main_menu > li > a { height: 6.2rem; line-height: 6.2rem; }*/


/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
#h_menu .main_menu > li > a.on > span::after {opacity: 1; visibility: visible;} 





@media (max-width:1400px) {
/*	#h_menu .main_menu > li { position:relative; margin-right: 5rem; } */
/*	#h_menu .main_menu > li > a { font-size: 16px; }*/
}



/*모바일 991구간---------------------*/
@media (max-width:991px) {
	#header { height: 8rem; }
	
	.logo a { margin-bottom: 0; width: 25rem; height: auto; }

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


	/* menu */
	.menu_box { 
	background-color: var(--color-main); width: 20em; height: 100%; 
	position: fixed; right:0; top: 0; z-index:9999; margin-right:-20em; transition:margin-right 0.3s;
	}
	#h_menu {
	width: 20em; height: 100%; overflow-x: hidden; overflow-y:auto; position: absolute;  top:0; 
	}

	/* 모바일닫기버튼 */
	.close_btn { width:50px; height:50px; margin-right:auto; margin-left:0; cursor:pointer; }
	.close_btn > i { display:block; color:#fff; text-align:center; line-height:50px; font-size:30px; }


	/*	임시 수정 위에 되어 있는 것에 추가한 것임*/
	.menu_box {background: #fff; border-left: 1px solid rgba(0,0,0,0.2);}
	.close_btn > i {color: #333;}


	/*---------------------------------------- main_menu ---------------------------------------------*/
	#h_menu .main_menu { flex-wrap:wrap; padding:30px 0; border-top:1px solid rgba(255,255,255,.1); }
	#h_menu .main_menu > li { width:100%; margin-right: 0; cursor: pointer;}
	#h_menu .main_menu > li > a { 
	padding:12px 20px; font-weight:500; color:#fff; text-align:left; height:auto; line-height:1; border-bottom:1px solid rgba(255,255,255,.4);
	font-size: 16px;  pointer-events:none;}
	
	#h_menu .main_menu > li.on > a > span { padding:0; position: relative;}
	#h_menu .main_menu > li.on > a > span::before {content: ""; position: absolute; left: 9%; width: 8px; height: 8px; top: 50%; transform: translateY(-50%); background: #fff; border-radius: 50%;
	opacity: 0; visibility: hidden; transition: all 0.5s;}
	
	#h_menu .main_menu > li:hover > a > span::after {display: none; opacity: 0; visibility: hidden;}
	/*hover시 안 보이게*/
	

	/*유튜브 영상 링크*/
	#h_menu .main_menu > li:last-child {display: none;}
	
	#h_menu > a {display: block; font-size: var(--font-size18); padding:  10px; border: 1px solid rgba(255,255,255,0.5); width: 100%; max-width: 80%; margin: 0 auto; border-radius: 10px; }
	#h_menu > a span {display: flex; align-items: center; justify-content: center; gap: 0 5px;}
	#h_menu > a span > span {display: block;}
	#h_menu > a {text-align: center;}
	#h_menu > a span i {color: #ff2c2c;}
	#h_menu > a {color: #fff;}


	/*	임시 수정 위에 되어 있는 것에 추가한 것임*/
	#h_menu .main_menu {border-top:1px solid rgba(0,0,0,.2);}
	#h_menu .main_menu > li > a {color: #333; border-bottom: 1px solid rgba(0,0,0,0.2);}
	#h_menu .main_menu > li.on:nth-child(1) > a > span::before {background: #000;}
	#h_menu .main_menu > li.on:nth-child(2) > a > span::before {background: var(--color-main);}
	#h_menu .main_menu > li.on:nth-child(3) > a > span::before {background: var(--color-main2);}
	#h_menu .main_menu > li.on:nth-child(4) > a > span::before {background: var(--color-main3);}

	#h_menu > a {border-style: none; border-bottom: 1px solid rgba(0,0,0,0.2); max-width: 100%; border-radius: 0;}
	#h_menu > a span i {display: none;}
	#h_menu > a {color: #333;}

	/*---------------------------------------- //main_menu ---------------------------------------------*/

	/*---------------------------------------- sub_menu ---------------------------------------------*/
	#h_menu .main_menu > li > .sub_menu { 
	position:static; width:100%; padding: 0;  background:none; border-style: none;
	box-shadow:none; height: 0; transition: all 0.5s; display: block; opacity: 1; visibility: visible; overflow: hidden;
	}
/*	#h_menu .main_menu > li > .sub_menu > li {border-left:1px solid rgba(255,255,255,0.4);}*/
	#h_menu .main_menu > li > .sub_menu > li:last-child > a { border-bottom:none; }
	#h_menu .main_menu > li:last-child { margin-right: 0; }
	#h_menu .main_menu > li > .sub_menu > li > a { padding:10px 0 10px 15px; font-size: 14px; position:relative; text-align:left; color:#fff; }
	#h_menu .main_menu > li > .sub_menu > li > a:before {
	content:''; position:absolute; left:-1%; top:50%; transform:translateY(-50%); width:4px; height:4px; border-radius:50%; background:#fff;}


	/*	임시 수정 위에 되어 있는 것에 추가한 것임*/
	#h_menu .main_menu > li > .sub_menu > li > a {color: #333;}
	#h_menu .main_menu > li > .sub_menu > li > a:before {background: #333;}

	

	/*---------------------------------------- //sub_menu ---------------------------------------------*/
	

	/* hover */
	#h_menu .main_menu > li:hover > a {color:rgba(255,255,255,0.7); }
	#h_menu .main_menu > li:hover .sub_menu { display:block; margin-top: 0;} /* 모바일일때 inner 나오게 하는 후버 효과 X */
	#h_menu .main_menu > li > .sub_menu > li > a:hover { color:#fff; background:none; } 
	#h_menu .main_menu > li > .sub_menu > li > a:hover span {left: 0px;}


	/* 모바일메뉴박스 보이게 하는 클래스 */
	.menu_box.inactive { margin-right:0; } 

	/* 모바일에서 main_menu li 클릭했을때 sub_menu 나오는 효과 */
	#h_menu .main_menu > li.on > a {color: #fff;}
	#h_menu .main_menu > li.on > a > span {padding-left: 25px; transition: all 0.4s;}
	#h_menu .main_menu > li.on > a > span::before {opacity: 1; visibility: visible;}
	#h_menu .main_menu > li.on > a { border-bottom:1px solid transparent; }
	#h_menu .main_menu > li.on .sub_menu {height: auto; padding-left: 40px; padding-top: 10px; padding-bottom: 10px;}

	/* 스크롤 했을 때 해드 효과 */
/*	.header_wrap.scroll #header {border-bottom: 1px solid #00000024;}*/
	.header_wrap.scroll #h_menu .main_menu > li > a {}

	/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
	#h_menu .main_menu > li > a.on,
	.header_wrap.scroll #h_menu .main_menu > li > a.on { color:#fff;} 
	#h_menu .main_menu > li > a.on > span {padding-left: 25px; transition: all 0.4s;}
	#h_menu .main_menu > li > a.on span::before,
	.header_wrap.scroll #h_menu .main_menu > li > a.on span::before{content: "";  position: absolute; left: 9%; width: 8px; height: 8px; top: 50%; transform: translateY(-50%); 
	background: #fff; border-radius: 50%; opacity: 1; visibility: visible;}

	#h_menu .main_menu > li:last-child > a.on span::before,
	.header_wrap.scroll #h_menu .main_menu > li:last-child > a.on span::before {display: none;}

	#h_menu .main_menu > li:nth-child(1) > .sub_menu > li > a:hover { color:#fff; background: none; } 
	#h_menu .main_menu > li:nth-child(2) > .sub_menu > li > a:hover { color:#fff; background: none; } 
	#h_menu .main_menu > li:nth-child(3) > .sub_menu > li > a:hover { color:#fff; background: none; } 


	/*	임시 수정 위에 되어 있는 것에 추가한 것임*/
	#h_menu .main_menu > li.on > a {color: #333;}
	#h_menu .main_menu > li > a.on,
	.header_wrap.scroll #h_menu .main_menu > li > a.on { color:#333;} 
	#h_menu .main_menu > li:nth-child(1) > a.on span::before,
	.header_wrap.scroll #h_menu .main_menu > li:nth-child(1) > a.on span::before {background: #000;}
	#h_menu .main_menu > li:nth-child(2) > a.on span::before,
	.header_wrap.scroll #h_menu .main_menu > li:nth-child(2) > a.on span::before {background: var(--color-main);}
	#h_menu .main_menu > li:nth-child(3) > a.on span::before,
	.header_wrap.scroll #h_menu .main_menu > li:nth-child(3) > a.on span::before {background: var(--color-main2);}
	#h_menu .main_menu > li:nth-child(4) > a.on span::before,
	.header_wrap.scroll #h_menu .main_menu > li:nth-child(4) > a.on span::before {background: var(--color-main3);}

	#h_menu .main_menu > li:hover > a {color: #333; } 
	#h_menu .main_menu > li > .sub_menu > li > a:hover { color:#333; background:none; }
	#h_menu .main_menu > li:nth-child(1) > .sub_menu > li > a:hover { color:#333; background: none; } 
	#h_menu .main_menu > li:nth-child(2) > .sub_menu > li > a:hover { color:#333; background: none; } 
	#h_menu .main_menu > li:nth-child(3) > .sub_menu > li > a:hover { color:#333; background: none; } 
	#h_menu .main_menu > li:nth-child(4) > .sub_menu > li > a:hover { color:#333; background: none; } 


}/*991 끝 구간---------------------*/


.title_pc {width:100%; height:100%;}

/*--------------------------------------------------- 해드세팅 끝 ----------------------------------------------------------------------------*/

.main { position:relative; overflow:hidden;}
/*.main > iframe { position:absolute; left:0; top:0; height:100%; width: 100%; }*/
/*.main .videoPlay { */
/*position: absolute; left: 50%; top: 49.8%; transform:translate(-50%,-50%); z-index: 1000; width: 100px; height: 100px; border: 2px solid #fff; border-radius:50%;*/
/*color: #fff;*/
/*}*/
/*.main .videoPlay > i { position: absolute; left: 50%; top: 50%; transform:translate(-36%,-50%); font-size: 50px; color: #fff; }*/
/*@media (max-width:768px) {*/
/*	.main { overflow:auto; padding: 0; height: auto; }*/
/*}*/


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

/*공통*/
	.index_frame {padding: 60px 0 70px 0; }
	.index_frame .frameBox  .containerV1 > * {width: 100%;}
	.index_frame .title-V1 {font-size: var(--font-size30); color: #000; line-height: 1.2;}
	.index_frame .title-V1 > b {font-size: var(--font-size50);}
	.index_frame .text1 {font-size: var(--font-size20); color: #000; line-height: 1.2;}



/*	frame01	*/

	.index_frame01 .frameBox  > .title_box {display: flex; justify-content: center; margin-bottom: 45px;}
	.index_frame01 .itemBox {display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(130px, auto); gap: 7px; font-size: 10px;}
	.index_frame01 .itemBox > li a {width: 100%; height: 100%; background: #eee; border-radius: 10px; display: flex; gap: 0 10px; padding: 10px 4em; justify-content: space-between; align-items: center; 
	position: relative; overflow: hidden;}
	.index_frame01 .itemBox > li a::after {content:""; position: absolute; height: 100%; left: -60%; top: 0; transform: skew(50deg); transition-duration: 0.6s; transform-origin: top left;  width: 0; 
	background: var(--color-main); z-index: 1;}
	.index_frame01 .itemBox > li a > * {position: relative; z-index: 2;}
	.index_frame01 .itemBox > li .item_text p.text1 {color: #313131; line-height: 1.3; transition: all 0.3s;}
	.index_frame01 .itemBox > li a > .item_img {transform-origin: center; transition: all 0.2s; transform: rotate(0deg);  animation: move 1s ease-in infinite alternate;}
	

	.index_frame01 .itemBox > li a:hover:after {height: 100%; width: 175%;}
	.index_frame01 .itemBox > li a:hover > .item_text p.text1 {color: #fff;}

	@keyframes move {
		0% { transform: rotate(5deg); }
		100% { transform: rotate(-5deg); }
	}	

	@media all and (max-width: 1230px) {
		.index_frame01 .itemBox {font-size: 0.81vw;}/*1230 10px*/
		.index_frame01 .itemBox > li .item_text p.text1 {font-size: 2em;}
	}

	@media all and (max-width: 991px) {
		.index_frame01 .itemBox {grid-auto-rows: minmax(250px, auto);}
		.index_frame01 .itemBox > li .item_text p.text1 {font-size: var(--font-size20);}
		.index_frame01 .itemBox > li a {flex-direction: column; gap: 20px 0; padding: 23px 4em;}
		.index_frame01 .itemBox > li a::after {display: none;}
		.index_frame01 .itemBox > li a:hover > .item_text p.text1 {color: #313131;} 
		.index_frame01 .itemBox > li a > .item_img { animation: unset;}
		.index_frame01 .itemBox > li .item_text p.text1 {text-align: center;}

	}

	@media all and (max-width: 768px) {
		.index_frame01 .itemBox {grid-template-columns: repeat(2, 1fr); grid-auto-rows: minmax(150px, auto);}
		.index_frame01 .itemBox > li a {flex-direction: unset; gap: 0 20px; padding: 10px 4em;}	
		.index_frame01 .itemBox > li .item_text p.text1 {text-align: left;}
		
	}
	@media all and (max-width: 600px) {
		.index_frame01 .itemBox {grid-template-columns: repeat(1, 1fr);}
		.index_frame01 .itemBox > li a > * {width: calc(100% / 2 - 20px); display: flex; justify-content: center;}
		.index_frame01 .itemBox > li .item_text p.text1 {text-align: center;}
	}
	

	

/*frame02*/
.index_frame02 {background: #f7f7f7; padding: 60px 0 40px 0;}
.index_frame02 .frameBox > input {display: none;}
.index_frame02 .frame_title {display: flex; justify-content: space-between; padding-bottom: 20px; flex-wrap: wrap;}
.index_frame02 .frame_title .title_box {margin-right: 20px;}
.index_frame02 .frame_title .label_box {display: flex; gap: 0 20px; font-size: 10px;}
.index_frame02 .frame_title .label_box > label {font-size: max(15px, 2em); font-weight: bold; color: #959595; line-height: 1.2; text-align: center;  transition: all 0.2s;
display: flex; align-items: end; justify-content: center; position: relative;}
.index_frame02 .frame_title .label_box > label::before {position: absolute; content:""; top: 97%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 15px; border-radius: 50%; 
background: #82daf7; z-index: 1; opacity: 0; visibility: hidden; transition: all 0.2s;} 
.index_frame02 .frame_title .label_box > label > span {position: relative; cursor: pointer; z-index: 2;}

.index_frame02 .tab_item { position: relative; padding-bottom: 58%;}
.index_frame02 .tab_item > li {position: absolute; top: 28px; left: 0; width: 100%; height: 100%;  transition: all 0.2s; opacity: 0; visibility: hidden; z-index: -1;}
/*padding-bottom: 52%;*/

/*click*/
.index_frame02 .frameBox > #tab01:checked ~ .frame_title > .label_box > .label01,
.index_frame02 .frameBox > #tab02:checked ~ .frame_title > .label_box > .label02,
.index_frame02 .frameBox > #tab03:checked ~ .frame_title > .label_box > .label03,
.index_frame02 .frameBox > #tab04:checked ~ .frame_title > .label_box > .label04,
.index_frame02 .frameBox > #tab05:checked ~ .frame_title > .label_box > .label05,
.index_frame02 .frameBox > #tab06:checked ~ .frame_title > .label_box > .label06,
.index_frame02 .frameBox > #tab07:checked ~ .frame_title > .label_box > .label07,
.index_frame02 .frameBox > #tab08:checked ~ .frame_title > .label_box > .label08 {color: var(--color-main);}

.index_frame02 .frameBox > #tab01:checked ~ .frame_title > .label_box > .label01::before,
.index_frame02 .frameBox > #tab02:checked ~ .frame_title > .label_box > .label02::before,
.index_frame02 .frameBox > #tab03:checked ~ .frame_title > .label_box > .label03::before,
.index_frame02 .frameBox > #tab04:checked ~ .frame_title > .label_box > .label04::before,
.index_frame02 .frameBox > #tab05:checked ~ .frame_title > .label_box > .label05::before,
.index_frame02 .frameBox > #tab06:checked ~ .frame_title > .label_box > .label06::before,
.index_frame02 .frameBox > #tab07:checked ~ .frame_title > .label_box > .label07::before,
.index_frame02 .frameBox > #tab08:checked ~ .frame_title > .label_box > .label08::before {opacity: 1; visibility: visible;} 


.index_frame02 .frameBox > #tab01:checked ~ .tab_item > li.tab_item01,
.index_frame02 .frameBox > #tab02:checked ~ .tab_item > li.tab_item02,
.index_frame02 .frameBox > #tab03:checked ~ .tab_item > li.tab_item03,
.index_frame02 .frameBox > #tab04:checked ~ .tab_item > li.tab_item04,
.index_frame02 .frameBox > #tab05:checked ~ .tab_item > li.tab_item05,
.index_frame02 .frameBox > #tab06:checked ~ .tab_item > li.tab_item06,
.index_frame02 .frameBox > #tab07:checked ~ .tab_item > li.tab_item07,
.index_frame02 .frameBox > #tab08:checked ~ .tab_item > li.tab_item08 {opacity: 1; visibility: visible; z-index: 2;}


@media all and (max-width: 1230px) {
	.index_frame02 .frame_title {flex-direction: column; gap: 50px 0; padding-bottom: 10px; align-items: center;}
	.index_frame02 .frame_title .title_box {text-align: center;}
	.index_frame02 .tab_item {padding-bottom: 60%;}
}

@media all and (max-width: 991px) {
	.index_frame02 .frame_title .label_box {display: grid; grid-template-columns: repeat(4, 1fr); width: 100%; gap: 10px; font-size: 1.01vw;}
	.index_frame02 .frame_title .label_box > label::before {width: 50%;}
	.index_frame02 .tab_item {padding-bottom: 120vw;}
}
@media all and (max-width: 768px) {
	.index_frame02 .tab_item {padding-bottom: 130vw;}
}

@media all and (max-width: 580px) {
	.index_frame02 .frame_title .label_box > label::before {width: 70%;}
}


@media all and (max-width: 480px) {
	.index_frame02 .tab_item {padding-bottom: 155vw;}
	.index_frame02 .frameBox .frame_btn {margin: 40px auto 30px auto;}
	.index_frame02 .frame_title .label_box > label::before {width: 70%;}
}

@media all and (max-width: 450px) {
	.index_frame02 .frame_title .label_box > label::before {width: 100%;}
}





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






/*--------------------------------------------------- 푸터세팅 인규 ----------------------------------------------------------------------------*/


/*--------------------------------------------------- 푸터세팅 ----------------------------------------------------------------------------*/

.ik_copy_frame {background: #313131;}
.ik_copy_frame .copy_box {padding: 12px 0;}
.ik_copy_frame .containerV1 {color: #fff; font-size: var(--font-size15); line-height: 25px; display: flex;}
.ik_copy_frame .containerV1 a {color: #fff;}

.ik_copy_frame .containerV1 .logo_box {width: 300px; padding-top: 2.3%;}
.ik_copy_frame .containerV1 .logo_box .f_logo_img {width:100%;}
.ik_copy_frame .containerV1 .copy_list {width: 55%; padding: 27.5px 5px;}
.ik_copy_frame .containerV1 .copy_list .list_box1 {display: flex; gap: 0 15px;}
.ik_copy_frame .containerV1 .copy_list .list_box1 span {position: relative;}
.ik_copy_frame .containerV1 .copy_list .list_box1 span::before {content: ""; position: absolute; width: 1px; height: 13px; background: #fff; right: -10px; top: 50%; transform: translateY(-50%);}
.ik_copy_frame .containerV1 .copy_list .list_box1 span:last-child:before {display: none;} 
.ik_copy_frame .containerV1 .copy_list .list_box2 {display: flex; gap: 0 15px; flex-wrap: wrap;}
.ik_copy_frame .containerV1 .copy_list .list_box2 li {position: relative;}
.ik_copy_frame .containerV1 .copy_list .list_box2 li::before {content: ""; position: absolute; width: 1px; height: 13px; background: #fff; right: -10px; top: 50%; transform: translateY(-50%);}
.ik_copy_frame .containerV1 .copy_list .list_box2 li:last-child:before {display: none;}

.ik_copy_frame .containerV1 .link_box {display: flex; align-items: center; width: 20%; justify-content: end;}
.ik_copy_frame .containerV1 .link_box > a {display: block; width: 100%; max-width: 150px; height: 40px; box-sizing: border-box; border: 1px solid #fff; color: #fff; text-align: center; line-height: 40px;
font-size: 15px; border-radius: 10px;}


@media (max-width:1400px) {
/*	.ik_copy_frame .containerV1 .copy_list {padding: 27.5px 5px 27.5px 30px;}*/
}
@media (max-width:991px) {
	.ik_copy_frame .containerV1 {flex-direction: column;}
	.ik_copy_frame .containerV1 .copy_list .list_box1 {display: none;}
	.ik_copy_frame .containerV1 .logo_box .f_logo_img img {display: block; margin: 0 auto;}
	.ik_copy_frame .containerV1 .logo_box {width: 100%;}
	.ik_copy_frame .containerV1 .copy_list {width: 100%; padding: 20px 5px; display: flex; flex-direction: column; align-items: center;}
	.ik_copy_frame .containerV1 .copy_list .copy_text {text-align: center; margin-top: 10px;}
	.ik_copy_frame .containerV1 .copy_list .list_box2 {text-align: center; justify-content: center; }
	.ik_copy_frame .containerV1 .link_box {width: 100%; justify-content: center; padding: 15px 0;}
}


@media (max-width: 500px) {
	/* .ik_copy_frame .containerV1 .copy_list {gap: 30px 0;} */
/*	.ik_copy_frame .containerV1 .copy_list .list_box1 {flex-wrap: wrap; display: grid; grid-template-columns: repeat(2, 1fr); text-align: center; width: 100%; margin-bottom: 10px;}*/
	.ik_copy_frame .containerV1 .copy_list .list_box1 span:nth-child(1) {order: 1;}
	.ik_copy_frame .containerV1 .copy_list .list_box1 span:nth-child(2) {order: 3;}
	.ik_copy_frame .containerV1 .copy_list .list_box1 span:nth-child(3) {order: 4;}
	.ik_copy_frame .containerV1 .copy_list .list_box1 span:nth-child(3):before {display: none;}
	.ik_copy_frame .containerV1 .copy_list .list_box1 span:nth-child(4) {order: 2;}

}
	
/*--------------------------------------------------- 푸터세팅 끝 ----------------------------------------------------------------------------*/





.subMob {height: 7.294rem; background: transparent;}

/* 서브페이지 패딩 */
.tmt_sub_frame { padding:30px 0 50px; min-height: 80vh;}




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


/* 모바일 사이즈에서도 위 위젯설정 버튼 보이게 */
@media (max-width:767px) {
	#style-switcher { display: block !important; }
}



/* 모달창 관련 */