@charset "UTF-8";@charset "UTF-8";
#visual.sections.section_01{position: fixed; top: 0; height: 100vh; overflow: hidden; z-index: 0; width: 100%;}
#visual.sections.section_01:before{position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(transparent, var(--color-main));}
#visual.sections.section_01 .bg{width: 100%;}
#visual.sections.section_01 .bg video{width: 100%;}
#visual.sections.section_01 .width_con{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#visual.sections.section_01 .width_con .title_con{display: flex; flex-direction: column; gap: var(--mrgn);}
#visual.sections.section_01 .width_con .title_con h1{font-size: 4.5em; color: var(--color-static-sub);}
/* #visual.sections.section_01 .width_con h4{color: var(--color-static-w);} */

.sections{position: relative; z-index: 1; background: var(--color-main);}
.sections.section_02{margin-top: 100vh;}
.sections.section_02 .width_con{display: flex; flex-direction: column; gap: var(--mrgn-x4);}
.sections.section_02 .width_con > *:first-child{}
.sections.section_02 .width_con > *:nth-child(2){place-self: flex-end;}
.sections.section_02 .width_con > .title_con{width: 45%;}
.sections.section_02 .width_con > .title_con h4{line-height: 1.4; word-break: keep-all;}
.sections.section_02 .width_con > .title_con h4 b{font-weight: 700;}
.sections.section_02 .width_con > .title_con h4 span{color: rgba(255,0,0,.65); font-weight: 600;}

.sections.section_etc{}
.sections.section_etc .width_con{}
.sections.section_etc .width_con .title_con{}
.sections.section_etc .width_con .title_con h2{text-align: center; text-transform: uppercase;}

#recruit.sections.section_03{}
#recruit.sections.section_03 .width_con{display: flex; flex-direction: column; gap: var(--mrgn-x8);}
#recruit.sections.section_03 .width_con .title_con{width: 60%}
#recruit.sections.section_03 .width_con .title_con h4{word-break: keep-all; line-height: 1.4;}
#recruit.sections.section_03 .width_con section.proceed{display: flex; flex-direction: column; gap: var(--mrgn-x4); margin: 0;}
#recruit.sections.section_03 .width_con section.proceed > div{display: flex; flex-direction: column; gap: var(--mrgn-x2);}
#recruit.sections.section_03 .width_con section.proceed > div .title{}
#recruit.sections.section_03 .width_con section.proceed > div .title h3{font-size: 2.4em;}
#recruit.sections.section_03 .width_con section.proceed > div.hr{width: 100%; height: 1px; background: var(--color-sub-035); padding: 0; margin: var(--mrgn-x2) 0 ;}
#recruit.sections.section_03 .width_con section.proceed > div > dl{display: grid; grid-template-columns: 150px 1fr; gap: var(--mrgn); font-size: 1.4em;}
#recruit.sections.section_03 .width_con section.proceed > div > dl > dt{font-weight: 700;}
#recruit.sections.section_03 .width_con section.proceed > div > dl > dd{line-height: 1.4;}
#recruit.sections.section_03 .width_con section.proceed > div > dl > dd:has(a){display: flex; align-items: center; gap: var(--mrgn-half)}
#recruit.sections.section_03 .width_con section.proceed > div > dl > dd a{font-weight: 600; text-decoration: underline;}
#recruit.sections.section_03 .width_con section.proceed > div > dl > dd i{text-decoration: none; color: var(--color-sub-065); font-size: .8em;}
#recruit.sections.section_03 .width_con section.proceed > div > ul{display: flex; font-size: 1.4em; width: 75%;}
#recruit.sections.section_03 .width_con section.proceed > div > ul li{width: 100%; display: flex; align-items: center; background: var(--color-sub-015); gap: var(--mrgn); margin-left: calc(var(--mrgn-x6) * -1); border-radius: var(--mrgn-x3); color: var(--color-static-sub); color: var(--color-sub); font-weight: 600;}
#recruit.sections.section_03 .width_con section.proceed > div > ul li:first-child{margin: 0; flex: 80%;}
#recruit.sections.section_03 .width_con section.proceed > div > ul li:nth-child(2){background: var(--color-w-035); flex: 100%;}
#recruit.sections.section_03 .width_con section.proceed > div > ul li:last-child{background: rgba(189, 0, 3, .65); flex: 70%;}
#recruit.sections.section_03 .width_con section.proceed > div > ul li div{width: var(--mrgn-x6); aspect-ratio: 1/1; border-radius: 50%; background: var(--color-sub-015); display: flex; justify-content: center; align-items: center;}
#recruit.sections.section_03 .width_con section.proceed > div > ul li:nth-child(2) div{background: var(--color-w-035);}
#recruit.sections.section_03 .width_con section.proceed > div > ul li:nth-child(3) div{background: rgba(189, 0, 3, .65);}
#recruit.sections.section_03 .width_con section#position_list{display: flex; flex-direction: column; border-top: 5px solid var(--color-sub-050); border-bottom: 5px solid var(--color-sub-050);}
#recruit.sections.section_03 .width_con section#position_list .accordion{box-sizing: content-box; border-top: 5px solid var(--color-sub-050); overflow: hidden; height: calc(var(--sh) + var(--mrgn-x4)); transition: height 250ms ease-out;}
#recruit.sections.section_03 .width_con section#position_list .accordion:first-child{border-top: 0px;}
#recruit.sections.section_03 .width_con section#position_list .accordion.open{height: calc(var(--sh) + var(--mrgn-x4) + var(--fh));}
#recruit.sections.section_03 .width_con section#position_list .accordion .summary{box-sizing: border-box; padding: var(--mrgn-x2) var(--mrgn); display: flex; justify-content: space-between;  align-items: center; cursor: pointer;}
#recruit.sections.section_03 .width_con section#position_list .accordion .summary > h1{font-weight: 600; max-width: 80%; word-break: break-all;}
#recruit.sections.section_03 .width_con section#position_list .accordion .summary > div{position: relative; width: var(--mrgn-x2); height: 5px; background: var(--color-w); transition: all 250ms ease-out; transform: rotate(0deg);}
#recruit.sections.section_03 .width_con section#position_list .accordion.open .summary > div{transform: rotate(-180deg);}
#recruit.sections.section_03 .width_con section#position_list .accordion .summary > div:before{position: absolute; content: ""; width: inherit; height: inherit; background: inherit; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(270deg);  transition: inherit;}
#recruit.sections.section_03 .width_con section#position_list .accordion.open .summary > div:before{transform: translate(-50%, -50%) rotate(0);}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable{box-sizing: border-box; padding: 0 var(--mrgn); transition: all 250ms ease-out;}
#recruit.sections.section_03 .width_con section#position_list .accordion.open .foldable{}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content{box-sizing: border-box; padding: var(--mrgn-x2) 0; display: flex; flex-direction: column; gap: var(--mrgn-x4);}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div{display: flex; flex-direction: column; gap: calc(var(--mrgn-half)*3)}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > h3{font-weight: 500;}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > div{display: flex; flex-direction: column; gap: var(--mrgn);}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > div > span{font-size: 1.6em;  box-sizing: border-box; padding-left: var(--mrgn); font-weight: 600; position: relative;}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > div > span:before{position: absolute; top: 50%; left: 0; content: "*"; transform: translate(0%, -35%); line-height: 1; color: var(--color-sub-065);}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > div > ul{display: flex; flex-direction: column; gap: var(--mrgn); list-style: circle; box-sizing: border-box; padding-left: calc(var(--mrgn-half) * 3);}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > div > ul > li{}
#recruit.sections.section_03 .width_con section#position_list .accordion .foldable .content > div > div > ul > li h4{color: var(--color-sub)}

#apply.sections.section_04{}
#apply.sections.section_04 .width_con{display: flex; gap: var(--mrgn-x2);}
#apply.sections.section_04 .width_con > *{width: 100%;}
#apply.sections.section_04 .width_con > .title_con{flex: 50%;}
#apply.sections.section_04 .width_con > #apply_con{margin: 0; box-sizing: border-box; padding: var(--mrgn-x2); display: flex; flex-direction: column; gap: var(--mrgn); background: var(--color-static-sub-050); border-radius: var(--mrgn); box-shadow: 0 5px 15px -5px var(--color-k-025); font-size: 1.3em;}
#apply.sections.section_04 .width_con > #apply_con input{font-size: 1em;}
#apply.sections.section_04 .width_con > #apply_con > div{display: grid; grid-template-columns: 1fr 1fr; gap: var(--mrgn-x2) var(--mrgn);}
#apply.sections.section_04 .width_con > #apply_con > div > div{display: flex; flex-direction: column; gap: var(--mrgn-half);}
#apply.sections.section_04 .width_con > #apply_con > div .file{grid-column-start: 1; grid-column-end: 3; position: relative;}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area{position: relative; width: 100%; background: #e7e7e7; color: var(--color-static-main); box-sizing: border-box; padding: var(--mrgn); border-radius: var(--mrgn); display: flex; flex-direction: column; gap: var(--mrgn); min-height: var(--mrgn-x8);}
/* #apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area:after{position: absolute; content: '파일을 업로드하려면 여기에 끌어다 놓으세요.'; top: 50%; left: 50%; color: var(--color-main-050); font-size: .9em; transform: translate(-50%, -50%);} */
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area .explan{display: flex; flex-direction: row; justify-content: space-between; align-items: center; font-size: 1em; color: var(--color-static-main-085);}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area .explan label{box-sizing: border-box; padding: var(--mrgn-half) var(--mrgn); background: var(--color-static-main-015); border-radius: var(--mrgn-half); box-shadow:  0 3px 9px -3px var(--color-static-main-015); cursor: pointer; transition: box-shadow 250ms ease-out;}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area .explan label:hover{box-shadow:  0 5px 15px -5px var(--color-static-main-035);}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area ul.file_list{width: 100%; flex-direction: column; display: flex; gap: var(--mrgn-half); box-sizing: border-box; padding: 0 var(--mrgn-half); height: 100%; justify-content: center;}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area ul.file_list li.noti{color: var(--color-static-main-050); font-size: .9em; justify-content: center;}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area ul.file_list li{width: 100%; display: flex; flex-direction: row; align-items:center; justify-content: space-between;}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area ul.file_list li div{display: flex; align-items: center; min-width: 40%; justify-content: space-between; gap: var(--mrgn-half);}
#apply.sections.section_04 .width_con > #apply_con > div .file .dnd_area ul.file_list li div span.size{color: var(--color-static-main-035);}
#apply.sections.section_04 .width_con > #apply_con > div .file input[type="file"]{background: transparent; display: none; }
#apply.sections.section_04 .width_con > #apply_con > div.tail{display: flex; flex-direction: row; align-items: center; justify-content: space-between;}
#apply.sections.section_04 .width_con > #apply_con > div .access{display: flex; flex-direction: row; gap: var(--mrgn-half);}
#apply.sections.section_04 .width_con > #apply_con > div .access a{cursor: pointer;}
#apply.sections.section_04 .width_con > #apply_con input.submit{cursor: pointer; width: fit-content; place-self: flex-end; background: var(--color-point1); color: var(--color-static-sub); padding: 0 var(--mrgn-x2);}
/* #apply.sections.section_04 .width_con > #apply_con > div .file input[type="file"]{height: var(--mrgn-x4); padding: var(--mrgn); color: var(--color-main);} */
/* #apply.sections.section_04 .width_con > form > div label{display: block; width: 100%; box-sizing: border-box; padding: var(--mrgn-half) var(--mrgn); background: var(--color-sub);} */
/* #apply.sections.section_04 .width_con > form > div label{border: none; border-radius: var(--mrgn);height: 42px; box-sizing: border-box; padding: var(--mrgn);background: #e7e7e7;width: 100%;} */
/* #apply.sections.section_04 .width_con > form input, #apply.sections.section_04 .width_con > form select{width: 100%; background: transparent;  border: 0px; height: var(--mrgn-x2);} */
#apply.sections.section_04 .width_con > #apply_con input, #apply.sections.section_04 .width_con > #apply_con select{border: none; border-radius: var(--mrgn-half); height: var(--mrgn-x3); box-sizing: border-box; padding: 0 var(--mrgn); background: #e7e7e7;width: 100%;}

.framer-11vbc0s-container {
    top: 0;
    flex: none;
    height: 100px;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    z-index: 10
}