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

.clear:after { 
    content:""; 
    display:block; 
    clear:both;
}
* { margin:0; padding:0; outline:none; box-sizing:border-box; }
html { font-size: 10px; scroll-behavior: smooth;}
body {
line-height:1; font-size:14px; font-weight:400; color:#000; font-family: 'Pretendard', sans-serif; word-wrap: break-word; word-break: keep-all;
overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 { margin:0; font-family: 'Pretendard', 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; }
.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;  }


/* html 폰트 사이즈 */
@media (max-width:1200px) {
	html { font-size: 8.5px; }
}
@media (max-width:991px) {
	html { font-size: 8px; }
}
@media (max-width:768px) {
	html { font-size: 7.5px; }
}
@media (max-width:580px) {
	html { font-size: 6.5px; }
}
@media (min-width:1200px) and (max-height:800px) {/* 너비 1200이상 높이 800이하 */
html { font-size: 8px; }
}
@media (min-width:1200px) and (max-height:650px) {/* 너비 1200이상 높이 650이하 */
html { font-size: 7.5px; }
}
@media (min-width:1200px) and (max-height:500px) {/* 너비 1200이상 높이 500이하 */
html { font-size: 6.5px; }
}



:root {
	/* 컨텐츠 너비 */
	--containerV1-width : 1500px;
	
	--main-color : #eeb900;
    --sub-color: #656764;
    --color1 : #eeb900;
	
	/*font (22px 미만은 min 400부터, 이상은 500부터)*/
	--font-size14 : min(3.50vw, 14px);
	--font-size15 : min(3.75vw, 15px); 
	--font-size16 : min(4vw, 16px); 
	--font-size18 : min(4.50vw, 18px); 
	--font-size20 : min(5vw, 20px); 
	--font-size22 : min(4.40vw, 22px); 
	--font-size23 : min(4.60vw, 23px); 
	--font-size25 : min(5vw, 25px); 
	--font-size30 : min(6vw, 30px); 
	--font-size35 : min(7vw, 35px); 
	--font-size45 : min(9vw, 45px); 
	--font-size50 : min(10vw, 50px); 
    --font-size55 : min(11vw, 55px); 
	--font-size60 : min(12vw, 60px);

    /* 하단 온라인문의 높이 */
    --form-height: 105;
}

@media (max-width: 991px) {
    :root{
        --form-height: 76;
    }
}

@media (max-width: 500px) {
    :root{
        --quick1-height: 65;
    }
}

/* container */
.containerV1 { width: 100%; margin: 0 auto; max-width: var(--containerV1-width,1400px);}


@media (max-width: 1530px) {
	.containerV1 { padding: 0 15px;}
}


.wrap { padding-top: 0; }
@media (max-width: 991px) {
	.wrap { padding-top: 0;}
}


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

#header { 
--h-height : 10rem;
--hs-height : 80;
position: fixed; left: 0; top: 0; width: 100%; height: var(--h-height); z-index: 1000; transition:0.4s; background: url(img/nav_back.jpg);}

#header > .containerV1 {height: 100%;}



#header .itemBox {
width: 100%; max-width: 1780px; height: 100%; display:flex; justify-content:space-between; align-items:center; 
position: relative; z-index: 2; margin: 0 auto;}


#logo {width: max(50px, 11rem); transition: all 0.3s;} 
#logo a { display: block; position: relative; width: 100%; height: 100%;}


/*main_menu---------------------------------------------------------------------------*/
#nav .nav_logo {display: none;}

#nav .nav_inner { display:flex; align-items:center; width: 100%;}
#nav .outer {display: flex; position: relative;}
#nav .outer > li {position: relative; margin-left: max(30px, 4.27vw); /*95px*/}
#nav .outer > li:first-child {margin-left: 0;}
#nav .outer > li > a {
display: block; color: #fff;  font-size: max(16px, 1.042vw);/*20px*/ height: 100%; line-height: var(--h-height);
position: relative; transition: all 0.3s;
}
#nav .outer > li > a > span {position: relative; }
#nav .outer > li > a > i {color: var(--color1); display: none;}

#nav .outer > li > a > span:after {
content: ''; position: absolute; left:0; bottom: -10px; width: 0; height: 3px; background: var(--color1); transition:0.4s;
}


/* hover */


#nav .outer > li > a:hover{color: var(--main-color);}
#nav .outer > li:hover > a > span:after {width: 100%;}





/* 해드 스크롤 했을때 */
#header.scroll {height: calc(var(--hs-height) * 1px); background: #fff; box-shadow: 0px 1px 10px -6px #333;}
#header.scroll {height: calc(var(--hs-height) * 1px);}
#header.scroll #logo {width: 100px;}
#header.scroll #logo a{filter: invert(1);}
#header.scroll #nav .outer > li > a {line-height: calc(var(--hs-height) * 1px); color: #000; font-weight: bold;}
#header.scroll #nav .outer > li > a:hover{color: var(--main-color);}





/* 해당페이지 일때 */
#nav .outer > li > a.on > span:after {width: 100%;}


/*모바일에서 피씨 로고 클래스 지움.*/
#logo.logo_hide {opacity: 0; visibility: visible;}



/*반응형-------------------------------------------------------------*/






/*모바일*/
@media all and (max-width: 991px) {
	
	
	#header {
		--h-height : 70px;
		--hs-height : 70;
	}
	/* 모바일 열기 버튼 */
	.open_btn { font-size: 25px; color: #fff; cursor:pointer; }

	#nav {
	background-color: #fff; width: 21.43em; height: 100%;  display: block;
	position: fixed; right:0; top: 0; z-index:9999; margin-right:-21.43em;  transition: margin-right 0.3s;
	}

	#nav .nav_inner .nav_topBox {display: flex; align-items: center; width: 100%; height: 86px; background: #333; padding: 20px;}
	#nav .nav_inner .nav_logo {display: block;}

	#nav .nav_inner { 
	width: 21.43em; height: 100%; overflow-x: hidden; overflow-y:auto; position: absolute;  top:0; 
	flex-direction:column; justify-content:flex-start; align-items:stretch;
	}


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


	#nav .outer { display: block; margin-top: 10px; padding: 0 20px;}
	#nav .outer > li { margin-left: 0; width: 100%; overflow: hidden; cursor: pointer; margin-bottom: 10px;}
	#nav .outer > li > a { font-weight: 500; padding:15px 20px 20px 10px; color: #333; position: relative; height: auto; line-height: 1; font-size: 20px;
	border-bottom: 1px solid rgba(0,0,0,0.5);}
	#nav .outer > li > a > span:after {display: none;}

	#nav .outer > li > a > i {color: var(--color1); display: inline-block; position: absolute; right: 15px; top: 15px; transform: rotate(0deg); transition: all 0.3s;}

	#nav .inner { position: relative; padding: 0; display: block; border:0; opacity: 0; visibility: hidden; width: 100%; height: 0;  background: #fff; box-shadow: none;}
	#nav .inner::before {display: none;} 
	#nav .inner > li { margin-bottom:0; position: relative; padding: 0;}


	#nav .inner > li > a {
	color: #333; padding: 12px 25px; position: relative; transition: all 0.3s;
	text-align: left; left: 0; font-size: 15px;
	}


	/* 해드 스크롤 했을때 */
	#header.scroll #nav .outer > li > a {color: #333; line-height: 1;}
	#header.scroll {height:  calc(var(--hs-height) * 1px);}
	#header.scroll #nav .outer > li > a {line-height:1;}
    #header.scroll .open_btn{color: #000;} 
/*	#header.scroll {box-shadow: 0px 3px 10px rgba(0,0,0,0.1); background: #fff;}*/


	/* 해당페이지 일때 */
/*	#nav .outer > li.on > a span {color: var(--color1);}*/
	#nav .outer > li > a.on span {color: var(--color1);}
	#nav .outer > li > a.on span:after {width: 100%;}


	/* outer 클릭시 inner보이는 효과 */
	#nav .outer > li.on_sub > .inner { display: block; padding: 10px 0;}
	

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

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



/*--------------------------------------------------- 인덱스세팅 ----------------------------------------------------------------------------*/
.index .titleBox {position: relative;}
.index .titleBox .title_tag {font-family: 'Poppins', sans-serif; font-size: var(--font-size20); color: var(--color2); line-height: 1.2; font-weight: 600;}
.index .title-V1 {font-size: var(--font-size50); line-height: 1.2; font-weight: bold; color: #000; }
.index .title-V2 {font-family: 'Poppins', sans-serif; font-size: var(--font-size45); line-height: 1.2; font-weight: 600; color: #000; }

.index > article {font-size: 10px;}/* em기준점 */
.index > article > section {font-size: 10px;}



@media (max-width: 1430px) {
	.index > article {font-size: 0.70vw;}/* em기준점 */
	.index > article > section {font-size: 0.70vw;}
}

@media (max-width: 991px) {
	.index .titleBox .title_tag {font-weight: bold;}
	.index .title-V2 {font-weight: bold;}
}


/* section1 */
.index .section1{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; height: 100vh;
    background: url(img/index_section01.jpg) center center / cover no-repeat;
    display: flex; align-items: center; justify-content: center;
}
.index .section1 .text_box{
    padding: 14em 3em 13em;
    display: flex; flex-direction: column; align-items: center;
    width: 100%; max-width: 1096px; margin: 0 auto;
    background-color: rgba(0, 0, 0, 0.58); border: 3px solid rgba(178, 172, 138, 0.58);
}

.index .section1 .text_box .text1{margin-bottom: 2.5em; text-align: center;}
.index .section1 .text_box .text1 p{font-size: 2.5em; color: #e8ddb2; font-weight: bold;}

.index .section1 .text_box .text2{border-top: 1px solid #fff; border-bottom: 1px solid #fff; margin-bottom: 4em; padding: 1em 0; display: inline-block;}
.index .section1 .text_box .text2 p{font-weight: bold; font-size: 7em; color: #fff; line-height: 1.2; text-align: center;}
.index .section1 .text_box .text2 p b{color: var(--main-color);}

.index .section1 .text_box .text3{color: #fff; text-align: center;}
.index .section1 .text_box .text3 p{font-size: 3em; font-family: 'Noto Serif KR', serif !important; line-height: 1.5;}
.index .section1 .text_box .text3 b{font-weight: normal; position: relative;}
.index .section1 .text_box .text3 b:before{
    content: url(img/index_section01_pencil.png);
    position: absolute;
    left: -25px; left: -10px;
}

@media (max-width: 768px) {
    .index .section1 .text_box .text2 p{font-size: 5em;}
    .index .section1 .text_box .text3 p br{display: none;}

    .index .section1 .text_box .text3 b:before{display: none;}
}


/* section2 */	  
.index .section2{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    position: relative;
    width: 100%; height: 100vh;
    background-color: #cacaca;
    z-index: -2;
    display: flex; align-items: center; justify-content: center;
}
.index .section2::after{
    content:'';
    position: absolute;
    top: 0; right: 0;
    width: 0px;
    height: 0px;
    border-bottom: 100vh solid #646461;
    border-left: 350px solid transparent;
    border-right: min(calc(900 / 1400 * 100vw), 1060px) solid #646461;
    z-index: -1;
}

.index .section2::before{
    position: absolute;
    content:'';
    width: 100%;
    height: 100vh;
    background: url(img/index_section02_line.png) center center / cover no-repeat;
    z-index: 0;
    opacity: 0.05;
}

.index .section2 .containerV1{position: relative; z-index: 10;}
.index .section2 .content_wrap{display: flex; gap: 7em; justify-content: center; align-items: center;}
.index .section2 .content_wrap .img_box{width: 100%; max-width: 500px; position: relative;}
.index .section2 .content_wrap .img_box:before{
    position: absolute; bottom: -35px; left: -35px;
    content:'';
    width: 300px;
    height: 150px;
    background: url(img/index_section02_img02.png) center center / cover no-repeat;
    z-index: 12;

}

/* section 공통 h2, h3, p ---------  */
.index article .text_box .box1{background-color: var(--main-color); padding: 1em; display: inline-block; margin-bottom: 3.5em;}
.index article .text_box .box1 h2{color: #fff; font-size: 3em; font-weight: bold;}

.index article .text_box .box2 h2.title{font-size: 6em; font-weight: bold; margin-bottom: 0.3em; line-height: 1.1; color: #313131;}
.index article .text_box .box2 h3.text1{font-size: 3.5em; font-weight: bold; margin-bottom: 0.625em; color: #fff; line-height: 1.2;}
.index article .text_box .box2 p.text2{font-size: 2.5em; line-height: 1.66; color: #fff;}
.index article .text_box .box2 p.text3{font-size: 3em; line-height: 1.4; color: #313131;}

@media (max-width: 991px) {
    .index article .text_box .box2 h2.title{font-size: 5em;}
}
/* ------------------------------- */

.index article.section2 .text_box .box2{margin-bottom: 4em;}
.index article.section2 .text_box .box2 h2.title{color: #fff;}
.index article.section2 .text_box .icon_box{display: flex; gap: 11em; }
.index article.section2 .text_box .icon_box .icon{text-align: center; display: flex; flex-direction: column; align-items: center;}

.index article.section2 .text_box .icon_box .icon .icon_title{border-bottom: 1px solid var(--main-color); margin-bottom: 3em;}
.index article.section2 .text_box .icon_box .icon .icon_title p{font-size: 2.5em; font-weight: bold; color: var(--main-color); padding-bottom: 0.1em;}

.index article.section2 .text_box .icon_box .icon .icon_img{margin-bottom: 2.5em; width: 10em; height: 10em;}

.index article.section2 .text_box .icon_box .icon .icon_text p{font-size: 2.5em; font-weight: bold; color: #fff;}


@media (max-width: 1350px) {
    .index .section2 .content_wrap .img_box:before{left: 25px; width: 240px; height: 120px;}
} 

@media (max-width: 1300px) {
    .index .section2 .content_wrap{gap: 4em;}
    .index article.section2 .text_box .icon_box{gap: 3em; justify-content: space-between;}
}

@media (max-width: 1200px) {
    .index .section2{height: auto; padding: 7em 0; overflow: hidden;}
    .index .section2::after{border-bottom: 160vh solid #646461;}
    .index .section2::before{height: 100%;}

    .index .section2 .content_wrap{flex-direction: column;}
    .index .section2 .content_wrap .img_box:before{left: auto; right: -95px;}
    .index .section2 .content_wrap .img_box img{height: 295px; width: 100%; object-fit: cover; object-position: center;}
    .index .section2 .content_wrap .text_box{text-align: center;}
}

@media (max-width: 768px) {
    .index .section2 .content_wrap .img_box:before{right: auto; bottom: -1em; width: 20em; height: 10em;}

    .index article .text_box .box2 h3.text1{line-height: 1.4;}

    .index article.section2 .text_box .icon_box .icon{ flex:1; display: flex; flex-direction: column; align-items: center;}
    .index article.section2 .text_box .icon_box .icon .icon_img{width: 8em; height: auto;}
    .index article.section2 .text_box .icon_box .icon .icon_text p{line-height: 1.2;}
}

@media (max-width: 500px) {
    .index .section2 .content_wrap .img_box img{height: 35em;}
}

/* section3 */	  
.index .section3{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; height: 100vh; 
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    background: url(img/index_section03_line.png);
}

.index article.section3 .text_box{display: flex; flex-direction: column; align-items: center; margin-bottom: 8em;}
.index article.section3 .text_box .box2 h2.title{margin-bottom: 0.2em; text-align: center;}
.index article.section3 .text_box .box2 h2.title b{color: var(--main-color);}
.index article.section3 .text_box .box2 p.text3{text-align: center;}
.index article.section3 .text_box .box2 p b{font-weight: normal; border-bottom: 3px solid #313131; padding-bottom: 0.1em;}

.index .section3 .item_box{display: grid; grid-template-columns: repeat(3, 1fr); justify-content: space-between; gap: 2em;}
.index .section3 .item_box .item{
    width: 100%; max-width: 466px; height: 100%;
    position: relative; display: flex; flex-direction: column;
    align-items: center; gap: 1em;
    border: 1px solid #dcdcdc;
    background-color: #fff; padding: 9em 2em 6em;
    margin: 0 auto;
}

.index .section3 .item_box .item:before{
    position: absolute;
    font-weight: 900; font-size: 3em; color: #fff;
    width: 3em; height: 3em; border-radius: 50%;
    background-color: #656764;
    display: flex; align-items: center; justify-content: center;
    top: -1.5em; left: 50%; transform: translateX(-50%);
}
.index .section3 .item_box .item1:before{content:'01';}
.index .section3 .item_box .item2:before{content:'02';}
.index .section3 .item_box .item3:before{content:'03';}

.index .section3 .item_box .item .item_img{margin-bottom: 2em;}
.index .section3 .item_box .item .item_text p{font-size: 3em; color:#434343; font-weight: bold; text-align: center;}


@media (max-width: 991px) {
    .index .section3 .item_box .item .item_img{width: 10em;}
    .index article.section3 .text_box .box2 h2{line-height: 1.2;}
    .index article.section3 .text_box .box2 h2.title b{display: block;}
}

@media (max-width: 768px) {
    .index .section3{height: auto; padding: 7em 0;}
    .index .section3 .item_box{grid-template-columns: repeat(1, 1fr); gap: 6em;}

    .index .section3 .item_box .item{max-width: 100%; padding: 5em 2em;}
    .index .section3 .item_box .item:before{font-size: 2.5em;}
}

/* section4 */	  
.index .section4{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; height: 100vh;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    background: url(img/index_section04_img.png) center center / cover no-repeat;
}

.index article.section4 .text_box{display: flex; flex-direction: column; align-items: center; margin-bottom: 4em;}
.index article.section4 .text_box .box2 h2.title{margin-bottom: 0.2em; text-align: center; color: #fff;}
.index article.section4 .text_box .box2 h2.title b{color: var(--main-color);}
.index article.section4 .text_box .box2 p.text3{text-align: center; color: #fff;}

.index .section4 .table_box{font-size: clamp(6.5px, min(calc(10 / 768 * 100vw), 10px), 10px);}
.index .section4 .table_box .table_text{margin-bottom: 2em; text-align: right;}
.index .section4 .table_box .table_text p{font-size: 2em; color: #fff;}

.index .section4 .table_box table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border-left: none;
    border-right: none;
}

.index .section4 .table_box table th {
    background-color: #706e66;
    border: 1px solid #fff;
    padding: 10px;
    text-align: center;
    color: #fff; font-weight: bold;
    font-size: 2.5em; line-height: 1.2;
    height: 3.6em; width: 25%;
}

.index .section4 .table_box table td {
    padding: 10px;
    text-align: center;
    border: 1px solid #d2d2d2;
    background-color: #fff;
    color: #434343;  font-size: 2em;
    height: 4.5em;
}


.index .section4 .table_box table tr:first-child th,
.index .section4 .table_box table tr:first-child td {
    border-top: none;
    border-left: none;
}
.index .section4 .table_box table tr th:last-child {
    border-right: none;
}
.index .section4 .table_box table tr:last-child td {
    border-bottom: none;
}

.index .section4 .table_box table td:first-child {
    background-color: #f4f4f4;
    border-left: none;
    font-weight: bold;
}

.index .section4 .table_box table td:last-child {
    border-right: none;
}

.index .section4 .table_box table th.line{border: 3px solid var(--main-color) !important; border-bottom: none !important;}
.index .section4 .table_box table td:last-child.line{border-left: 3px solid var(--main-color) !important; border-right: 3px solid var(--main-color) !important;}
.index .section4 .table_box table tr:last-child td:last-child.line{border-bottom: 3px solid var(--main-color) !important;}


@media (max-width: 991px) {
    .index .section4 {height: auto; padding: 7em 0;}
}

@media (max-width: 500px) {
    .index .section4 .table_box table th{width: auto; padding: 5px;}
    .index .section4 .table_box table td{padding: 5px;}
}

/* section5 */	  
.index .section5{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%;
    height: 100vh;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    background: url(img/index_section05_img.png) center center / cover no-repeat;
}

.index article.section5 .text_box{display: flex; flex-direction: column; align-items: center; margin-bottom: 4em;}
.index article.section5 .text_box .box2 h2.title{margin-bottom: 0.2em; text-align: center;}
.index article.section5 .text_box .box2 h2.title b{color: var(--main-color);}
.index article.section5 .text_box .box2 p.text3{text-align: center;}

.index .section5 .table_box{font-size: clamp(6.5px, min(calc(10 / 768 * 100vw), 10px), 10px);}

.index .section5 .table_box table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border-left: none;
    border-right: none;
}

.index .section5 .table_box table th {
    background-color: #483527;
    border: 1px solid #d2d2d2;
    padding: 10px;
    text-align: center;
    color: #fff; font-weight: bold;
    font-size: 2.5em; line-height: 1.2;
    height: 3.6em; width: 40%;
}
.index .section5 .table_box table th:first-child{width: 20%;}

.index .section5 .table_box table td {
    padding: 10px;
    text-align: center;
    border: 1px solid #d2d2d2;
    background-color: #fff;
    color: #434343;  font-size: 2em;
    height: 4.5em; line-height: 1.3;
}


.index .section5 .table_box table tr:first-child th,
.index .section5 .table_box table tr:first-child td {
    border-top: none;
    border-left: none;
}
.index .section5 .table_box table tr th:last-child {
    border-right: none;
}

.index .section5 .table_box table td:first-child {
    background-color: #f4f4f4;
    border-left: none;
    font-weight: bold;
}

.index .section5 .table_box table td:last-child {
    border-right: none;
}

.index .section5 .table_box table th.line{border: 3px solid var(--main-color) !important; border-bottom: none !important;}
.index .section5 .table_box table td:last-child.line{border-left: 3px solid var(--main-color) !important; border-right: 3px solid var(--main-color) !important;}
.index .section5 .table_box table tr:last-child td:last-child.line{border-bottom: 3px solid var(--main-color) !important;}

@media (max-width: 991px) {
    .index .section5 {height: auto; padding: 7em 0;}
}

@media (max-width: 500px) {
    .index .section5 .table_box table th{width: auto; padding: 5px;}
    .index .section5 .table_box table td{padding: 5px;}
}


/* section6 */	  
.index .section6{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; padding: 7em 0; 
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    background: url(img/index_section06_line.png) center center / cover no-repeat;
}

.index article.section6 .text_box{display: flex; flex-direction: column; align-items: center; margin-bottom: 4em;}
.index article.section6 .text_box .box2 h2.title{margin-bottom: 0.2em; text-align: center;}
.index article.section6 .text_box .box2 h2.title b{color: var(--main-color);}
.index article.section6 .text_box .box2 h2.title b.icon{position: relative; margin-right: 15px;}
.index article.section6 .text_box .box2 h2.title b.icon:before{
    position: absolute;
    content: '';
    background: url(img/index_section06_title_icon.png)center center / cover no-repeat;
    width: 53px; height: 80px;
    right: -15px; bottom: 60%;
}
.index article.section6 .text_box .box2 p.text3{text-align: center;}

.index .section6 .table_box{font-size: clamp(6.5px, min(calc(10 / 768 * 100vw), 10px), 10px);}
.index .section6 .table_box .table_text{margin-bottom: 2em; text-align: right;}
.index .section6 .table_box .table_text p{font-size: 2em; color: #313131;}
.index .section6 .table_box .table_text2{margin-top: 2em;}
.index .section6 .table_box .table_text2 p{font-size: 2em; color: #434343; line-height: 1.6;}

.index .section6 .table_box table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border-left: none;
    border-right: none;
}

.index .section6 .table_box table th {
    background-color: #656764;
    border: 1px solid #fff;
    padding: 10px;
    text-align: center;
    color: #fff; font-weight: bold;
    font-size: 2.5em; line-height: 1.2;
    height: 3.6em; width: 47%;
}

.index .section6 .table_box table th:first-child{width: 26.5%;}
.index .section6 .table_box table th:last-child{width: 26.5%;}

.index .section6 .table_box table td {
    padding: 10px;
    text-align: center;
    border: 1px solid #d2d2d2;
    background-color: #fff;
    color: #434343;  font-size: 2em;
    height: 4.8em; line-height: 1.3;
}


.index .section6 .table_box table tr:first-child th,
.index .section6 .table_box table tr:first-child td {
    border-top: none;
    border-left: none;
}
.index .section6 .table_box table tr th:last-child {
    border-right: none;
}
.index .section6 .table_box table tr:last-child td {
    font-size: 5em; font-weight: 900; color: #fff;
    background-color: var(--main-color);
    border-bottom: none;
    height: 1.8em;
    -webkit-text-stroke: 2.5px #706e66;
}

.index .section6 .table_box table tr:last-child td .last_wrap{
    display: flex; align-items: center; justify-content: center;
}
.index .section6 .table_box table tr:last-child td .last_wrap .icon{margin-right:0.5em;}

.index .section6 .table_box table td:first-child {
    background-color: #f8f8f8;
    border-left: none;
    font-weight: bold;
}

.index .section6 .table_box table td:last-child {
    border-right: none;
}

@media (max-width: 768px) {
    .index article.section6 .text_box .box2 h2.title b.icon:before{display: none;}
    .index article.section6 .text_box .box2 h2.title b.icon{margin-right: 0;}
}

@media (max-width: 500px) {
    .index .section6 .table_box table th{width: auto; padding: 5px;}
    .index .section6 .table_box table td{padding: 5px;}

    .index .section6 .table_box table tr:last-child td{-webkit-text-stroke: 1px #706e66;}
    .index .section6 .table_box table tr:last-child td .last_wrap .icon{display: none;}
}

/* section7 */
.index .section7{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; padding: 7em 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
}
.index .section7 .text_box{text-align: center;}
.index .section7 .text_box .box2{margin-bottom: 6em;}
.index .section7 .text_box .box2 h2.title b{color: var(--main-color); position: relative;}
.index .section7 .text_box .box2 h2.title b:before{
    content:'';
    background: url(img/index_section07_title_icon.png)center center / cover no-repeat;
    position: absolute;
    top: -28px; right: -40px;
    width: 60px; height: 48px;
}

.index .section7 .item_wrap{display: grid; grid-template-columns: repeat(4, 1fr); gap: 4em 3em;}
.index .section7 .item_wrap .item{display: flex; flex-direction: column; align-items: center; border: 1px solid #c9c9c9; padding: 7em 2em 4em; position: relative;}
.index .section7 .item_wrap .item:before{
    position: absolute;
    font-weight: 900; font-size: 2em; color: #fff;
    width: 6.5em; height: 2em; border-radius: 30px;
    background-color: #656764;
    display: flex; align-items: center; justify-content: center;
    top: -1em; left: 50%; transform: translateX(-50%);
}
.index .section7 .item_wrap .item1:before{content: 'STEP 01'}
.index .section7 .item_wrap .item2:before{content: 'STEP 02'}
.index .section7 .item_wrap .item3:before{content: 'STEP 03'}
.index .section7 .item_wrap .item4:before{content: 'STEP 04'}
.index .section7 .item_wrap .item5:before{content: 'STEP 05'}
.index .section7 .item_wrap .item6:before{content: 'STEP 06'}
.index .section7 .item_wrap .item7:before{content: 'STEP 07'}
.index .section7 .item_wrap .item8:before{content: 'STEP 08'}


.index .section7 .item_wrap .item .item_img{margin-bottom: 3em;}
.index .section7 .item_wrap .item .item_text{color:#434343; text-align: center;}
.index .section7 .item_wrap .item .item_text h2{font-size: 2.5em; margin-bottom: 0.5em; font-weight: bold;}
.index .section7 .item_wrap .item .item_text p{font-size: 2em; line-height: 1.5;}


@media (max-width: 1300px) {
    .index .section7 .item_wrap .item .item_text p br{display: none;}
}

@media (max-width: 1020px) {
    .index .section7 .text_box .box2 h2.title b:before{display: none;}
}

@media (max-width: 991px) {
    .index .section7 .item_wrap{grid-template-columns: repeat(3, 1fr); gap: 4em 2em;}
    .index .section7 .item_wrap .item{padding: 4em 2em 2em;}
    .index .section7 .item_wrap .item .item_img{width: 12em;}
}

@media (max-width: 768px) {
    .index .section7 .item_wrap{grid-template-columns: repeat(2, 1fr);}

    .index .section7 .item_wrap .item .item_img{width: 10em;}
}


/* section8 */
.index .section8{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; padding: 7em 0; padding: 8em 0;
    text-align: center;
    background: url(img/index_sectin08_bg.jpg) center center / cover no-repeat;
}

.index .section8 .text_box .box2{margin-bottom: 5em;}
.index article.section8 .text_box .box2 h2.title b{color: var(--main-color);}
.index article.section8 .text_box .box2 p.text3{color: #313131;}

@media (max-width: 991px) {
    .index article.section8 .text_box .box2 h2{line-height: 1.2;}
    .index article.section8 .text_box .box2 h2.title b{display: block;}
}

/* section9 */
.index .section9{
    font-size: min(calc(10 / 650 * 100vw), 10px);
    width: 100%; padding: 7em 0; padding: 8em 0;
    text-align: center;
    background: url(img/index_section09_bg.jpg) center center / cover no-repeat;
}
.index article.section9 .text_box{margin-bottom: 4em;}
.index article.section9 .text_box .box2 h2.title{color: #fff;}
.index article.section9 .text_box .box2 .text3{color: #fff;}


@media (max-width: 1650px) {
    .index .section9{padding-bottom: 10em;}
}

/* data-scroll */

.index .section1 .text_box .text1{transition: 1s;}
.index .section1 .text_box .text2{transition: 1s; transition-delay: 0.2s;}
.index .section1 .text_box .text3{transition: 1s; transition-delay: 0.4s;}
.index .section1 .text_box .text[data-scroll="out"] {
    opacity: 0; transform: translateY(-30%);
}

.index .section2 .img_box{transition: 1s;}
.index .section2 .img_box[data-scroll="out"]{
    opacity: 0; transform: translateX(-30%);
}

.index .section2 .text_box .box{transition: 1s;}
.index .section2 .text_box .box[data-scroll="out"]{
    opacity: 0; transform: translateX(30%);
}

.index .section2 .text_box .icon_box .icon1{transition: 1s; transition-delay: 0.4s;}
.index .section2 .text_box .icon_box .icon2{transition: 1s; transition-delay: 0.6s;}
.index .section2 .text_box .icon_box .icon3{transition: 1s; transition-delay: 0.8s;}
.index .section2 .text_box .icon_box .icon[data-scroll="out"]{
    opacity: 0; transform: translateY(-20%);
}

.index .section3 .item_box .item1{transition: 1s; transition-delay: 0.4s;}
.index .section3 .item_box .item2{transition: 1s; transition-delay: 0.6s;}
.index .section3 .item_box .item3{transition: 1s; transition-delay: 0.8s;}
.index .section3 .item_box .item[data-scroll="out"]{
    opacity: 0; transform: translateY(-30%);
}

.index .section7 .item_wrap .item1{transition: 1s;}
.index .section7 .item_wrap .item2{transition: 1s; transition-delay: 0.2s;}
.index .section7 .item_wrap .item3{transition: 1s; transition-delay: 0.4s;}
.index .section7 .item_wrap .item4{transition: 1s; transition-delay: 0.6s;}
.index .section7 .item_wrap .item5{transition: 1s; transition-delay: 0.4s;}
.index .section7 .item_wrap .item6{transition: 1s; transition-delay: 0.6s;}
.index .section7 .item_wrap .item7{transition: 1s; transition-delay: 0.8s;}
.index .section7 .item_wrap .item8{transition: 1s; transition-delay: 1s;}
.index .section7 .item_wrap .item[data-scroll="out"]{
    opacity: 0; transform: translateY(-20%);
}


.index article .fade-title{transition: 1s;}
.index article .fade-title[data-scroll="out"]{
    opacity: 0; transform: translateY(-30%);
}

.index article .fade-table{transition: 1s; transition-delay: 0.2s;}
.index article .fade-table[data-scroll="out"]{
    opacity: 0; transform: translateY(-30%);
}

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



/*--------------------------------------------------- 푸터세팅 ----------------------------------------------------------------------------*/
/* footer*/
footer {
--footer-font : 16px;
background: #747773; position: relative; 
margin-bottom: calc(var(--form-height) * 1px);
}
footer > .contents_box {padding: 40px 0;}
footer .contents { display:flex; align-items: flex-start; justify-content: space-between; gap: 0 20px;}
footer .contents > li { font-weight: 300;}

footer .item1 {width: 17.5%; padding-left: 10px;}
footer .item2 {display: flex; flex-direction: column; flex-basis: 0; flex-grow: 1;}
footer .item2 > div { line-height: 1.6; font-size: var(--footer-font);}
footer .item2 > div a { color: inherit;}
footer .item2 > .text > span { position: relative; font-weight: inherit; margin-right: 10px; color: #fff;}
footer .item2 > .text > span:after { content:'|'; position:absolute; right: -9px; top:50%; transform:translateY(-55%); }
footer .item2 > .text > span:last-child:after { display: none; }

footer .item3 .text{margin-bottom: 15px; text-align: right;}
footer .item3 .text p{font-size: var(--font-size25); color: #fff;}
footer .item3 .number p{font-size: var(--font-size55); font-weight: bold; color: var(--main-color)}
footer .item3 .number p a{color: var(--main-color)}

footer .copy {font-size: min(3.50vw, 14px); color: #bfbfbf; text-transform: uppercase; font-weight: inherit; line-height: 1.3;}
footer .copy a {color: #bfbfbf;}

footer .list_box1 {display: flex; gap: 30px; padding-bottom: 15px;}
footer .list_box1 span {position: relative; font-size: var(--font-size18); }
footer .list_box1 span a {color: #fff; font-weight: bold;}
footer .list_box1 span::before {content: ""; position: absolute; width: 2px; height: 13px; background: #fff; right: -17px; top: 50%; transform: translateY(-50%);}
footer .list_box1 span:last-child:before {display: none;} 




@media (max-width:991px) {
/* footer{margin-bottom: 72px;} */
footer .item1 {display: none;}
footer .list_box1 {display: none;}
footer > .contents_box {padding: 30px 0 30px;}
footer .item2 > .text > span { display:block; margin-right:0;}
footer .item2 > .text > span:after { display:none;}
}

@media (max-width: 768px) {
    /* footer{margin-bottom: 72px;} */
    footer .contents{flex-direction: column-reverse; align-items: center; text-align: center;}
    footer .item3 {margin-bottom: 3em;}
    footer .item3 .text{text-align: center;}
}

@media (max-width: 680px) {
    footer {
        margin-bottom: 0;
        padding-bottom: calc(var(--form-height) * 1px);
    }
}

@media (max-width: 500px) {
	footer {
        --footer-font: 14px;

        padding-bottom: calc(calc(var(--form-height) * 1px) + calc(var(--quick1-height) * 1px)); 
    }
}


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







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

@media (max-width: 991px) {
	.tmt_sub_frame { padding: 13rem 0 50px; min-height: 80vh;}
}

/*각 페이지 프레임 내부 패딩(다시 고치려니 일일이 들어가서 고치기 힘들기 때문에 이 부분만 여기서 수정)*/
.tmt_sub_frame .page_frame {padding: 65px 10px 20px 10px;}


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


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


/*.modal-lg {width: 540px;}*/
/**/
/*@media (max-width: 768px) {*/
/*	.modal-lg {margin: 30px auto !important; padding: 0 15px; max-width: 540px; width: 100%;}*/
/*}*/