@charset "utf-8"; /* doc.css는 디자인페이지 스타일을 정의합니다. */
.doc-tit { position: relative; padding-bottom:50px; font-size: var(--font-size-40); margin-bottom: var(--space-30); font-family: "gimpogothic"; color: #000; line-height: 1em; text-align:center; } 
.doc-tit:after { content: ""; position: absolute; bottom:0; left: 50%; transform: translateX(-50%); width:30px; height:24px; background: url(/images/sub/bullet.png) no-repeat center/contain; } 

.doc-txt { padding-bottom:var(--space-60); font-family: "gimpogothic"; font-size: var(--font-size-20); line-height:1.8em; text-align:center; } 

.doc-cnt { padding:var(--space-130) 0; } 
.doc-cnt:first-child { padding-top:0; } 

.fs16-28 { font-size: var(--font-size-16); line-height:1.75em; } 
.fs18-28 { font-size: var(--font-size-18); line-height:1.56em; } 

.pt0 { padding-top:0 !important; } 
.pt20 { padding-top:var(--space-20) !important; } 
.pt40 { padding-top:var(--space-40) !important; } 
.pt70 { padding-top:var(--space-70) !important; } 
.pb0 { padding-bottom:0 !important; } 
.pb20 { padding-bottom:var(--space-20) !important; } 
.pb30 { padding-bottom:var(--space-30) !important; } 
.pr0 { padding-right:0 !important; } 

.m0 { margin:0 !important; } 
.m-0-auto { margin:0 auto !important; } 
.mt90 { margin-top:var(--space-90) !important; } 
.mb12 { margin-bottom:12px !important; } 

.w-fit { width: fit-content !important; } 

.txt-primary { color: var(--color-primary) !important; } 
.txt-second { color: var(--color-secondary) !important; } 
.txt-grey { color: #888888 !important; } 
.txt-dark { color: #242424 !important; } 
.txt-wht { color: #fff !important; } 

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

.flex-wrap { display:flex; } 

small {font-size: 12px !important;}

.dot-list > li { position:relative; padding-left:10px; } 
.dot-list > li:before { content:"·"; position:absolute; top:-2px; left:0; font-weight:700; font-size:20px; color:#242424; } 
.dot-list > li strong { font-weight:600; } 

.about { text-align:center; } 
.about p { font-family: "gimpogothic"; } 
.about .t1 { padding-top:var(--space-50); font-size: var(--font-size-28); color: #242424; line-height:1.29em; } 
.about .t2 { padding-top:var(--space-20); font-size: var(--font-size-20); line-height:1.8em; } 

.greetings { background: url(/images/sub/bg-greetings.jpg) no-repeat center/cover; text-align:center; color: #fff; } 
.greetings p { font-family: "gimpogothic"; margin-bottom:var(--space-20); font-size: var(--font-size-20); line-height:1.8em; } 
.greetings p.t1 { font-size: var(--font-size-28); line-height:1.57em; } 
.greetings .sign { display:flex; align-items: center; width:fit-content; margin:0 auto; font-size:var(--font-size-20); font-weight:700; } 
.greetings .sign img { display:inline-block; margin-left:var(--space-30); } 

.csr .img-list { display:flex; gap: 12px; } 
.csr .img-list:first-child { margin-bottom:12px; } 

/* 경쟁력 */
.sub-tab { position:relative; margin-bottom:var(--space-100); } 
.sub-tab .tab { margin:0 auto; max-width:1200px; } 
.sub-tab .tab ul { display:flex; } 
.sub-tab .tab ul li { flex:1; text-align:center; border:1px solid #ddd; border-bottom: 1px solid var(--color-primary); background-color: #fafafa; border-top-left-radius: var(--border-radius-20-10); border-top-right-radius: var(--border-radius-20-10); } 
.sub-tab .tab ul li:first-child { border-left:1px solid #ddd; } 
.sub-tab .tab ul li a { display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height: clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px ); padding:0 15px; color:#898989; font-weight:700; line-height:1.2em; letter-spacing:-.03em; } 
.sub-tab .tab ul li.active { background:#fff; border-color: var(--color-primary); border-bottom: 1px solid #fff; } 
.sub-tab .tab ul li.active a { color:var(--color-primary); } 

.reverse-list { border-top:1px solid #242424; } 
.reverse-list .cnt { display:flex; align-items: center; padding:var(--space-60) 0; border-bottom: 1px dashed #ddd; } 
.reverse-list .cnt:last-child { border-bottom: 0; } 
.reverse-list .cnt > div { width:50%; } 
.reverse-list .cnt > div:first-child { padding-left:var(--space-40); } 
.reverse-list .cnt > div:last-child { padding-right:var(--space-40); text-align: right; } 
.reverse-list .tit-wrap { display:flex; align-items: end; gap: var(--space-30); padding-bottom:var(--space-40); } 
.reverse-list .tit-wrap h3 { font-family: "gimpogothic"; font-size: var(--font-size-28); line-height:1em; color: #242424; } 
.reverse-list .tit-wrap span { display:inline-block; margin-bottom: -10px; font-size: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px ); line-height:1em; opacity:0.1; } 
.reverse-list .txt p { font-size: var(--font-size-16); line-height:1.75em; } 
.reverse-list .cnt:nth-child(even) { flex-direction: row-reverse; } 
.reverse-list .cnt:nth-child(even) > div:first-child { padding-left:0; padding-right:var(--space-40); } 
.reverse-list .cnt:nth-child(even) > div:last-child { padding-right:0; padding-left:var(--space-40); text-align: left; } 
.reverse-list .cnt:nth-child(even) .txt { text-align:right; } 
.reverse-list .cnt:nth-child(even) .txt .tit-wrap { flex-direction: row-reverse; } 
.reverse-list .cnt:last-child { padding-bottom:0; } 

.reverse-list .tit-wrap.type2 { display:block !important; } 
.reverse-list .tit-wrap.type2 span { margin-bottom:0; padding-bottom:var(--space-20); } 
.reverse-list .cnt03 > div:first-child { width:36.7% !important; } 
.reverse-list .cnt03 > div:last-child { width:auto !important; } 
.reverse-list .cnt04 > div:first-child { width:40.8% !important; } 
.reverse-list .cnt04 > div:last-child { width:auto !important; } 

.box-list { display:flex; gap: 1.25rem; } 
.box-list .box { height:320px; display:flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 12px; box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.1); padding:var(--space-40) var(--space-30); text-align:center; } 
.box-list .box strong { display:block; font-size: var(--font-size-20); color: #242424; line-height:1.4em; } 

.sns-list { display:flex; justify-content: center; gap: 5px; margin-top:var(--space-70); } 
.sns-list a { display:block; } 

.cnt-list { display:flex; gap: 1.25rem; text-align:center; } 
.cnt-list .img { margin-bottom:1.25rem; } 
.cnt-list p { color: #242424; } 

/* 이력 메뉴 */
.menu-year { margin-bottom:50px; } 
.menu-year ul { display: flex; justify-content: center; gap: 10px; } 
.menu-year ul li a { display: flex; justify-content: center; align-items: center; width: 100px; height: 42px; border-radius: 50vh; background: #fff; color: #a8a8a8; text-align: center; font-weight:700; letter-spacing: -0.04em; background-color: #f1f1f1; } 
.menu-year ul li.active a { background-color: var(--color-primary); color: #fff; } 

/* 찾아오시는 길 */
.root_daum_roughmap { width:100% !important; height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px ) !important; border-radius: var(--space-30); } 
.root_daum_roughmap .wrap_map { width:100% !important; height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px ) !important; border-radius: var(--space-30); } 
.roughmap_lebel_text:after { content:""; font-size:12px; line-height:15px; } 
.directions { margin-top: var(--space-50); display: flex; } 
.directions .address-info { width: 50%; } 
.directions .address-info .comp { color:var(--color-primary); font-weight: 500; margin-bottom: 5px; } 
.directions .address-info .addr { color:#242424; font-size: var(--font-size-20); font-weight: 500; line-height:1.33em; letter-spacing:-.03em; margin-bottom: 10px; } 
.directions .address-info .etc { color: #686868; } 
.directions .address-info .etc span { display:inline-block; margin-right:16px; } 
.directions .address-info .etc span:last-child { margin-right:0; } 
.directions .contact-info { line-height:1.5em; width: 50%; } 
.directions .contact-info dl { display:flex; padding: 10px 0; } 
.directions .contact-info dt { width: 140px; color:#242424; font-weight:500; } 
.directions .contact-info dt img { display:inline-block; margin-right:var(--space-20); vertical-align: middle; } 
.directions .contact-info dd { flex:1 1 auto; min-width:0; width:1%; } 
.directions .link-list a { display:inline-block; } 
.doc-guide { display:block; font-size: var(--font-size-14); color: #898989; line-height:1.57em; } 

 /* 문의 */
.join-form { max-width:1200px; margin:0 auto; } 
.join-form .required { color:#ca3a1c } 
.join-form table { width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #868686; border-bottom:1px solid #868686; line-height:1.5em; } 
.join-form table th { padding:12px 15px; border:1px solid #ddd; background:#fafafa; font-weight:500; color:#333; } 
.join-form table td { padding:12px 20px; border:1px solid #ddd; color:#505050; } 
.join-form table tr:last-child th { border-bottom: 0; } 
.join-form table tr:last-child td { border-bottom: 0; } 
.join-form tr th:first-child,
.join-form tr td:first-child { border-left:0; } 
.join-form tr th:last-child,
.join-form tr td:last-child { border-right:0; } 
.join-form input[readonly] { background-color:#fff; color:#505050; } 
.join-form .help-text { display:inline-block; margin-left:10px; color:#767676; } 
.join-form + .buttons { margin-top:var(--space-50); } 
.join-form .item { display: inline-block; margin: 4px 16px 4px 0; } 


/* .board-form { max-width:1200px; margin:0 auto; } 
.board-form .required { color:#ca3a1c } 
.board-form table { width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #868686; border-bottom:1px solid #868686; line-height:1.5em; } 
.board-form table th { padding:12px 15px; border:1px solid #ddd; background:#fafafa; font-weight:500; color:#333; } 
.board-form table td { padding:12px 20px; border:1px solid #ddd; color:#505050; } 
.board-form table tr:last-child th { border-bottom: 0; } 
.board-form table tr:last-child td { border-bottom: 0; } 
.board-form tr th:first-child,
.board-form tr td:first-child { border-left:0; } 
.board-form tr th:last-child,
.board-form tr td:last-child { border-right:0; } 
.board-form input[readonly] { background-color:#fff; color:#505050; } 
.board-form .help-text { display:inline-block; margin-left:10px; color:#767676; } 
.board-form + .buttons { margin-top:var(--space-50); } 
.board-form .item { display: inline-block; margin: 4px 16px 4px 0; }  */