@charset "utf-8";
/* --------------------------------------------------
    element
----------------------------------------------------- */
/* *** Font *** */
.GMBold00 { font-size: clamp(34px, 5.31vw, 68px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMBold01 { font-size: clamp(30px, 4.69vw, 60px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMBold02 { font-size: clamp(28px, 4.06vw, 52px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMBold03 { font-size: clamp(26px, 3.44vw, 44px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMBold04 { font-size: clamp(24px, 2.81vw, 36px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMBold05 { font-size: clamp(22px, 2.19vw, 28px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMBold06 { font-size: clamp(20px, 2.19vw, 24px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
.GMLight00 { font-size: clamp(34px, 5.31vw, 68px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
.GMLight01 { font-size: clamp(30px, 4.69vw, 60px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
.GMLight02 { font-size: clamp(28px, 4.06vw, 52px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
.GMLight03 { font-size: clamp(26px, 3.44vw, 44px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
.GMLight04 { font-size: clamp(24px, 2.81vw, 36px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
.GMLight05 { font-size: clamp(22px, 2.19vw, 28px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
.GMLight06 { font-size: clamp(20px, 2.19vw, 24px); font-family: 'SeoulAlrimMedium'; font-weight: 500; }
/* 아리따부리 폰트 */
.ARBold00 { font-size: clamp(34px, 5.31vw, 68px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARBold01 { font-size: clamp(30px, 4.69vw, 60px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARBold02 { font-size: clamp(28px, 4.06vw, 52px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARBold03 { font-size: clamp(26px, 3.44vw, 44px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARBold04 { font-size: clamp(24px, 2.81vw, 36px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARBold05 { font-size: clamp(22px, 2.19vw, 28px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARBold06 { font-size: clamp(20px, 2.19vw, 24px); font-family: 'AritaBuriKRBold'; font-weight: 700; }
.ARLight00 { font-size: clamp(34px, 5.31vw, 68px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
.ARLight01 { font-size: clamp(30px, 4.69vw, 60px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
.ARLight02 { font-size: clamp(28px, 4.06vw, 52px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
.ARLight03 { font-size: clamp(26px, 3.44vw, 44px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
.ARLight04 { font-size: clamp(24px, 2.81vw, 36px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
.ARLight05 { font-size: clamp(22px, 2.19vw, 28px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
.ARLight06 { font-size: clamp(20px, 2.19vw, 24px); font-family: 'AritaBuriKRLight'; font-weight: 300; }
/* 프리텐다드 폰트 */
.PTBold00 { font-size: clamp(34px, 5.31vw, 68px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTBold01 { font-size: clamp(30px, 4.69vw, 60px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTBold02 { font-size: clamp(28px, 4.06vw, 52px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTBold03 { font-size: clamp(26px, 3.44vw, 44px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTBold04 { font-size: clamp(24px, 2.81vw, 36px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTBold05 { font-size: clamp(22px, 2.19vw, 28px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTBold06 { font-size: clamp(20px, 2.19vw, 24px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.PTMedium00 { font-size: clamp(34px, 5.31vw, 68px); font-family: 'PreGOV-Me'; font-weight: 500; }
.PTMedium01 { font-size: clamp(30px, 4.69vw, 60px); font-family: 'PreGOV-Me'; font-weight: 500; }
.PTMedium02 { font-size: clamp(28px, 4.06vw, 52px); font-family: 'PreGOV-Me'; font-weight: 500; }
.PTMedium03 { font-size: clamp(26px, 3.44vw, 44px); font-family: 'PreGOV-Me'; font-weight: 500; }
.PTMedium04 { font-size: clamp(24px, 2.81vw, 36px); font-family: 'PreGOV-Me'; font-weight: 500; }
.PTMedium05 { font-size: clamp(22px, 2.19vw, 28px); font-family: 'PreGOV-Me'; font-weight: 500; }
.PTMedium06 { font-size: clamp(20px, 2.19vw, 24px); font-family: 'PreGOV-Me'; font-weight: 500; }
/* 본문 타이틀 */
.colBolTit01 { font-size: clamp(26px, 2.5vw, 32px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.colBolTit02 { font-size: clamp(24px, 2.19vw, 28px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.colBolTit03 { font-size: clamp(22px, 1.88vw, 24px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.colBolTit04 { font-size: clamp(20px, 1.72vw, 22px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.colBolTit05 { font-size: clamp(18px, 1.56vw, 20px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.colBolTit06 { font-size: clamp(17px, 1.41vw, 18px); font-family: 'PreGOV-Bo'; font-weight: 700; }
.colMedTit01 { font-size: clamp(26px, 2.5vw, 32px); font-family: 'PreGOV-Me'; font-weight: 500; }
.colMedTit02 { font-size: clamp(24px, 2.19vw, 28px); font-family: 'PreGOV-Me'; font-weight: 500; }
.colMedTit03 { font-size: clamp(22px, 1.88vw, 24px); font-family: 'PreGOV-Me'; font-weight: 500; }
.colMedTit04 { font-size: clamp(20px, 1.72vw, 22px); font-family: 'PreGOV-Me'; font-weight: 500; }
.colMedTit05 { font-size: clamp(18px, 1.56vw, 20px); font-family: 'PreGOV-Me'; font-weight: 500; }
.colMedTit06 { font-size: clamp(17px, 1.41vw, 18px); font-family: 'PreGOV-Me'; font-weight: 500; }
/* 본문 */
.colMed01 { font-size: clamp(18px, 1.72vw, 22px); font-family: 'PreGOV-Me'; font-weight: 500; line-height: 1.6; }
.colMed02 { font-size: clamp(17px, 1.56vw, 20px); font-family: 'PreGOV-Me'; font-weight: 500; line-height: 1.6; }
.colMed03 { font-size: clamp(16px, 1.41vw, 18px); font-family: 'PreGOV-Me'; font-weight: 500; line-height: 1.6; }
.colMed04 { font-size: clamp(15px, 1.25vw, 16px); font-family: 'PreGOV-Me'; font-weight: 500; line-height: 1.6; }
.colReg01 { font-size: clamp(18px, 1.72vw, 22px); font-family: 'PreGOV-Re'; font-weight: 400; line-height: 1.6; }
.colReg02 { font-size: clamp(17px, 1.56vw, 20px); font-family: 'PreGOV-Re'; font-weight: 400; line-height: 1.6; }
.colReg03 { font-size: clamp(16px, 1.41vw, 18px); font-family: 'PreGOV-Re'; font-weight: 400; line-height: 1.6; }
.colReg04 { font-size: clamp(15px, 1.25vw, 16px); font-family: 'PreGOV-Re'; font-weight: 400; line-height: 1.6; }
.colLig01 { font-size: clamp(18px, 1.72vw, 22px); font-family: 'PreGOV-Li'; font-weight: 300; line-height: 1.6; }
.colLig02 { font-size: clamp(17px, 1.56vw, 20px); font-family: 'PreGOV-Li'; font-weight: 300; line-height: 1.6; }
.colLig03 { font-size: clamp(16px, 1.41vw, 18px); font-family: 'PreGOV-Li'; font-weight: 300; line-height: 1.6; }
.colLig04 { font-size: clamp(15px, 1.25vw, 16px); font-family: 'PreGOV-Li'; font-weight: 300; line-height: 1.6; }
/* *** 여백 *** */
/* margin */
.mgbottom05 { margin-bottom: 0.25rem; }
.mgbottom10 { margin-bottom: 0.5rem; }
.mgbottom15 { margin-bottom: 0.75rem; }
.mgbottom20 { margin-bottom: 1rem; }
.mgbottom25 { margin-bottom: 1.25rem; }
.mgbottom30 { margin-bottom: 1.5rem; }
.mgbottom40 { margin-bottom: 2rem; }
.mgbottom50 { margin-bottom: 2.5rem; }
.mgbottom60 { margin-bottom: 3rem; }
.mgbottom70 { margin-bottom: 3.5rem; }
.mgbottom80 { margin-bottom: 4rem; }
.mgbottom100 { margin-bottom: 5rem; }
.mgbottom125 { margin-bottom: 6.25rem; }
.mgbottom150 { margin-bottom: 7.5rem; }
.mgtop05 { margin-top: 0.25rem; }
.mgtop10 { margin-top: 0.5rem; }
.mgtop15 { margin-top: 0.75rem; }
.mgtop20 { margin-top: 1rem; }
.mgtop25 { margin-top: 1.25rem; }
.mgtop30 { margin-top: 1.5rem; }
.pd10 { padding: 0.5rem; }
.pd15 { padding: 0.75rem; }
.pd20 { padding: 1rem; }
.pd30 { padding: 1.5rem; }
.pdbottom05 { padding-bottom: 0.25rem; }
.pdbottom10 { padding-bottom: 0.5rem; }
.pdbottom15 { padding-bottom: 0.75rem; }
.pdbottom20 { padding-bottom: 1rem; }
.pdbottom25 { padding-bottom: 1.25rem; }
.pdbottom30 { padding-bottom: 1.5rem; }
.pdbottom40 { padding-bottom: 2rem; }
.pdbottom50 { padding-bottom: 2.5rem; }
.pdtop05 { padding-top: 0.25rem; }
.pdtop10 { padding-top: 0.5rem; }
.pdtop15 { padding-top: 0.75rem; }
.pdtop20 { padding-top: 1rem; }
.pdtop25 { padding-top: 1.25rem; }
.pdtop30 { padding-top: 1.5rem; }

/* common */
/* *** common *** */
body.menuOpen { overflow: hidden; }
#container { position: relative; height: 100%; min-height: 100vh; box-sizing: border-box; }
#container.index { overflow-y: auto; }
#container .outline { position: relative; padding: 0 1rem; margin: 0 auto; }
@media all and (max-width: 1023px){
    #container { height: auto; overflow: visible; }
}
/* header */
header { position: relative; background-color: #fff; z-index: 100; }
#container header .outline { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; }
#container header .outline .logo img { width: clamp(140px ,11.979vw, 230px); height: auto; }
#container header .outline .menu { position: relative; display: flex; flex-flow: row nowrap; align-items: center; }
#container header .outline .menu li.menuBtn { margin-left: 1rem; }
#container header .outline .menu li a { display: flex; justify-content: center; align-items: center; padding: 0.3rem; }
#container header .outline .menu li.menuBtn a { padding: 0.3rem; }
#container header .outline .menu li a img { width: clamp(26px, 2.083vw, 40px); height: auto; }
#container header .outline .menu li.menuBtn a img { width: clamp(34px, 2.604vw, 50px); height: auto; }
#container header #progressCon { position: absolute; left: 0; bottom: 0; width: 100%; height: 5px; background-color: #d9d9d9; }
@media all and (max-width: 390px){
    #container header .outline .menu li.menuBtn { margin-left: 0.5rem; }
    #container header .outline .menu li a { padding: 0.3rem 0.15rem; }
    #container header .outline .menu li a img { width: clamp(23px, 2.083vw, 40px); }
    #container header .outline .menu li.menuBtn a img { width: clamp(30px, 2.604vw, 50px); }
}
/* footer */
#footer { position: relative; padding: 0.5rem 1rem; background-color: #f5f5f5; border-top: 3px solid #aaa; }
#container footer .outline { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 0.3rem 1rem; padding: 0; background-color: inherit; }
#container footer .footerLogo { display: inline-block; }
#container footer .footerLogo figure img { width: clamp(150px, 10.417vw, 200px); height: auto; }
#container footer address span { display: block; font-size: 0.9rem; text-align: right; font-style: normal; }
#container footer .copyright { position: relative; font-size: 0.8rem; font-family: 'PreGOV-Bo'; font-weight: 700; text-align: right; width: 100%; line-height: 1.2; }
@media all and (max-width: 1366px){
    #container footer address span { font-size: 0.8rem; }
}
@media all and (max-width: 1023px){
    #container { padding-top: 75px; }
    header { position: fixed; top: 0; left: 0; width: 100%; }
    #footer { padding: 1.5rem 1rem; }
    #container footer .outline { justify-content: center; gap: 0.75rem; }
    #container footer .outline address { width: 100%; }
    #container footer .outline address span { text-align: center; width: 100%; }
    #container footer .copyright { text-align: center; }
}
/* screen cover & side menu */
body.menuOpen #screenCover { display: block; }
body.menuOpen #sideMenu { display: block; }
#screenCover { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; height: 100dvh; height: 100svh; background-color: rgba(0,0,0,.4); z-index: 50; }
#sideMenu { display: none; position: fixed; top: 0; right: 0; padding: 2rem; width: 600px; height: 100%; height: 100dvh; height: 100svh; background-color: #e5e5e5; z-index: 300; }
#sideMenu #close { position: absolute; top: 15px; right: 20px; display: flex; justify-content: center; align-items: center; color: #000; width: 60px; height: 60px; cursor: pointer; background-color: transparent; }
#sideMenu #close i { font-size: clamp(30px, 2.604vw, 50px); color: #000; }
#sideMenu .inBx dt { position: relative; display: inline-block; padding: 0.7rem; border: 1px solid #000; }
#sideMenu .inBx dt span { position: relative; display: inline-block; font-size: 1rem; font-family: 'SeoulAlrimMedium'; font-weight: 500; }
#sideMenu .inBx dt strong { position: relative; display: inline-block; padding-left: 1rem; font-size: 1.1rem; font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
#sideMenu .inBx dt strong::before { position: absolute; content: ""; left: 0.3rem; top: 50%; transform: translateY(-50%); width: 2px; height: 0.9rem; background-color: #000; }
#sideMenu .inBx dd { position: relative; height: calc(100vh - 4rem - 3rem - 3rem - 1rem); overflow: hidden; overflow-y: auto; }
#sideMenu .inBx dd ul { position: relative; padding: 1rem 0; }
#sideMenu .inBx dd ul li + li { margin-top: 1rem; }
#sideMenu .inBx dd ul li a { position: relative; display: block; padding-right: 0.7rem; }
#sideMenu .inBx dd ul li a::before { display: none; position: absolute; content: ""; right: 5px; top: 50%; transform: translateY(-50%); width: 0.75rem; height: 0.75rem; border-radius: 50%; background-color: #E64E25; }
#sideMenu .inBx dd ul li a:hover::before { display: block; }
#sideMenu .inBx dd ul li a h3 { font-size: clamp(20px, 1.5vw, 26px); font-family: 'SeoulAlrimExtraBold'; font-weight: 800; }
#sideMenu .inBx dd ul li a p { font-size: clamp(17px, 1.1vw, 20px); margin-top: 3px; font-family: 'PreGOV-Re'; font-weight: 400; }
#sideMenu ol { position: absolute; left: 2rem; bottom: 2rem; display: flex; flex-flow: row nowrap; gap: 0.5rem; width: calc(100% - 4rem); }
#sideMenu ol li { position: relative; width: calc(50% - 0.5rem / 2); }
#sideMenu ol li a { position: relative; display: block; text-align: center; font-size: clamp(18px, 1.042vw, 20px); font-family: 'PreGOV-Me'; font-weight: 500; width: 100%; line-height: 3em; }
#sideMenu ol li:nth-child(1) a { color: #fff; background-color: #E64E25; }
#sideMenu ol li:nth-child(2) a { color: #000; background-color: #c9c9c9; }
@media all and (max-width: 1024px){
    #sideMenu { padding: 1rem; }
    #sideMenu #close { top: 15px; right: 20px; width: 40px; height: 40px; }
    #sideMenu ol { left: 1rem; bottom: 1rem; width: calc(100% - 2rem); }
    #sideMenu ol li a { line-height: 2.5em; }
    #sideMenu .inBx dd { height: calc(100vh - 2rem - 3rem - 3rem - 1rem); }
}
@media all and (max-width: 767px){
    #sideMenu { width: 500px; }
}
@media all and (max-width: 599px){
    #sideMenu { width: 80%; }
}
@media all and (max-width: 412px){
    #sideMenu { width: 90%; }
}
@media all and (max-width: 375px){
    #sideMenu { width: 100%; }
    #sideMenu #close { top: 15px; right: 20px; width: 30px; height: 30px; }
}
/* image & text select */
#container img { -webkit-user-drag: none; }
#container h1,
#container h2,
#container h3,
#container h4,
#container h5,
#container h6,
#container p,
#container span,
#container strong,
#container i { -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }

/* *** element *** */
/* 일반 숫자 리스트 */
ul { position: relative; }
ul li { position: relative; font-size: 0.95rem; }
ul li::before, ul li::after { font-size: inherit; font-weight: inherit; color: inherit; line-height: inherit; }
.numList { counter-reset: number 0; }
.numList > li { padding-left: 1.2rem; }
.numList > li::before { position: absolute; counter-increment: number 1; content: counter(number)"."; top: 0; left: 0; }
.numParent { counter-reset: number 0; }
.numParent > li { padding-left: 1.2rem; }
.numParent > li::before { position: absolute; counter-increment: number 1; content: counter(number)")"; top: 0; left: 0; }
.numCircle > li { padding-left: 1.2rem; }
.numCircle > li::before { position: absolute; content: ""; top: 0; left: 0; }
.numCircle > li:nth-child(1)::before { content: "①"; }
.numCircle > li:nth-child(2)::before { content: "②"; }
.numCircle > li:nth-child(3)::before { content: "③"; }
.numCircle > li:nth-child(4)::before { content: "④"; }
.numCircle > li:nth-child(5)::before { content: "⑤"; }
.numCircle > li:nth-child(6)::before { content: "⑥"; }
.numCircle > li:nth-child(7)::before { content: "⑦"; }
.numCircle > li:nth-child(8)::before { content: "⑧"; }
.numCircle > li:nth-child(9)::before { content: "⑨"; }
.numCircle > li:nth-child(10)::before { content: "⑩"; }
.numCircle > li:nth-child(11)::before { content: "⑪"; }
.numCircle > li:nth-child(12)::before { content: "⑫"; }
.numCircle > li:nth-child(13)::before { content: "⑬"; }
.numCircle > li:nth-child(14)::before { content: "⑭"; }
.numCircle > li:nth-child(15)::before { content: "⑮"; }
.dotList > li { padding-left: 1.2rem; }
.dotList > li::before { position: absolute; content: "•"; top: 0; left: 0.3rem; }
.dashList > li { padding-left: 1.2rem; }
.dashList > li::before { position: absolute; content: "-"; top: 0; left: 0.2rem; }
.billList > li { padding-left: 1.2rem; }
.billList > li::before { position: absolute; content: "※"; top: 0; left: 0; }
.other01List > li { position: relative; padding-left: 5rem; text-align: left; }
.other01List > li span { position: absolute; top: 0; left: 0; display: flex; flex-flow: row nowrap; justify-content: space-between; margin-right: 0.1rem; padding: 0 0.25rem; color: #222; text-align: justify; width: 3.8rem; padding: 0 0.4rem; border-radius: 0.4rem; background-color: var(--secondClr1); }
.other01List > li span i { position: relative; font-style: normal; color: #fff; font-size: 0.85em; font-family: 'PreGOV-Me' !important; font-weight: 500; line-height: 1.4rem; }
@media all and (max-width: 599px){
    .other01List > li span { top: 2px; }
}

/* layout */
.box2n1 { position: relative; display: flex; flex-flow: row wrap; gap: 1rem; }
.box2n1 .bx { width: calc(50% - 1rem / 2); }
.box3n1 { position: relative; display: flex; flex-flow: row wrap; gap: 1rem; }
.box3n1 .bx { width: calc(33.3333% - 2rem / 3); }
.box4n1 { position: relative; display: flex; flex-flow: row wrap; gap: 1rem; }
.box4n1 .bx { width: calc(25% - 3rem / 4); }

/* 인용 & 참조 */
.expatiWrap { position: relative; }
.expatiWrap h5 { font-size: clamp(19px, 1.146vw, 22px) !important; color: #222 !important; }
.expatiWrap ul li a { position: relative; display: block; margin-bottom: 0.5rem; transition: color .3s cubic-bezier(0.76, 0, 0.24, 1); }
#subcon .link:hover { transition: color .3s cubic-bezier(0.76, 0, 0.24, 1); }
.expatiWrap ul li a:hover,
#subcon .link:hover { color: var(--secondClr1); }

/* *** table *** */
.tableWrap { position: relative; }
table { border-top: 3px solid #222; border-bottom: 1px solid #222; user-select: none; }
table .no01 { width: auto; }
table .no02 { width: auto; }
table .no03 { width: auto; }
table .no04 { width: auto; }
table tr th { padding: 0.75rem 0.5rem; font-size: 0.95rem; font-family: 'PreGOV-Bo'; font-weight: 700; color: #222; text-align: center; background-color: #e9e9e9; border-bottom: 1px solid #222; border-right: 1px solid #222; }
table tr th:last-child { border-right: 0px solid #222; }
table tr td { padding: 0.5rem 0.5rem; font-size: 0.95rem; font-family: 'PreGOV-Re'; font-weight: 400; color: #444; background-color: #fff; border-bottom: 1px solid #222; border-right: 1px solid #222; }
table tr td:last-child { border-right: 0px solid #222; }
.tableWrap.scroll { position: relative; overflow: hidden; }
@media all and (max-width: 1023px){
    .tableWrap.scroll { overflow-x: auto; }
    .tableWrap.scroll table { width: 1024px; }
}
@media all and (max-width: 768px){
    .tableWrap.scroll { overflow-x: auto; }
    .tableWrap.scroll table { width: 800px; }
}
@media all and (max-width: 599px){
    .tableWrap.scroll { overflow-x: auto; }
    .tableWrap.scroll table { width: 600px; }
}

/* qna Layout */
.qna01 { position: relative; display: flex; flex-flow: row wrap; align-items: flex-start; gap: 2rem; }
.qna01 .qu { position: sticky; top: 180px; transition: top 1s cubic-bezier(0.87, 0, 0.13, 1); width: 360px; }
.qna01 .an { width: calc(100% - 360px - 2rem); }
.qna01 div span { position: relative; display: inline-block; margin-bottom: 1rem; text-align: center; width: 4.5rem; line-height: 2rem; border: 2px solid #222; border-radius: 2rem; }
.qna01 .qu span { color: var(--secondClr1); border-color: var(--secondClr1); }
.qna01 .qu span + h3 { color: var(--secondClr1); }
@media all and (max-width: 1023px){
    .qna01 .qu { width: 300px; }
    .qna01 .an { width: calc(100% - 300px - 2rem); }
}
@media all and (max-width: 768px){
    .qna01 .qu { position: relative; top: auto; width: 100% }
    .qna01 .an { width: 100%; }
}

/* author */
.author { position: relative; padding: 2rem 14rem 2rem 2rem; background-color: #E9F4F9; border-radius: 1rem; }
.author h4 { position: relative; display: inline-block; padding: 0.5rem 1rem; background-color: #B9DDEB; border-radius: 2rem; }
.author img { position: absolute; bottom: 2rem; right: 2rem; height: auto; max-width: 7rem; border-radius: 0.8rem; z-index: 10; }
@media all and (max-width: 599px){
    .author { position: relative; padding: 2rem 1rem; }
    .author img { position: relative; bottom: auto; right: auto; margin-top: 1rem; }
}

/* color box */
.clrBx { position: relative; padding: 1rem; background-color: #E9F4F9; border-radius: 1rem; }
.clrBx02 { position: relative; padding: 1rem; background-color: #f7f7f7; border-radius: 1rem; }

/* img Layout */
figure { position: relative; display: block; width: 100%; /* box-shadow: 10px 10px 20px rgba(0, 0, 0, .4); */ /* border-radius: 1rem; */ overflow: hidden; }
/* figure img { width: 100%; } */
.stickyWrap { position: relative; display: flex; flex-flow: row wrap; align-items: flex-start; gap: 1.5rem; overflow: visible; }
.stickyWrap .bx { position: relative; width: calc(50% - 1.5rem / 2); }
.stickyWrap .sticky { position: sticky; top: 180px; transition: top 1s cubic-bezier(0.87, 0, 0.13, 1); }
@media all and (max-width: 1023px){
    .stickyWrap { gap: 2.5rem; }
    .stickyWrap .bx { width: 100%; }
    .stickyWrap .sticky { position: relative; top: auto; }
}

/* link btn */
.linkBtnWrap { position: relative; display: flex; flex-flow: row wrap; justify-content: flex-start; gap: 0.5rem; }
.linkBtnWrap .btn { position: relative; margin: 0.5rem; padding: 0.5rem 1rem; /* width: 200px; */ /* height: 60px; */ font-size: 0.9rem; color: #222; font-weight: 700; font-family: 'PreGOV-Bo'; font-weight: 700; background: #fff; border: 4px solid #222; text-transform: uppercase; cursor: pointer; white-space: nowrap; transition: all .3s cubic-bezier(0.87, 0, 0.13, 1); }
.linkBtnWrap .btn::before { position: absolute; content: ''; top: -4px; left: 10%; width: 14px; height: 4px; transform: skewX(50deg); transition: .4s linear; background: #fff; }
.linkBtnWrap .btn::after { position: absolute; content: ''; bottom: -4px; right: 10%; width: 14px; height: 4px; transform: skewX(50deg); transition: .4s linear; background: #fff; }
.linkBtnWrap .btn:hover { color: var(--secondClr1); border: 4px solid var(--secondClr1); }
.linkBtnWrap .btn:hover::before { left: 80%; }
.linkBtnWrap .btn:hover::after { right: 80%; }

/* etc */
sup, sub { color: var(--secondClr1); };