@charset "utf-8"; /* doc.css는 디자인페이지 스타일을 정의합니다. */

.doc-tit {margin-bottom:var(--margin-60-20);} 
.doc-tit h2 {margin-bottom:var(--margin-20-10); font-weight:500; color: var(--color-dark); font-size: var(--font-size-42-22); line-height: 1.285em;} 
.doc-tit p {font-size: var(--font-size-18); line-height:1.666em;} 

.doc-tit.type2 h2 {position:relative; width:fit-content; padding-top:10px; padding-right:10px; line-height:1em;} 
.doc-tit.type2 h2::after {content: ""; position: absolute; top:0; right:0; width:8px; height:8px; border-radius: 100%; background: linear-gradient(152deg, rgba(180,126,16,1) 0%, rgba(198,152,46,1) 100%);} 

.doc-cnt {padding-bottom:var(--padding-130-70);} 
.doc-cnt:last-child {padding-bottom:0;} 

.doc-sub-cnt {padding:var(--padding-100-60) 0;} 
.doc-sub-cnt:last-child {padding-bottom:0;} 

.mb150 {margin-bottom:var(--margin-150-70);} 
.mb20 {margin-bottom:var(--margin-20-10);} 
.mb40 {margin-bottom:var(--margin-40-20) !important;} 
.mb130 {margin-bottom:var(--margin-130-70);} 

.pt0 {padding-top:0 !important;} 
.pt130 {padding-top:var(--padding-130-70);} 
.pb0 {padding-bottom:0 !important;} 
.pb100 {padding-bottom:var(--padding-100-60) !important;} 

.txt-blue {color: var(--color-primary) !important;} 
.txt-grey {color: #888888 !important;} 
.txt-gold {color: #b47e10 !important;} 
.txt-gold2 {color: #c6982e !important;} 

.bg-grey {background-color: #eeefef;} 

.flex-wrap {display:flex;} 

.bold {font-weight:700 !important;} 

.sub-title.recruitment {position:relative;} 
.sub-title.recruitment::before {content: ""; position: absolute; top:0; right:0; width:491px; height:491px; background: url(/images/sub/bg-symbol.png) no-repeat center/contain; z-index:-1;} 
.recruitment .img.radius img {width: 81%; border-top-right-radius: var(--border-radius-100-50);} 

.icon-list.boarder {position:relative; height:290px;} 
.icon-list.boarder > li {display:flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; top:0; width: 54%; height: 100%; border: 1px solid rgb(221, 221, 221); text-align: center; border-radius: 50vh} 
.icon-list.boarder > li:first-child {left:0;} 
.icon-list.boarder > li:last-child {right:0;} 
.icon-list.boarder > li .ico {margin-bottom:var(--margin-25-15);} 
.icon-list.boarder > li > h3 {margin-bottom: var(--margin-15-10); font-weight:600; font-size: var(--font-size-26-18); line-height: 1em; color: #242424;} 
.icon-list.boarder > li > p {font-size: var(--body-font-size); line-height:1.625em;} 

.icon-list.type2 {display: flex; flex-wrap: wrap; margin: -15px;} 
.icon-list.type2 li {display:flex; align-items: center; padding:var(--padding-35-15) var(--padding-40-20); width: calc(33.3333% - 30px); margin: 15px; border-radius: 10px; background-color: #f8f8f8;} 
.icon-list.type2 li .ico {margin-right: var(--margin-30-16);} 
.icon-list.type2 li .ico img {border-radius: 10px; box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.1);} 
.icon-list.type2 li .txt-box {flex: 1 1 auto; width:1%; min-width: 0;} 
.icon-list.type2 li .txt-box .tit {font-size: var(--font-size-20); font-weight: 500; color: #242424; line-height:1.4em;} 

.one-list ul {display:flex; justify-content: center; align-items: center; margin:0 -30px;} 
.one-list ul > li {margin:0 30px; color: #fff;} 
.one-list ul >li .one {position:relative; display:flex; flex-direction: column; justify-content: center; align-items: center; width:380px; height:380px; border-radius: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; color: #fff;} 
.one-list ul >li:nth-child(1) .one {background-image: url(/images/sub/recruitment-02.jpg);} 
.one-list ul >li:nth-child(2) .one {background-image: url(/images/sub/recruitment-03.jpg);} 
.one-list ul >li:nth-child(3) .one {background-image: url(/images/sub/recruitment-04.jpg);} 
.one-list .tit {background-color: rgba(180,126,16,0.95); width:130px; height:38px; margin-bottom: var(--margin-15-10); text-align:center; line-height:38px; font-weight:500; font-size: var(--font-size-26-18); border-radius: 4px;} 
.one-list ul >li .one > ul {display:block;} 
.one-list ul >li .one > ul >li {margin:0; text-align:center;} 

.recruitment .logo-wrap .logo {width: 52%;} 
.recruitment .logo-wrap .doc-tit {flex: 1; padding-left:var(--padding-120-20);} 

.inquiry-wrap {display:flex;} 
.inquiry-form .ico-required {font-weight:500; font-size: var(--font-size-18); letter-spacing: -0.02em; color: var(--color-primary);} 
.inquiry-form .group {margin-bottom:55px;} 
.inquiry-form .group:last-child {margin-bottom: 0;} 
.inquiry-form .title {display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:var(--margin-60-20);} 
.inquiry-form .title h4 {color:#242424; font-size:var(--font-size-32-22); font-weight:600; line-height:1.555em; letter-spacing:-.02em;} 
.inquiry-form .title .required {color:#ababab; font-size:14px; line-height:1.33em;} 
.inquiry-form .form {font-size:15px; line-height:1.5em; letter-spacing:-.03em;} 
.inquiry-form .form .row {display:flex; flex-wrap:wrap; margin: -10px -30px;} 
.inquiry-form .form .col {width:50%; padding: 10px 30px;} 
.inquiry-form .form .col.col-x2 {width:100%;} 
.inquiry-form .form dt {font-size: var(--font-size-18); line-height:1.555em; margin-bottom: 10px; font-weight:500;} 
.inquiry-form .form .input {display: block; width: 100%; padding: 7px 19px; font-size: var(--body-font-size); line-height: 1.5em;} 
.inquiry-form .form select.input {padding-right:30px; background-size:10px auto; background-position:right 10px center;} 
.inquiry-form .form textarea.input {height:100px;} 
.inquiry-form .submit-area {display:flex; justify-content:space-between; align-items:flex-end; margin-top:40px;} 
.inquiry-form .form-agree {margin:0;} 
.inquiry-form .form-agree .check {text-align:left;} 
.inquiry-form .btn-pack.dark {background:#000; border-color:#000;} 
.inquiry-form .checkbox label:before {width: 25px; height: 25px; background-color: #aeaeae; border:0; border-radius: 100%;} 
.inquiry-form .form-agree .check {line-height: 1.875em;} 
.inquiry-form .form-agree .check a {color: #686868; display: inline-block; background: transparent; padding: 0 10px; font-size: var(--body-font-size); letter-spacing: -.02em; border: 0; margin:0; padding:0;} 

#sub .tab-menu {margin-bottom: var(--margin-80-40);} 
#sub .tab-menu ul {display: flex; justify-content: center; margin: 0 -5px;} 
#sub .tab-menu ul li {width: calc(20% - 10px); margin: 0 5px; border: 1px solid #ddd; text-align: center;} 
#sub .tab-menu ul li a {font-size: var(--font-size-18); font-weight: 500; letter-spacing: -.04em; height: var( --height-60-40); display: flex; justify-content: center; align-items: center;} 
#sub .tab-menu ul li.active a {color: #fff; background-color: var(--color-primary);} 

.bg-logo {position:relative;} 
.bg-logo::after {content: ""; position: absolute; right:0; bottom: -130px; width:858px; height:194px; background: url(/images/sub/bg-hive.png) no-repeat bottom right/contain;} 

.bg-wrap {position:relative; height: 560px;} 
.bg-wrap::before {content: ""; position: absolute; top: 0; left: 0; width: 86%; max-width: 100%; height: 100%; background-image: url(/images/sub/a-01.jpg); background-position: top right; background-repeat: no-repeat; background-size: contain; z-index: -1; border-right: 50vh;} 
.management-a #tab2 .bg-wrap::before {background-image: url(/images/sub/a-02.jpg);} 
.management-a #tab3 .bg-wrap::before {background-image: url(/images/sub/a-03.jpg);} 
.management-a #tab4 .bg-wrap::before {background-image: url(/images/sub/a-04.jpg);} 
.management-a #tab5 .bg-wrap::before {background-image: url(/images/sub/a-05.jpg);} 

.bg-wrap .contain {height:100%;} 
.bg-wrap .txt-wrap {display: flex; flex-direction: column; justify-content: center; height:100%;} 
.bg-wrap p {letter-spacing: -0.04em;} 
.bg-wrap p.t1 {margin-bottom:var(--margin-30-16); color: rgba(255, 255, 255, .8); font-weight:500; font-size: var(--font-size-18); line-height: 1em;} 
.bg-wrap p.t2 {margin-bottom:var(--margin-40-20); color: #fff; font-weight:700; font-size: var(--font-size-42-22); line-height:1.285em;} 
.bg-wrap p.t3 {font-size: var(--font-size-18); line-height:1.777em; color: #fff;} 

/* .management-b.bg-logo::after {right:auto; left:0; background-position: bottom left;}  */
.management-b .bg-wrap::before {left:auto; right:0; background-position: top left; background-image: url(/images/sub/b-01.jpg);
border-left: 50vh;} 
.management-b #tab2 .bg-wrap::before {background-image: url(/images/sub/b-02.jpg);} 
.management-b #tab3 .bg-wrap::before {background-image: url(/images/sub/b-03.jpg);} 
.management-b #tab4 .bg-wrap::before {background-image: url(/images/sub/b-04.jpg);} 
.management-b #tab5 .bg-wrap::before {background-image: url(/images/sub/b-05.jpg);} 

.reverse-list .cnt {display:flex; align-items: center;} 
.reverse-list .cnt .img {width:57%;} 
.reverse-list .cnt .txt {flex: 1; padding-left:var(--padding-80-20);} 
.reverse-list .txt p {letter-spacing: -0.04em;} 
.reverse-list .txt .cate {margin-bottom:var(--margin-30-16); font-weight:500; font-size: var(--font-size-18); color: rgba(36,36,36,0.8); line-height:1em;} 
.reverse-list .txt .tit {margin-bottom:var(--margin-40-20); font-weight:700; font-size: var(--font-size-42-22); line-height:1.285em; color: #242424; letter-spacing: -0.05em;} 
.reverse-list .txt .desc {font-size: var(--font-size-18); color: #242424; line-height:1.777em;} 
.reverse-list.type2 .cnt {flex-direction: row-reverse;} 
.reverse-list.type2 .cnt .txt {padding-left:0; padding-right:var(--padding-100-20);} 

.bg-cnt {position:relative; width:100%; height:480px; padding-left: var(--padding-80-20); display:flex; flex-direction: column; justify-content: center; background: url(/images/sub/funding-01.jpg) no-repeat center/cover;} 
.funding #tab2 .bg-cnt {background-image: url(/images/sub/funding-02.jpg);} 
.funding #tab3 .bg-cnt {background-image: url(/images/sub/funding-03.jpg);} 
.funding #tab4 .bg-cnt {background-image: url(/images/sub/funding-04.jpg);} 
.funding #tab5 .bg-cnt {background-image: url(/images/sub/funding-05.jpg);} 
.bg-cnt::after {content: ""; position: absolute; right:40px; bottom:-50px; width:292px; height:112px; background: url(/images/sub/logo-box.png) no-repeat center/contain;} 
.bg-cnt .txt p {letter-spacing: -0.04em; color: #fff;} 
.bg-cnt .txt .cate {margin-bottom:var(--margin-30-16); font-weight:500; font-size: var(--font-size-18); line-height:1em;} 
.bg-cnt .txt .tit {margin-bottom:var(--margin-40-20); font-weight:700; font-size: var(--font-size-42-22); line-height:1.285em; letter-spacing: -0.05em;} 
.bg-cnt .txt .desc {font-size: var(--font-size-18); line-height:1.777em;} 

.txt-wrap .cate {margin-bottom:var(--margin-30-16); font-weight:500; font-size: var(--font-size-18); line-height:1em; color: var(--color-primary);} 
.txt-wrap .tit {margin-bottom:var(--margin-40-20); font-weight:700; font-size: var(--font-size-42-22); line-height:1.285em; letter-spacing: -0.05em; color: #242424;} 
.txt-wrap .desc {margin-bottom:var(--margin-50-20); font-size: var(--font-size-18); line-height:1.777em;} 

/* 제휴안내 */
.partnership .cnt {position:relative; height:860px;} 
.partnership .cnt::before {content: ""; position: absolute; bottom:0; left:0; right:0; width:100%; height:630px; background-color: var(--color-primary); z-index:-2;} 
.partnership .cnt::after {content: ""; position: absolute; bottom:0; right:0; width:533px; height:121px; background: url(/images/sub/logo-hive-02.png) no-repeat center/contain; z-index:-1;} 
.partnership .flex-wrap {position: relative; align-items: center; justify-content: space-between; padding: var(--padding-80-40) 0 var(--padding-100-60);} 
.partnership .flex-wrap::after {content: ""; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width: 2px; height: 55px; margin-top: -10px; background-color: rgba(255, 255, 255, .6);} 
.partnership .flex-wrap .diagram {padding-right:var(--padding-85-15);} 
.partnership .flex-wrap p {color: #fff; font-size: var(--font-size-18); line-height:1.555em; letter-spacing: -0.04em; padding-left:var(--padding-85-15);} 
.partnership .flex-wrap > * {width:50%;} 

.doc-guide .t1 {margin-bottom:15px; font-weight:600; font-size: var(--font-size-32-22); line-height:1.3em; letter-spacing: -0.04em; color: var(--color-dark);} 
.doc-guide .t2 {color: #808080; letter-spacing: -0.04em;} 
.partnership .btn-link {margin:var(--margin-40-20) auto 0;} 
.doc-guide.type2 {margin-bottom:var(--margin-50-20);} 
.doc-guide.type2 .t1 {font-size: var(--font-size-24-18); font-weight:500;} 

/* 오시는길 */
.doc-tit.type2 h2.type2 {font-weight:600; font-size: var(--font-size-28-24);} 

#sub .root_daum_roughmap {width:100% !important; height:400px !important; border-radius: 10px;} 
#sub .root_daum_roughmap .wrap_map {height:400px !important; border-radius: 10px;} 
#sub .map01 .roughmap_lebel_text:after {content:"서울시 강서구 양천로 583"; font-size:12px; line-height:15px;} 
#sub .map02 .roughmap_lebel_text:after {content:"부산 연제구 중앙대로 1073";} 

.directions .flex-wrap {display: flex; align-items: center;} 
.directions .txt {flex: 1; padding-right:var(--padding-70-20);} 
.directions .map {width: 62.5%;} 
.directions .info h3 {font-weight:600; line-height:2.375em; color: #333;} 
.directions .info p {line-height:1.625em;} 
.directions .btn-link {margin-top:var(--margin-80-40);} 

/* RENEW */
.tab-sector{position: relative; margin-top: var(--margin-80-40);}
.tab-sector#tab1{margin-top: 0;}
.fixed-symbol{position: fixed; top: 90%; left: 50%; transform: translate(-50%, -50%); background: url('../images/common/symbol.png') no-repeat center/cover; width: 400px; height: 400px;}
.page .item{border-radius: 10px; padding: 30px; display: flex; background-color: #fff; position: relative; z-index: 1;}
.page .item.active{border: 2px solid #ccc;}
.page .item .image{margin-right: 30px; overflow: hidden; border-radius: 6px; flex-shrink: 0; width: 42.106%;}
.page .item .image img{max-width: 480px; width: 100%;}
.page .item .txt-wrap{flex-grow: 1;}
.page .item .txt-wrap .t1{color: #fff; border-radius: 10px; padding: 19px 21.457px; display: inline-block; font-size: var(--font-size-20); line-height: 1; font-weight: 600; margin-bottom: 30px;}
.page .item .txt-wrap .t2{color: #111; font-weight: 700; font-size: var(--font-size-34); line-height: 1.3;}
.page .item .txt-wrap .t3{color: #111; font-size: var(--font-size-20); border-top: 1px solid #dbdbdb; padding-top: 30px; margin-top: 30px; line-height: 1.6;}

.page .item + .item{}

.management-a .item .txt-wrap .t1{background-color: #b47e10;}
.management-b .item .txt-wrap .t1{background-color: #3d65b8;}
.innovation .item .txt-wrap .t1{background-color: #20a51a;}
.special .item .txt-wrap .t1{background-color: #4944c2;}
.special .item .txt-wrap .t3{border-top: 0; margin-top: 0; padding-top: 0;}
.hospital .item .txt-wrap .t1{background-color: #8150ea;}


/**********
* ## FAQ
**********/
.faq-wrap { margin:0 auto; border-top: 2px solid #a0a0a0; margin-top: 30px;}
.faq-wrap ul.faq{border-top: 0;}
.faq-wrap ul.faq li.faq-item { border-bottom:1px solid #a0a0a0;}
.faq-wrap ul.faq li.faq-item a.faq-title { padding: 15px 0 15px 20px; display:flex; position: relative; align-items: center; font-size: var(--font-size-18); font-weight: 600;}
.faq-wrap ul.faq li.faq-item a.faq-title:hover { background-color: #8150ea; color: #fff}
.faq-wrap ul.faq li.faq-item a.faq-title.active{ background-color: #8150ea; color: #fff;}
.faq-wrap ul.faq li.faq-item a.faq-title.active:hover { background-color: #8150ea; color: #fff;}
.faq-wrap ul.faq li.faq-item a.faq-title span { vertical-align:middle; display:inline-block}
.faq-wrap ul.faq li.faq-item a.faq-title span.subject {width:90%; font-size:2rem; padding-left: max(1rem, var(--vw-30)); flex-grow: 1;}	
/* .faq-wrap ul.faq li.faq-item a.faq-title span.arrow { text-indent: -9999px; background: url("../images/icons/ico-angle-down.png") center/cover no-repeat; width:13px; height:8px; position:absolute; top: 50%; margin-top: -4px; right:20px; transition: all ease 0.2s;} */
/* .faq-wrap ul.faq li.faq-item a.active .arrow { -webkit-transform:rotate(180deg); color:#333} */
.faq-wrap ul.faq li.faq-item .answer {display:none; padding: max(1rem, var(--vw-30)); overflow: hidden;}
.faq-wrap ul.faq li.faq-item .answer .answer-content {width: 90%; padding: 20px 40px; flex-grow: 1; background-color: #f7f7f7;}
.faq-wrap ul.faq li.faq-item .answer .answer-content li{list-style: disc;}
.faq-wrap ul.faq li.faq-item .answer .answer-content li + li{margin-top: 10px;}
.faq-wrap ul.faq li.faq-item .faq-label {display:inline-block; text-align: center; flex-shrink: 0; background-color: #f2f2f2; line-height: 1; padding: 7px 16px; border-radius: 16px; height: 3rem;}
.faq-wrap .btn-wrap {margin-top:20px; text-align: center}

.faq-wrap ul.faq li.faq-item a.faq-title::after {content:""; position:absolute; top:50%; right:15px; transform:translateY(-75%) rotate(45deg); width:10px; height:10px; border-right:2px solid #2c2c2c; border-bottom:2px solid #2c2c2c;}
.faq-wrap ul.faq li.faq-item a.active::after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.faq-wrap ul.faq li.faq-item a:hover::after{border-color:#fff;}


.faq-wrap.table ul.faq li.faq-item a.faq-title:hover,
.faq-wrap.table ul.faq li.faq-item a.faq-title.active{background-color: transparent; color: #111;}
.faq-wrap.table ul.faq li.faq-item a.faq-title::after{display: none;}