@charset "utf-8";
@import url("./font/font.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&&family=Rubik:wght@300;400;500;600;700;800;900&display=swap');

/********** RESET **********/

html, body, main, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, hr, textarea, select, input[type=text], input[type=radio], input[type=checkbox], input[type=button], input[type=image], input[type=password], input[type=reset], input[type=submit], input[type=email], input[type=color], input[type=date], input[type=datetime],input[type=datetime-local], input[type=month], input[type=number], input[type=range], input[type=search], input[type=tel], input[type=time], input[type=url], inpuyt[type=week] { margin: 0; padding: 0; border: 0; font: inherit; }
main, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, video { display: block; }
ol, ul, li { list-style: none; }
blockquote, q { quotes: none; }
blockquote::before, blockquote::after, q::before, q::after { content: ""; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
textarea { overflow: auto; }
caption, figcaption { display: none; }
em, address { font-style: normal; }
label { cursor: pointer; }
legend { position: absolute; top: 0; left: 0; width: 0; height: 0; overflow: hidden; visibility: hidden; font-size: 0; line-height: 0; } /* for screen reader */
*:focus { outline: 0 none; }
a:link { text-decoration: none; }
a, button, input { font: inherit; background: none; border: 0 none; cursor: pointer; }
a { color: inherit; }

/********** COMMON **********/

:root {
	--Black: #111;
	--Jet: #333;
	--Dark: #555;
	--Dim: #777;
	--Gray: #999;
	--Cloud: #BBB;
	--Light: #DDD;
	--Bright: #E1E1E1;
	--Ghost: #F5F5F5;
	--Strong: #502ACC;
	--Stronger: #4B0A9E;
	--Point: #F4A816;
	--Pointer: #DC284E;
	--Number: #F90874;
	--Alert: #E21000;
	--Link: #2380FF;
}

html { height: 100%; }
body { position: relative; height: 100%; font: 400 16px/1.0 "Pretendard", "Noto Sans SC", sans-serif; letter-spacing: 0; color: var(--Jet); background: #fff; box-sizing: border-box; -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; }
body.modal { overflow: hidden; }

.container { width: 1200px; padding: 0 40px; margin: 0 auto; }

.number { font-family: "Rubik", sans-serif; }

/********** FORM **********/

input[type=text],
input[type=password],
input[type=file],
input[type=number],
input[type=date],
select,
textarea { display: inline-block; padding: 0 10px; background: #fff; border: 1px solid var(--Light); border-radius: 6px; font-size: 16px; box-sizing: border-box; vertical-align: middle; transition: all 0.3s; }
textarea { padding: 10px; line-height: 1.3; overflow: overlay; resize: none; }
textarea::-webkit-scrollbar { width: 8px; }
textarea::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.2); border-radius: 4px; }
input[type=number] { text-align: right; }
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
select { padding-right: 25px; }
input[type=text]:focus,
input[type=password]:focus,
input[type=number]:focus,
select:focus,
textarea:focus { border-color: var(--Jet); color: var(--Jet); }
input::placeholder,
textarea::placeholder { color: var(--Cloud); font-weight: 400 !important; }
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { color: var(--Cloud); font-weight: 400 !important; }
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { color: var(--Cloud); font-weight: 400 !important; }

input[type=text]:read-only { background: var(--Ghost); border-color: var(--Light); color: var(--Dim) !important; }

label.checkbox,
label.radio { position: relative; display: inline-block; font-size: 0; line-height: 20px; vertical-align: middle; }
label.checkbox + label,
label.radio + label { margin-left: 20px; }
label.checkbox input[type=checkbox],
label.radio input[type=radio] { position: absolute; width: 0; height: 0; }
label.checkbox span,
label.radio span { position: relative; display: inline-block; padding-left: 26px; font-size: 16px; color: var(--Gray); vertical-align: middle; transition: all 0.3s; }
label.checkbox input[type=checkbox]:checked + span,
label.radio input[type=radio]:checked + span { color: var(--Jet); }

label.checkbox span::before { position: absolute; display: block; width: 20px; height: 20px; left: 0; top: 50%; margin-top: -10px; background: #fff; border: 1px solid var(--Light); border-radius: 4px; box-sizing: border-box; content: ""; }
label.checkbox input[type=checkbox]:checked + span::before { border-color: var(--Jet); }
label.checkbox input[type=checkbox]:checked + span::after { position: absolute; display: block; width: 12px; height: 12px; left: 4px; top: 50%; margin-top: -6px; background: var(--Jet); border-radius: 2px; content: ""; }

label.radio span::before { position: absolute; display: block; width: 20px; height: 20px; left: 0; top: 50%; margin-top: -10px; background: #fff; border: 1px solid var(--Light); border-radius: 50%; box-sizing: border-box; content: ""; }
label.radio input[type=radio]:checked + span::before { border-color: var(--Jet); }
label.radio input[type=radio]:checked + span::after { position: absolute; display: block; width: 12px; height: 12px; left: 4px; top: 50%; margin-top: -6px; background: var(--Jet); border-radius: 50%; content: ""; }

input[type=checkbox].sgl-check { position: relative; width: 0; height: 0; box-sizing: border-box; z-index: 0; }
input[type=checkbox].sgl-check::before { position: absolute; display: block; width: 20px; height: 20px; left: 0; top: 0; background: #fff; border: 1px solid var(--Light); border-radius: 4px; box-sizing: border-box; content: ""; z-index: 1; }
input[type=checkbox].sgl-check:checked::before { border-color: var(--Jet); }
input[type=checkbox].sgl-check:checked::after { position: absolute; display: block; width: 12px; height: 12px; left: 4px; top: 4px; background: var(--Jet); border-radius: 2px; content: ""; z-index: 2; }

a.button,
button { display: inline-block; padding: 0 10px; background: var(--Jet); border: 1px solid var(--Jet); border-radius: 6px; font-size: 16px; font-weight: 600; color: #fff; text-align: center; box-sizing: border-box; vertical-align: middle; transition: all 0.3s; }

/********** LAYOUT **********/

header { position: fixed; width: 100%; background: transparent; z-index: 9; transition: all 0.3s; }
header nav.util { border-bottom: 1px solid var(--Bright); }
header nav.util div { display: flex; justify-content: flex-end; align-items: center; width: 1200px; height: 29px; margin: 0 auto; padding: 0 5px; box-sizing: border-box; }
header nav.util a { padding: 2px 5px; font-size: 12px; font-weight: 600; color: var(--Cloud); transition: all 0.3s; }
header nav.util a:hover { color: var(--Jet); }
header div.container { display: flex; justify-content: space-between; align-items: center; height: 100px; }
header h1 { flex: 0 0 192px; height: 32px; background: url("../img/h1-logo.svg") center no-repeat; background-size: 100%; text-indent: -9999px; }
header fieldset.search { position: relative; display: flex; width: 440px; }
header fieldset.search div.nice-select { flex: 0 0 110px; border: 0 none !important; border-bottom: 3px solid var(--Jet) !important; border-radius: 0; font-weight: 500; line-height: 37px; }
header fieldset.search input[type=text] { flex: 0 0 330px; height: 40px; padding: 0 110px 0 10px; border: 0 none; border-bottom: 3px solid var(--Jet); border-radius: 0; }
header fieldset.search button[type=submit] { position: absolute; right: 70px; top: 0; width: 40px; height: 40px; background: transparent url("../img/button-search.svg") center no-repeat; background-size: 24px; border: 0 none; text-indent: -9999px; }
header fieldset.search button[type=button] { position: absolute; right: 0; top: 8px; width: 70px; height: 24px; font-size: 13px; }
header fieldset.search button[type=button]:hover { background: var(--Alert); border-color: var(--Alert); }
header nav.gnb { flex: 0 0 auto; display: flex; align-items: center; }
header nav.gnb a { flex: 0 0 auto; padding: 10px; font-size: 18px; font-weight: 700; transition: all 0.3s; }
header nav.gnb a.on { font-weight: 800; color: var(--Strong); }
header nav.gnb a:not(.on):hover { padding-bottom: 13px; transform: translateY(-3px); }
header nav.gnb a + a { margin-left: 30px; }
header div.member { flex: 0 0 auto; display: flex; align-items: center; }
header div.member a { flex: 0 0 auto; padding: 6px; font-size: 14px; font-weight: 600; color: var(--Cloud); transition: all 0.3s; }
header div.member a:not(.on):hover { padding-bottom: 9px; transform: translateY(-3px); }
header div.member a + a { margin-left: 10px; }

header.popup { display: flex; padding: 20px; background: #fff; }
header.popup dl + dl { margin-left: 16px; }
header.popup dl dt { font-size: 14px; font-weight: 500; color: var(--Gray); }
header.popup dl dd { margin-top: 8px; font-size: 18px; font-weight: 600; color: var(--Strong); }
 
header.scroll { background: #fff; box-shadow: rgba(0, 0, 0, 0.3) 0 4px 12px; }

header.home:not(.scroll) nav.util { background: rgba(0, 0, 0, 0.3); border-bottom-color: transparent; }
header.home:not(.scroll) nav.util a { color: rgba(255, 255, 255, 0.5); }
header.home:not(.scroll) nav.util a:hover { color: rgba(255, 255, 255, 0.9); }
header.home:not(.scroll) h1 { background-image: url("../img/h1-logo-home.svg"); }
header.home:not(.scroll) nav.gnb a { color: #fff; }

main { position: relative; }
main.popup { padding: 80px 20px 20px; }
main > div.container { min-height: calc(100vh - 477px); padding-top: 150px; padding-bottom: 120px; }
main ol.location { display: flex; align-items: center; }
main ol.location li { position: relative; font-size: 14px; }
main ol.location li:first-child { flex: 0 0 20px; height: 20px; }
main ol.location li:first-child a { display: block; width: 100%; height: 100%; background: url("../img/icon-home.svg") center no-repeat; background-size: auto; text-indent: -9999px; }
main ol.location li + li { margin-left: 20px; }
main ol.location li + li:before { position: absolute; left:-18px; width: 16px; height: 16px; background: url("../img/icon-loc-arrow.svg") center no-repeat; background-size: 14px; content: ""; }
main ol.location li a { font-weight: 500; color: var(--Gray); transition: all 0.3s; }
main ol.location li a:hover { color: var(--Jet); text-decoration: underline; text-underline-position: under; }
main ol.location li strong { font-weight: 700; color: var(--Strong); }
main ol.location + * { margin-top: 40px; }
main h1.head { font-size: 36px; font-weight: 700; }
main h1.head + * { margin-top: 20px; }
main div.content-wrap { display: flex; justify-content: space-between; align-items: flex-start; margin-top: 40px; }
main aside.aside { flex: 0 0 240px; }
main section.content { flex: 0 0 920px; }
main a.ad-bnr { display: block; width: 100%; margin-top: 10px; border-radius: 10px; font-size: 0; line-height: 0; overflow: hidden; }
main a.ad-bnr:first-child { margin-top: 0; }
main a.ad-bnr img { transition: all 0.3s; }
main a.ad-bnr:hover img { transform: scale(1.06); }

footer { padding: 40px; background: var(--Jet); text-align: center; font-size: 13px; color: var(--Gray); box-sizing: border-box; }
footer h1 { font-size: 15px; }
footer p { margin-top: 10px; }
footer p span { display: inline-block; margin-left: 10px; }
footer ul.menu { display: flex; justify-content: center; margin-top: 20px; }
footer ul.menu li { flex: 0 0 auto; }
footer ul.menu li + li { margin-left: 16px; }
footer ul.menu a { display: inline-block; font-weight: 500; color: #fff; transition: all 0.3s; }
footer ul.menu a:hover { color: var(--Point); }
footer p.cr { margin-top: 20px; letter-spacing: 0.1em; }

/********** LNB **********/

#tree { border: 1px solid var(--Light); border-radius: 10px; overflow: hidden; }
#tree > li + li { border-top: 1px solid var(--Bright); }
#tree ul > li { padding-left: 8px; }
#tree .toggle { cursor: pointer; }
#tree p { position: relative; padding: 6px 10px 6px 20px; box-sizing: border-box; }
#tree li:has(ul) > p { padding-left: 24px; }
#tree li:has(ul) > p:before { display: none; }
#tree p.head { display: flex; justify-content: space-between; align-items: center; height: 50px; padding-left: 14px; padding-right: 6px; background: var(--Ghost); }
#tree p.head span { font-weight: 600; }
#tree p.head a { flex: 0 0 100%; height: 24px; font-weight: 600; line-height: 24px; }
#tree p.head a.on { font-weight: 700; color: var(--Strong); }
#tree p.head i { width: 24px; height: 24px; background: url("../img/icon-tree-first.svg") center no-repeat; background-size: 20px; transition: all 0.3s; }
#tree p.head + ul { padding-top: 6px; padding-bottom: 6px; border-top: 1px solid var(--Bright); }
#tree i.toggle { position: absolute; top: 2px; left: 0; width: 20px; height: 20px; background: url("../img/icon-tree-last.svg") center no-repeat; background-size: 16px; transition: all 0.3s; }
#tree span.label { display: block; font-size: 15px; font-weight: 600; transition: all 0.3s; }
#tree a:hover span.label { text-decoration: underline; text-underline-position: under; }
#tree span.number { display: block; margin-top: 4px; font-size: 12px; font-weight: 500; color: var(--Number); }
#tree li.on > p.head i { transform: rotate(90deg); }
#tree li.on > p > i.toggle { transform: rotate(90deg); }
#tree a.on span.label { font-weight: 700; color: var(--Strong); }
#tree p:not(.head):before { position: absolute; top: 10px; left: 8px; width: 4px; height: 4px; background: var(--Gray); content: ""; }
#tree p:not(.head):has(a.on):before { top: 7px; height: 11px; background: var(--Strong); }

#tree ul.not-tree { display: flex; flex-wrap: wrap; justify-content: flex-start; padding: 4px !important; }
#tree ul.not-tree li { flex: 0 0 auto; margin: 2px; padding: 0; }
#tree ul.not-tree li a { display: inline-block; height: 30px; padding: 6px 8px; border: 1px solid var(--Bright); border-radius: 4px; font-size: 14px; font-weight: 500; box-sizing: border-box; transition: all 0.3s; }
#tree ul.not-tree li a.on { background: var(--Strong); border-color: var(--Strong); color: #fff; }
#tree ul.not-tree li a:not(.on):hover { background-color: var(--Ghost); border-color: var(--Jet); color: var(--Jet); }

#tree ul.my-keep {}
#tree ul.my-keep li { display: flex; justify-content: space-between; align-items: center; width: 100%; padding-right: 8px; box-sizing: border-box; }
#tree ul.my-keep li + li { margin-top: 6px; }
#tree ul.my-keep li.add { display: block; position: relative; }
#tree ul.my-keep li.add input[type=text] { width: 100%; height: 30px; font-size: 14px; }
#tree ul.my-keep li.add button { position: absolute; top: 0; right: 8px; height: 30px; border-radius: 0 6px 6px 0; font-size: 14px; }
#tree ul.my-keep li a { padding-left: 20px; background: url("../img/icon-folder.svg") left center no-repeat; background-size: 16px; font-size: 15px; font-weight: 500; transition: all 0.3s; }
#tree ul.my-keep li a.on { background-image: url("../img/icon-folder-on.svg"); font-weight: 600; color: var(--Strong); }
#tree ul.my-keep li a:not(.on):hover { color: var(--Strong); text-decoration: underline; text-underline-position: under; }
#tree ul.my-keep li div.func { font-size: 0; }
#tree ul.my-keep li div.func button { width: 28px; height: 28px; margin: auto; background-color: #fff; background-position: center; background-repeat: no-repeat; background-size: 18px; border: 1px solid var(--Bright); border-radius: 50%; text-indent: -9999px; }
#tree ul.my-keep li div.func button + button { margin-left: 6px; }
#tree ul.my-keep li div.func button.edit { background-image: url("../img/icon-folder-edit.svg"); }
#tree ul.my-keep li div.func button.delete { background-image: url("../img/icon-folder-delete.svg"); }
#tree ul.my-keep li div.func button:hover { background-color: var(--Gray); border-color: var(--Gray); }
#tree ul.my-keep li div.func button.edit:hover { background-image: url("../img/icon-folder-edit-w.svg"); }
#tree ul.my-keep li div.func button.delete:hover { background-image: url("../img/icon-folder-delete-w.svg"); }

#tree-check {}
#tree-check > li { border: 1px solid var(--Light); border-radius: 10px; overflow: hidden; }
#tree-check > li + li { margin-top: 10px; }
#tree-check ul > li { padding: 0 8px; }
#tree-check .toggle { cursor: pointer; }
#tree-check p { position: relative; padding: 6px 20px 6px 6px; box-sizing: border-box; }
#tree-check li:has(ul) > p:before { display: none; }
#tree-check p.head { display: flex; justify-content: space-between; align-items: center; height: 50px; padding-left: 14px; padding-right: 6px; background: var(--Ghost); }
#tree-check p.head span { font-weight: 600; }
#tree-check p.head i { width: 24px; height: 24px; background: url("../img/icon-tree-first.svg") center no-repeat; background-size: 20px; transition: all 0.3s; }
#tree-check p.head + ul { max-height: 218px; padding-top: 6px; padding-bottom: 6px; border-top: 1px solid var(--Bright); box-sizing: border-box; overflow-y: scroll; transition: all 0.6s; }
#tree-check p.head + ul.on { max-height: 100vh; transition: all 1.6s; }
#tree-check i.toggle { position: absolute; top: 4px; right: 0; width: 20px; height: 20px; background: url("../img/icon-tree-last.svg") center no-repeat; background-size: 16px; transition: all 0.3s; }
#tree-check span.label {}
#tree-check span.label::before { top: 0; margin-top: 0; }
#tree-check span.label::after { top: 0; margin-top: 4px; }
#tree-check span.label i { display: block; font-size: 13px; font-weight: 600; line-height: 1.0; color: var(--Dark); transition: all 0.3s; }
#tree-check span.label i.number { margin-top: 4px; font-size: 12px; font-weight: 400; }
#tree-check input[type=checkbox]:checked + span.label i.number { font-weight: 400; color: var(--Number); }
#tree-check button.list-toggle { display: block; width: 100%; height: 28px; background: var(--Ghost); border-color: var(--Light); border-width: 1px 0 0; border-radius: 0; font-size: 13px; font-weight: 500; color: var(--Gray); }
#tree-check li.on > p.head i { transform: rotate(90deg); }
#tree-check li.on > p > i.toggle { transform: rotate(90deg); }

div.filter-btn { position: sticky; bottom: 30px; margin-top: 20px; }
div.filter-btn button.execute { display: block; width: 100%; height: 60px; padding-right: 46px; background: var(--Strong); border-color: var(--Strong); border-radius: 10px; }
div.filter-btn button.execute:hover { background-color: var(--Stronger); border-color: var(--Stronger); }
div.filter-btn button.reset { position: absolute; top: 14px; right: 14px; width: 32px; height: 32px; background: transparent url("../img/button-reset.svg") no-repeat center / 18px; border: 2px solid #fff; border-radius: 16px; text-indent: -9999px; opacity: 0.6; }
div.filter-btn button.reset:hover { opacity: 1.0; }

/********** HOME **********/

section.home-top { height: 760px; padding-top: 100px; background: url("../img/home-bg.png") center no-repeat; background-size: cover; box-sizing: border-box; }
section.home-top div.container { display: flex; flex-direction: column; justify-content: center; height: 100%; }
section.home-top h1 strong { font-size: 60px; font-weight: 900; color: #fff; }
section.home-top h1 span { margin-left: 10px; font-size: 20px; font-weight: 500; color: #fff; }
section.home-top p.description { margin-top: 10px; font-size: 14px; font-weight: 500; line-height: 1.5; color: rgba(255, 255, 255, 0.4); }
section.home-top fieldset.home-search { width: 700px; margin-top: 40px; }
section.home-top fieldset.home-search div.radio { display: flex; }
section.home-top fieldset.home-search div.radio label { position: relative; }
section.home-top fieldset.home-search div.radio label + label { margin-left: 6px; }
section.home-top fieldset.home-search div.radio input { position: absolute; width: 0; height: 0; }
section.home-top fieldset.home-search div.radio label span { display: inline-block; height: 32px; padding: 0 12px; background: rgba(0, 0, 0, 0.6); border-radius: 6px; font-size: 15px; font-weight: 700; line-height: 32px; color: rgba(255, 255, 255, 0.4); transition: all 0.3s; }
section.home-top fieldset.home-search div.radio label input:checked + span { background: var(--Point); color: var(--Jet); }
section.home-top fieldset.home-search div.keyword { position: relative; margin-top: 16px; }
section.home-top fieldset.home-search div.keyword input[type=text] { width: 100%; height: 60px; padding: 0 60px 0 20px; border: 0 none; border-radius: 10px; font-size: 20px; color: var(--Jet); }
section.home-top fieldset.home-search div.keyword button[type=submit] { position: absolute; right: 92px; top: 0; width: 60px; height: 60px; background: transparent url("../img/button-search.svg") center no-repeat; background-size: 32px; border: 0 none; text-indent: -9999px; }
section.home-top fieldset.home-search div.keyword button[type=button] { position: absolute; right: 12px; top: 12px; width: 80px; height: 36px; font-size: 15px; }
section.home-top fieldset.home-search div.keyword button[type=button]:hover { background: var(--Alert); border-color: var(--Alert); }
section.home-top ul.summary { display: flex; align-items: center; margin-top: 60px; }
section.home-top ul.summary li { flex: 0 0 auto; background: #fff; border-radius: 10px; }
section.home-top ul.summary li + li { margin-left: 20px; }
section.home-top ul.summary dl { width: 160px; padding: 16px; box-sizing: border-box; }
section.home-top ul.summary dl dt { font-weight: 700; }
section.home-top ul.summary dl dd { margin-top: 16px; text-align: right; font-size: 24px; font-weight: 600; color: var(--Strong); }

section.home-btm { padding: 80px 0 120px; }
section.home-btm ul.doc-tab { display: flex; justify-content: center; }
section.home-btm ul.doc-tab li { position: relative; padding-bottom: 12px; font-size: 26px; font-weight: 300; color: var(--Gray); cursor: pointer; transition: all 0.3s; }
section.home-btm ul.doc-tab li:after { position: absolute; bottom: 0; left: 50%; width: 32px; height: 2px; margin-left: -16px; background: var(--Jet); content: ""; transform: scaleX(0); transition: all 0.3s; }
section.home-btm ul.doc-tab li:hover { color: var(--Jet); }
section.home-btm ul.doc-tab li.on { font-weight: 800 ;color: var(--Jet); }
section.home-btm ul.doc-tab li.on:after { transform: scaleX(1.0); }
section.home-btm ul.doc-tab li + li { margin-left: 20px; }
section.home-btm div.doc-wrap { position: relative; height: 205px; margin-top: 20px; overflow: hidden; }
section.home-btm div.doc-list { position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; transform: translateY(20px); transition: all 0.3s; }
section.home-btm div.doc-list.on { opacity: 1.0; visibility: visible; transform: translateY(0); }
section.home-btm div.doc-list div.owl-stage { padding: 20px 15px; }
section.home-btm div.doc-list div.doc { width: 120px; border-radius: 6px; overflow: hidden; transition: all 0.3s; }
section.home-btm div.doc-list div.doc + div.doc { margin-left: 20px; }
section.home-btm div.doc-list div.doc img { filter: grayscale(100%); transition: all 0.3s; }
section.home-btm div.doc-list div.doc:hover { box-shadow: rgba(0, 0, 0, 0.3) 0 4px 12px; }
section.home-btm div.doc-list div.doc:hover img { filter: grayscale(0); }

/********** LIST **********/

ul.thesis-list {}
ul.thesis-list > li { border: 1px solid var(--Bright); border-radius: 10px; overflow: hidden; transition: all 0.3s; }
ul.thesis-list > li:has(input.sgl-check:checked) { border-color: var(--Jet); }
ul.thesis-list > li + li { margin-top: 20px; }
ul.thesis-list > li .box { padding: 20px; }
ul.thesis-list > li .box + .box { border-top: 1px solid var(--Bright); }
ul.thesis-list hgroup { position: relative; padding-left: 40px !important; }
ul.thesis-list hgroup input.sgl-check { position: absolute; top: 9px; left: 9px; }
ul.thesis-list hgroup h1 { font-size: 22px; font-weight: 700; line-height: 1.3; }
ul.thesis-list hgroup h2 { margin-top: 6px; font-size: 16px; font-weight: 500; line-height: 1.3; color: var(--Cloud); }
ul.thesis-list div.info dl { display: flex; align-items: flex-start; }
ul.thesis-list div.info dl + dl { margin-top: 20px; }
ul.thesis-list div.info dl dt { flex: 0 0 60px; height: 26px; padding: 0 8px; background: var(--Dim); border-radius: 6px; font-size: 14px; font-weight: 700; line-height: 26px; color: #fff; box-sizing: border-box; }
ul.thesis-list div.info dl dd { flex: 0 1 auto; margin-left: 16px; }
ul.thesis-list div.info dl dd p { max-height: 42px; padding-top: 4px; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
ul.thesis-list div.info dl dd p + p { margin-top: 6px; }
ul.thesis-list div.info dl dd span.sub { font-size: 14px; color: var(--Gray); }
ul.thesis-list ul.author { display: flex; flex-wrap: wrap; margin: -2px; }
ul.thesis-list ul.author li { flex: 0 0 auto; height: 26px; margin: 2px; padding: 0 8px; border: 1px solid var(--Bright); border-radius: 6px; box-sizing: border-box; }
ul.thesis-list ul.author li span.main { font-size: 15px; font-weight: 600; line-height: 24px; }
ul.thesis-list ul.author li span.sub { font-size: 13px !important; line-height: 24px; }
ul.thesis-list ul.keyword { display: flex; flex-wrap: wrap; margin: -2px; }
ul.thesis-list ul.keyword li { flex: 0 0 auto; height: 26px; margin: 2px; padding: 0 8px; border: 1px solid var(--Bright); border-radius: 6px; font-size: 15px; font-weight: 600; line-height: 24px; box-sizing: border-box; }
ul.thesis-list div.func { display: flex; background: var(--Ghost); }
ul.thesis-list div.func a { position: relative; flex: 0 0 auto; height: 30px; padding: 0 10px 0 30px; background-color: #fff; border: 1px solid var(--Bright); border-radius: 6px; font-size: 14px; font-weight: 500; line-height: 30px; transition: all 0.3s; }
ul.thesis-list div.func a:after { position: absolute; top: 0; left: 0; width: 30px; height: 30px; background-position: center; background-repeat: no-repeat; background-size: 16px; content: ""; }
ul.thesis-list div.func a.origin:after { background-image: url("../img/icon-link-origin.svg"); }
ul.thesis-list div.func a.download:after { background-image: url("../img/icon-link-download.svg"); }
ul.thesis-list div.func a.website:after { background-image: url("../img/icon-link-website.svg"); }
ul.thesis-list div.func a.detail:after { background-image: url("../img/icon-link-detail.svg"); }
ul.thesis-list div.func a:hover { padding: 0 16px 0 36px; border-color: var(--Strong); color: var(--Strong); }
ul.thesis-list div.func a + a { margin-left: 8px; }

ul.book-list { display: flex; flex-wrap: wrap; justify-content: space-evenly; margin-top: 30px; }
ul.book-list > li { flex: 0 0 120px; margin: 20px; }
ul.book-list dl {}
ul.book-list dl dt { border-radius: 6px; overflow: hidden; font-size: 0; transition: all 0.3s;  }
ul.book-list dl dd { margin-top: 16px; font-size: 15px; line-height: 1.3; transition: all 0.3s; }
ul.book-list dl:hover dt { box-shadow: rgba(0, 0, 0, 0.3) 0 4px 12px; }
ul.book-list dl:hover dd { color: var(--Strong); text-decoration: underline; text-underline-position: under; }

ul.journal-list {}
ul.journal-list > li { border: 1px solid var(--Bright); border-radius: 10px; overflow: hidden; transition: all 0.3s; }
ul.journal-list > li + li { margin-top: 20px; }
ul.journal-list a { display: block; padding: 20px; }
ul.journal-list h1 { font-size: 22px; font-weight: 700; line-height: 1.3; transition: all 0.3s; }
ul.journal-list h2 { margin-top: 6px; font-size: 16px; font-weight: 500; line-height: 1.3; color: var(--Cloud); transition: all 0.3s; }
ul.journal-list p.desc { display: flex; margin-top: 12px; }
ul.journal-list p.desc span { flex: 0 0 auto; padding: 6px; background: var(--Gray); border-radius: 4px; font-size: 14px; font-weight: 500; color: #fff; transition: all 0.3s; }
ul.journal-list p.desc span + span { margin-left: 6px; }
ul.journal-list > li:hover { border-color: var(--Strong); }
ul.journal-list > li:hover h1 { color: var(--Strong); }
ul.journal-list > li:hover h2 { color: var(--Dim); }
ul.journal-list > li:hover p.desc span { background: var(--Dim); }

ul.author-list {}
ul.author-list > li { border: 1px solid var(--Bright); border-radius: 10px; overflow: hidden; transition: all 0.3s; }
ul.author-list > li + li { margin-top: 20px; }
ul.author-list a { display: block; padding: 20px; }
ul.author-list h1 span.ko { font-size: 22px; font-weight: 700; transition: all 0.3s; }
ul.author-list h1 span.en { font-size: 16px; font-weight: 500; color: var(--Gray); transition: all 0.3s; }
ul.author-list p.title { margin-top: 12px; }
ul.author-list p.title span { display: block; line-height: 1.3; }
ul.author-list p.title span.main { font-size: 18px; font-weight: 600; }
ul.author-list p.title span.sub { margin-top: 6px; font-size: 16px; font-weight: 500; color: var(--Gray); }
ul.author-list p.journal { display: inline-block; margin-top: 12px; padding: 6px; background: var(--Gray); border-radius: 4px; font-size: 14px; font-weight: 500; color: #fff; transition: all 0.3s; }
ul.author-list > li:hover { border-color: var(--Strong); }
ul.author-list > li:hover h1 span.ko { color: var(--Strong); }
ul.author-list > li:hover p.journal { background: var(--Dim); }

ul.table-type { position: relative; }
ul.table-type:before { position: absolute; display: block; left: 0; right: 0; top: 0; height: 50px; border-bottom: 3px solid var(--Jet); content: ""; }
ul.table-type > li {}
ul.table-type div.info { display: flex; }
ul.table-type dl { text-align: center; box-sizing: border-box; }
ul.table-type dt,
ul.table-type dd { height: 50px; padding: 0 10px; line-height: 50px; border-bottom: 1px solid var(--Bright); max-width: 100%; box-sizing: border-box; transition: all 0.3s; }
ul.table-type dt { display: none; }
ul.table-type > li:first-child dt { display: block; margin-bottom: 3px; border: 0 none; line-height: 50px; color: var(--Gray); }

ul.institution-list dl.name-ko { flex: 0 0 220px; }
ul.institution-list dl.name-en { flex: 1 0 auto; }
ul.institution-list dl.button { flex: 0 0 80px; }
ul.institution-list dl.region { flex: 0 0 140px; }
ul.institution-list dl.amoount { flex: 0 0 180px; }
ul.institution-list dl.name-ko dd,
ul.institution-list dl.name-en dd { text-align: left; }
ul.institution-list dl.button dd { display: flex; justify-content: center; align-items: center; }
ul.institution-list dl.amount dd { text-align: right; }
ul.institution-list button.toggle { display: block; width: 32px; height: 32px; margin: auto; background: #fff url("../img/icon-link-journal.svg") center no-repeat; background-size: 18px; border: 1px solid var(--Gray); border-radius: 50%; text-indent: -9999px; }
ul.institution-list button.toggle:hover { background-color: var(--Strong); background-image: url("../img/icon-link-journal-hover.svg"); border-color: var(--Strong); }
ul.institution-list div.journal { display: none; border-width: 0 1px 1px; border-style: solid; border-color: var(--Bright); }
ul.institution-list div.journal ul { padding: 20px; background: var(--Ghost); }
ul.institution-list div.journal li + li { margin-top: 8px; }
ul.institution-list div.journal li a { position: relative; display: inline-block; height: 32px; padding: 0 10px 0 30px; background-color: #fff; border: 1px solid var(--Bright); border-radius: 6px; font-size: 15px; font-weight: 500; line-height: 30px; transition: all 0.3s; }
ul.institution-list div.journal li a:after { position: absolute; top: 0; left: 0; width: 30px; height: 30px; background: url("../img/icon-link-journal.svg") center no-repeat; background-size: 18px; content: ""; }
ul.institution-list div.journal li a:hover { padding: 0 16px 0 36px; border-color: var(--Strong); color: var(--Strong); }

ul.bbs-list dl.number {flex: 0 0 80px; }
ul.bbs-list dl.category {flex: 0 0 80px; }
ul.bbs-list dl.title { flex: 1 0 auto; }
ul.bbs-list dl.title dd { text-align: left; }
ul.bbs-list dl.writer { flex: 0 0 140px; }
ul.bbs-list dl.date { flex:0 0 140px; }
ul.bbs-list dl.view { flex: 0 0 80px; }
ul.bbs-list a:hover { color: var(--Strong); text-decoration: underline; text-underline-position: under; }

div.table-wrapper { border: 1px solid var(--Bright); border-radius: 10px; overflow: hidden; }
div.table-wrapper table { width: 100%; }
div.table-wrapper table.f14 { font-size: 14px; }
div.table-wrapper table thead th { padding: 10px 6px; background: var(--Ghost); border-bottom: 1px solid var(--Bright); font-weight: 600; }
div.table-wrapper table tbody tr td { padding: 10px 6px; transition: all 0.3s; }
div.table-wrapper table tbody tr td.number { text-align: center; }
div.table-wrapper table tbody tr td:hover { background: var(--Ghost); }
div.table-wrapper table tbody tr:not(:last-child) td { border-bottom: 1px solid var(--Bright); }
div.table-wrapper table thead th + th,
div.table-wrapper table tbody td + td { border-left: 1px solid var(--Bright); }
div.table-wrapper table a.link { color: var(--Link); text-decoration: underline; }
div.table-wrapper table button.new-open { padding: 0; background: none; border: 0 none; font-weight: 400; color: var(--Link); }
div.table-wrapper table button.new-open:hover { color: var(--Strong); }

/********** PAGING **********/

div.pagination { display: flex; justify-content: center; align-items: center; margin-top: 40px; }
div.pagination a { min-width: 36px; height: 36px; padding: 0 8px; text-align: center; border: 1px solid var(--Bright); border-radius: 4px; font-size: 15px; line-height: 34px; color: var(--Gray); box-sizing: border-box; transition: all 0.3s; }
div.pagination a.move { background-position: center; background-repeat: no-repeat; background-size: 24px; text-indent: -9999px; }
div.pagination a.first { background-image: url("../img/pagination-first.svg"); }
div.pagination a.prev { background-image: url("../img/pagination-prev.svg"); }
div.pagination a.next { background-image: url("../img/pagination-next.svg"); }
div.pagination a.last { background-image: url("../img/pagination-last.svg"); }
div.pagination a.active { background: var(--Number); border-color: var(--Number); color: #fff; font-weight: 600; }
div.pagination a:not(.active):hover { background-color: var(--Ghost); border-color: var(--Jet); color: var(--Jet); }
div.pagination a.first:hover { background-image: url("../img/pagination-first-hover.svg"); }
div.pagination a.prev:hover { background-image: url("../img/pagination-prev-hover.svg"); }
div.pagination a.next:hover { background-image: url("../img/pagination-next-hover.svg"); }
div.pagination a.last:hover { background-image: url("../img/pagination-last-hover.svg"); }
div.pagination a + a,
div.pagination a + span,
div.pagination span + a { margin-left: 6px; }

/********** DETAIL **********/

article.thesis-detail hgroup {}
article.thesis-detail hgroup h1 { font-size: 30px; font-weight: 700; line-height: 1.3; }
article.thesis-detail hgroup h2 { margin-top: 10px; font-size: 18px; font-weight: 500; line-height: 1.3; color: var(--Cloud); }
article.thesis-detail div.info { margin-top: 20px; }
article.thesis-detail div.info dl { display: flex; align-items: flex-start; }
article.thesis-detail div.info dl + dl { margin-top: 20px; }
article.thesis-detail div.info dl dt { flex: 0 0 60px; height: 24px; padding: 0 8px; background: var(--Dim); border-radius: 6px; font-size: 14px; font-weight: 700; line-height: 24px; color: #fff; box-sizing: border-box; }
article.thesis-detail div.info dl dd { flex: 0 1 auto; margin-left: 16px; }
article.thesis-detail div.info dl dd p { padding-top: 3px; line-height: 1.3; }
article.thesis-detail div.info dl dd p + p { margin-top: 6px; }
article.thesis-detail div.info dl dd span.sub { font-size: 14px; color: var(--Gray); }
article.thesis-detail div.info dl dd a { color: var(--Strong); text-decoration: underline; text-underline-position: under; }
article.thesis-detail div.func { display: flex; margin-top: 20px; }
article.thesis-detail div.func a { position: relative; flex: 0 0 auto; height: 30px; padding: 0 10px 0 30px; background-color: #fff; border: 1px solid var(--Bright); border-radius: 6px; font-size: 14px; font-weight: 500; line-height: 30px; transition: all 0.3s; }
article.thesis-detail div.func a:after { position: absolute; top: 0; left: 0; width: 30px; height: 30px; background-position: center; background-repeat: no-repeat; background-size: 16px; content: ""; }
article.thesis-detail div.func a.origin:after { background-image: url("../img/icon-link-origin.svg"); }
article.thesis-detail div.func a.download:after { background-image: url("../img/icon-link-download.svg"); }
article.thesis-detail div.func a.website:after { background-image: url("../img/icon-link-website.svg"); }
article.thesis-detail div.func a.detail:after { background-image: url("../img/icon-link-detail.svg"); }
article.thesis-detail div.func a.bookmark:after { background-image: url("../img/icon-link-bookmark.svg"); }
article.thesis-detail div.func a:hover { padding: 0 16px 0 36px; border-color: var(--Strong); color: var(--Strong); }
article.thesis-detail div.func a + a { margin-left: 8px; }

figure.journal-cover { width: 120px; height: 165px; border-radius: 6px; overflow: hidden; }
figure.journal-cover img { width: 100%; height: 100%; object-fit: cover; }
ul.journal-info { margin-top: 16px; }
ul.journal-info li + li { margin-top: 8px; }
ul.journal-info dl { display: flex; }
ul.journal-info dl dt { flex: 0 0 60px; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--Gray); }
ul.journal-info dl dd { flex: 0 0 auto; font-size: 14px; font-weight: 600; line-height: 1.3; }
ul.journal-info + * { margin-top: 20px; }

hgroup.journal-head {}
hgroup.journal-head h1 { font-size: 30px; font-weight: 700; line-height: 1.3; }
hgroup.journal-head h2 { margin-top: 10px; font-size: 18px; font-weight: 500; line-height: 1.3; color: var(--Cloud); }
hgroup.journal-head + * { margin-top: 20px; }

h1.author-head {}
h1.author-head span.ko { font-size: 30px; font-weight: 700; }
h1.author-head span.en { font-size: 18px; font-weight: 500; color: var(--Cloud); }
h1.author-head + * { margin-top: 20px; }

div.others > h1 { padding-left: 30px; background: url("../img/icon-thesis.svg") center left no-repeat; background-size: 24px; font-size: 20px; font-weight: 700; }
div.others ul { margin-top: 20px; }
div.others ul li { border: 1px solid var(--Bright); border-radius: 10px; overflow: hidden; transition: all 0.3s; }
div.others ul li + li { margin-top: 6px; }
div.others ul li a { display: block; padding: 16px; box-sizing: border-box; }
div.others ul p {}
div.others ul p span { transition: all 0.3s; }
div.others ul p.title span { display: block; }
div.others ul p.title span.h1{ font-size: 15px; font-weight: 600; line-height: 1.3; }
div.others ul p.title span.h2 { font-size: 14px; font-weight: 400; line-height: 1.2; color: var(--Gray); }
div.others ul p.publish { margin-top: 12px; font-size: 13px; font-weight: 600; }
div.others ul p.publish span.journal { transition: all 0.3s; }
div.others ul p.publish span.year { color: var(--Gray); }
div.others ul li:hover { background: var(--Strong); border-color: var(--Strong); }
div.others ul li:hover p.title span.h1,
div.others ul li:hover p.publish span.journal { color: #fff; }
div.others ul li:hover p.title span.h2,
div.others ul li:hover p.publish span.year { color: #fff; opacity: 0.5; }

/********** MEMBER **********/

main.member { display: flex; flex-direction: column; align-items: center; min-height: 100%; padding: 60px 0; box-sizing: border-box; }
main.member hgroup {}
main.member hgroup h1 { width: 180px; height: 30px; background: url("../img/h1-logo.svg") center no-repeat; background-size: 100%; text-indent: -9999px; }
main.member hgroup h2 { margin-top: 4px; text-align: center; font-size: 14px; font-weight: 600; color: var(--Gray); }
main.member section { width: 400px; margin-top: 40px; }
main.member section h1 { text-align: center; font-size: 30px; font-weight: 700; }
main.member section p.announce { margin-top: 30px; padding-top: 54px; background-position: center top; background-repeat: no-repeat; background-size: 44px; text-align: center; line-height: 1.3; }
main.member section p.announce.join-01 { background-image: url("../img/icon-join-01.svg"); }
main.member section p.announce.join-02 { background-image: url("../img/icon-join-02.svg"); }
main.member section p.announce.password-01 { background-image: url("../img/icon-password-01.svg"); }
main.member section p.announce.password-02 { background-image: url("../img/icon-password-02.svg"); }
main.member section div.add { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; }
main.member section div.add ul { display: flex; }
main.member section div.add ul li + li { margin-left: 12px; }
main.member section div.add label span,
main.member section div.add ul a { font-size: 14px; }
main.member section button.strong { display: block; width: 100%; height: 60px; margin-top: 30px; background: var(--Strong); border: 1px solid var(--Strong); font-size: 18px; }
main.member section button.strong.email { background: var(--Strong) url("../img/icon-email.svg") no-repeat left 14px center / 24px; }
main.member section button.strong:hover { background-color: var(--Stronger); background-position: left 22px center; border-color: var(--Stronger); }
main.member section p.hr { position: relative; display: flex; justify-content: center; margin: 30px 0; }
main.member section p.hr::before { position: absolute; width: 100%; height: 1px; top: 50%; background: var(--Light); content: ""; z-index: 0; }
main.member section p.hr span { padding: 0 10px; background: #fff; font-size: 13px; color: var(--Gray); z-index: 1; }
main.member section ul.sns {}
main.member section ul.sns li + li { margin-top: 12px; }
main.member section ul.sns button { display: block; width: 100%; height: 50px; background-color: #fff; background-position: left 12px center; background-size: 30px; background-repeat: no-repeat; border: 1px solid var(--Light); color: var(--Gray); font-weight: 500; }
main.member section ul.sns button.naver { background-image: url("../img/icon-naver.svg"); }
main.member section ul.sns button.kakao { background-image: url("../img/icon-kakao.svg"); }
main.member section ul.sns button.google { background-image: url("../img/icon-google.svg"); }
main.member section ul.sns button:hover { background-position: left 20px center; border-color: var(--Jet); color: var(--Jet); }
main.member section dl.agree { margin-top: 30px; }
main.member section dl.agree dt { font-weight: 500; }
main.member section dl.agree dd { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; }
main.member section dl.agree dd p { font-size: 13px; font-weight: 500; color: var(--Strong); text-decoration: underline; cursor: pointer ;}
main.member section dl.agree dd label span { font-size: 14px; font-weight: 500; }
main.member section ul.note { margin-top: 30px; padding: 16px; background: var(--Ghost); border-radius: 6px; }
main.member section ul.note li { position: relative; padding-left: 10px; font-size: 13px; font-weight: 500; line-height: 1.3; color: var(--Gray); }
main.member section ul.note li::before { position: absolute; left: 0; top:  5px; width: 4px; height: 4px; border-radius: 2px; background: var(--Gray); content: ""; }
main.member p.cr { margin-top: 60px; color: var(--Gray); font-size: 13px; letter-spacing: 0.1em; }

ul.my-form { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 20px; }
ul.my-form > li { flex: 0 0 calc(50% - 10px); margin: 10px 0; }
ul.my-form > li label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; color: var(--Gray); }
ul.my-form li label span.required { font-size: 12px; font-weight: 600; color: var(--Pointer); }
ul.my-form > li input { width: 100%; height: 50px; }
ul.my-form > li .nice-select { width: 100%; height: 50px; line-height: 48px; }
ul.my-form > li .nice-select .list { width: 100%; }
ul.my-form > li div.with-btn { position: relative; }
ul.my-form > li div.with-btn input[type=text] { padding-right: 90px; }
ul.my-form > li div.with-btn button { position: absolute; right: 12px; top: calc(50% - 13px); height: 26px; border-radius: 4px; font-size: 13px; }
ul.my-form > li div.with-btn button:hover { background: var(--Strong); border-color: var(--Strong); }
ul.my-form > li div.check-group { display: flex; align-items: center; min-height: 40px; }
ul.my-form > li div.check-group label + label { margin-left: 10px; }
ul.my-form > li p.guide { margin-top: 8px; font-size: 12px; font-weight: 500; line-height: 1.3; color: var(--Cloud); }
ul.my-form > li p.alert { margin-top: 8px; font-size: 12px; font-weight: 500; line-height: 1.3; color: var(--Alert); }

ul.my-form.full { margin-top: 30px; }
ul.my-form.full > li { flex-basis: 100%; margin: 0; }
ul.my-form.full > li + li { margin-top: 16px; }

/********** POPUP **********/

div.pop-wrap { position: fixed; display: flex; justify-content: center; align-items: center; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); visibility: hidden; transition: all 0.3s; z-index: 10; }
div.pop-wrap.on { background: rgba(0, 0, 0, 0.3); visibility: visible; }
div.pop-window { position:relative; width: 480px; background: #fff; border-radius: 10px; box-sizing: border-box; transform: translate(0, 100px); opacity: 0; visibility: hidden; transition: all 0.3s; z-index: 12; }
div.pop-wrap.on div.pop-window { transform: translate(0, 0); opacity: 1.0; visibility: visible; }
div.pop-window > h1 { display: flex; align-items: center; padding: 20px; border-bottom: 1px solid var(--Bright); }
div.pop-window > h1 span { font-size: 20px; font-weight: 700; }
div.pop-window div.pop-cnt { max-height: calc(100vh - 160px); margin-top: 20px; padding: 0 20px 20px; overflow-y: auto; }
div.pop-window div.pop-cnt p.guide { text-align: center; font-size: 15px; line-height: 1.3; color: var(--Gray); }
div.pop-wrap button.close { position: absolute; top: 16px; right: 16px; width: 28px; height: 28px; background: transparent url("../img/button-close.svg") center no-repeat; background-size: auto 12px; border: 0 none; border-radius: 50%; text-indent: -9999px; }
div.pop-wrap button.close:hover { background-color: var(--Jet); background-image: url("../img/button-close-hover.svg"); }

div.doc h1 { font-size: 18px; font-weight: 700; }
div.doc * + h1 { margin-top: 20px; }
div.doc h2 { font-size: 15px; font-weight: 600; }
div.doc * + h2 { margin-top: 16px; }
div.doc p { font-size: 13px; line-height: 1.3; }
div.doc p.head { font-weight: 600; }
div.doc > * + p { margin-top: 10px; }
div.doc > ol { margin-top: 10px; }
div.doc > ol > li + li { margin-top: 6px; }
div.doc > ol > li > ol { padding-left: 10px; }
div.doc > ol > li > * + p,
div.doc > ol > li > * + ol { margin-top: 6px; }
div.doc > ol > li > ol > li + li { margin-top: 4px; }
div.doc > ol > li > ol > li p.sub { font-size: 12px; line-height: 1.3; color: var(--Gray); }
div.doc > ol > li > ol > li * + p { margin-top: 4px; }
div.doc div.supple { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--Bright); }
div.doc div.supple > * + p { margin-top: 12px; }

/********** ETC **********/

ul.tab { position: relative; display: flex; overflow: hidden; }
ul.tab:after { position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background: var(--Dark); content: ""; z-index: 1; }
ul.tab li { position: relative; height: 50px; padding: 0 24px; text-align: center; background: var(--Ghost); border: 1px solid var(--Cloud); border-radius: 10px 10px 0 0 ; font-weight: 600; line-height: 43px; color: var(--Gray); transform: translateY(10px); transition: all 0.3s; z-index: 0; }
ul.tab li:not(.on) { cursor: pointer; }
ul.tab li:not(.on):hover { background: #fff; line-height: 48px; transform: translateY(0); }
ul.tab li.on { background: #fff; border-color: var(--Dark) var(--Dark) #fff; font-weight: 700; line-height: 48px; color: var(--Jet); transform: translateY(0); z-index: 2; }
ul.tab li + li { margin-left: -1px; }
ul.tab + * { margin-top: 30px; }

div.above + * { margin-top: 20px; }

div.result-summary { display: flex; justify-content: space-between; align-items: center; }
div.result-summary.new { justify-content: flex-start; }
div.result-summary.new label.checkbox { margin-left: 10px; }
div.result-summary p.sum { font-size: 22px; }
div.result-summary p.sum strong { font-weight: 600; color: var(--Number); }
div.result-summary div.func { display: flex; align-items: center; }
div.result-summary div.func label { padding: 9px; background: #fff; border: 1px solid var(--Bright); border-radius: 6px; box-sizing: border-box; transition: all 0.3s; }
div.result-summary div.func label:hover { background: var(--Ghost); }
div.result-summary div.func label:has(input[type=checkbox]:checked) { border-color: var(--Jet); }
div.result-summary div.func button.keep { position: relative; height: 40px; padding-left: 40px; }
div.result-summary div.func button.keep:after { position: absolute; top: 0; left: 0; width: 40px; height: 40px; background: url("../img/icon-keep.svg") center no-repeat; background-size: 20px; content: ""; }
div.result-summary div.func button.keep.export:after { background: url("../img/icon-keep-export.svg") center no-repeat; background-size: 20px; }
div.result-summary div.func button.keep.delete:after { background: url("../img/icon-keep-delete.svg") center no-repeat; background-size: 20px; }
div.result-summary div.func button.keep:hover { padding: 0 16px 0 46px; }
div.result-summary div.func label + button.keep,
div.result-summary div.func button + button.keep { margin-left: 6px; }
div.result-summary fieldset.sort { display: flex; }
div.result-summary fieldset.sort input[type=text] { width: 240px; }
div.result-summary fieldset.sort div.nice-select { margin-left: 6px; }
div.result-summary fieldset.sort div.nice-select + input[type=text] { margin-left: 6px; }
div.result-summary fieldset.sort button { width: 40px; height: 40px; margin-left: 6px; background: var(--Jet) url("../img/button-search-w.svg") center no-repeat; background-size: 24px; border: 0 none; text-indent: -9999px; }
div.result-summary fieldset.sort button:hover { background-color: var(--Strong); }

div.search-condition { display: flex; }
div.search-condition dl { flex: 0 0 auto; display: flex; align-items: center; padding: 2px; background: var(--Strong); border-radius: 6px; font-size: 14px; font-weight: 500; }
div.search-condition dl + dl { margin-left: 4px; }
div.search-condition dl dt { padding: 6px 8px; color: #fff; }
div.search-condition dl dd { padding: 6px 8px; background: #fff; border-radius: 4px; font-weight: 600; color: var(--Strong); }
section.content div.search-condition dl dt,
section.content div.search-condition dl dd { padding: 9px; }

div.filter-letter { display: flex; flex-wrap: wrap; justify-content: space-between; margin: -4px; }
div.filter-letter button { flex: 0 0 50px; height: 30px; margin: 4px; padding: 6px; background: #fff; border-color: var(--Cloud); font-size: 15px; font-weight: 400; color: var(--Gray); }
div.filter-letter button.on { background: var(--Strong); border-color: var(--Strong); color: #fff; font-weight: 600; }
div.filter-letter button:not(.on):hover { background-color: var(--Ghost); border-color: var(--Jet); color: var(--Jet); }

h1.normal-head { font-size: 30px; font-weight: 700; }
h2.normal-head { font-size: 24px; font-weight: 700; }
h3.normal-head { font-size: 20px; font-weight: 700; text-decoration: underline; text-underline-position: under; }
h1.centro,
h2.centro,
h3.centro { text-align: center; }
h1.normal-head + *,
h2.normal-head + *,
h3.normal-head + * { margin-top: 20px; }
* + h1.normal-head,
* + h3.normal-head { margin-top: 20px; }
* + h2.normal-head { margin-top: 30px; }

ul.bbs-info { display: flex; align-items: center; }
ul.bbs-info li { font-size: 14px; font-weight: 500; color: var(--Gray); }
ul.bbs-info li + li { margin-left: 16px; }
article.bbs-view { margin-top: 20px; padding: 20px; border: 1px solid var(--Bright); border-radius: 10px; box-sizing: border-box; }
article.bbs-view p { font-size: 16px; line-height: 1.3; }
article.bbs-view p + p { margin-top: 20px; }

ul.bbs-form {}
ul.bbs-form li + li { margin-top: 20px; }
ul.bbs-form input[type=text] { width: 100%; height: 40px; }

div.button-wrap { display: flex; margin-top: 20px; }
div.button-wrap.destro { justify-content: flex-end; }
div.button-wrap.centro { justify-content: center; }
div.button-wrap button { height: 40px; }
div.button-wrap a.button { height: 40px; line-height: 38px; }
div.button-wrap button:hover,
div.button-wrap a.button:hover { padding: 0 16px; }

h1.keep-head { display: flex; align-items: center; }
h1.keep-head span.name { font-size: 30px; font-weight: 700; }
h1.keep-head span.sum { margin-left: 10px; font-size: 18px; font-weight: 600; color: var(--Pointer); }
h1.keep-head + * { margin-top: 20px; }

/********** ADVANCED SEARCH **********/

#adv-search {}
#adv-search div.pop-window { width: 640px; }
fieldset.advanced-search {}
fieldset.advanced-search div.condition div.unit { display: flex; }
fieldset.advanced-search div.condition div.unit div.nice-select { width: 100px; }
fieldset.advanced-search div.condition div.unit input[type=text] { flex: 1 0 auto; }
fieldset.advanced-search div.condition div.unit button.add-condition { width: 114px; background: var(--Link); border-color: var(--Link); }
fieldset.advanced-search div.condition div.unit button.add-condition:hover { background: var(--Black); border-color: var(--Black);}
fieldset.advanced-search div.condition div.unit button.remove-condition { width: 114px; background: var(--Gray); border-color: var(--Gray); }
fieldset.advanced-search div.condition div.unit button.remove-condition:hover { background: var(--Dark); border-color: var(--Dark); }
fieldset.advanced-search div.condition div.unit > *:not(:first-child) + * { margin-left: 6px; }
fieldset.advanced-search div.condition div.unit + div.unit { margin-top: 10px; }
fieldset.advanced-search div.selection { display: flex; margin-top: 20px; }
fieldset.advanced-search div.selection div.unit { display: flex; align-items: center; }
fieldset.advanced-search div.selection div.unit label { padding-right: 4px; color: var(--Gray); font-weight: 500; }
fieldset.advanced-search div.selection div.unit > * + * { margin-left: 6px; }
fieldset.advanced-search div.selection div.unit + div.unit { margin-left: 20px; }
fieldset.advanced-search p.label { margin-top: 20px; color: var(--Gray); font-weight: 500; }
fieldset.advanced-search div.formula { margin-top: 10px; padding: 16px; background: var(--Ghost); border: 1px solid var(--Light); border-radius: 10px; font-weight: 600; line-height: 1.3; }
fieldset.advanced-search div.button-wrap {}
fieldset.advanced-search div.button-wrap button:first-child { width: 120px; background: var(--Strong); border-color: var(--Strong); }
fieldset.advanced-search div.button-wrap button:first-child:hover { width: 140px; background: var(--Stronger); border-color: var(--Stronger); }
fieldset.advanced-search div.button-wrap button:last-child { margin-left: 10px; width: 120px; background: #fff; border-color: var(--Gray); color: var(--Gray); }
fieldset.advanced-search div.button-wrap button:last-child:hover { width: 140px; border-color: var(--Black); color: var(--Black); }

/********** GUIDE **********/

div.guide-wrap { margin-top: 40px; }
div.guide-wrap p { line-height: 1.5; }
div.guide-wrap p.attention { padding: 40px 40px 260px; background: var(--Strong) url("../img/img-intro.png") center bottom no-repeat; border-radius: 10px; text-align: center; color: #fff; box-sizing: border-box; }
div.guide-wrap p.note { margin-top: 10px; padding: 9px; background: var(--Ghost); border: 1px solid var(--Bright); font-size: 14px; font-weight: 500; color: var(--Alert); }
div.guide-wrap p.figure { display: inline-block; max-width: 920px; padding: 9px; border: 1px solid var(--Bright); border-radius: 24px; box-sizing: border-box; line-height: 0; }
div.guide-wrap p.figure img { max-width: 100%; }
div.guide-wrap p + p { margin-top: 20px; }
div.guide-wrap ul.numeric { display: flex; justify-content: center; margin-top: 30px; }
div.guide-wrap ul.numeric li { flex: 0 0 160px; }
div.guide-wrap ul.numeric li + li { margin-left: 60px; }
div.guide-wrap ul.numeric li dl {}
div.guide-wrap ul.numeric li dt { height: 120px; background-position: center; background-repeat: no-repeat; text-indent: -9999px; }
div.guide-wrap ul.numeric li:first-child dt { background-image: url("../img/img-thesis.png"); }
div.guide-wrap ul.numeric li:nth-child(2) dt { background-image: url("../img/img-journal.png"); }
div.guide-wrap ul.numeric li:last-child dt { background-image: url("../img/img-author.png"); }
div.guide-wrap ul.numeric li dd { margin-top: 20px; text-align: center; font-size: 20px; }