@charset "utf-8";

/* CSS Document */

/*****************************************************
	Common
*****************************************************/
html, body { background: #fff; font-size: 16px; font-weight: 400; }
body { padding-top: 112px; }
a { color: #555; text-decoration: none; text-underline-offset: 0.2rem; }
a:hover, a:focus { color: #0d6efd; }
a, button { transition: .5s }
label, .form-check { margin-bottom: 3px; }
img { max-width: 100%; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0 }

/* accessibility */
#accessibility { position: fixed; top: 0; left: 0; width: 100%; z-index: 99999; }
#accessibility ul { margin: 0; padding: 0; list-style-type: none; }
#accessibility li { margin: 0; padding: 0; list-style-type: none; }
#accessibility a { display: block; position: absolute; top: -9999px; left: 0; width: 100%; height: 26px; line-height: 18px; text-align: center; background: #333; color: #fff; text-decoration: none; font-size: 12px; }
#accessibility a:active, #accessibility a:focus { top: 0; padding: 4px 0; font-weight: 600; }
  
/*****************************************************
	Layout
*****************************************************/
.content-wrapper { display: inherit; }
.container-inner { height: auto; overflow: inherit; }
#container-top {margin-top: 40px;padding: 0;border: none;box-shadow: none;}
.content {min-height: 700px;padding: 0;padding-bottom: 80px;border: none;box-shadow: none;}

/* top menu */
#header {border-bottom:none}
#mask {top: 41px;}
.top-sub-layout { background: transparent }
.top-menu { background-color: #fff; }
.top-menu-layout {padding: 0;display: flex;justify-content: space-between;align-items: center;height: 70px;}
.top-menu-layout h1 { margin: 0; display: flex; align-items: center; flex: 0 1 auto; font-size: 1rem; }
.top-menu-layout h1 a { display: flex; align-items: center; }
.top-menu-layout h1 img { width: 100px; }
.top-menu-layout h1 span { font-size: 16px; color: #2e3039; user-select: none; white-space: nowrap; margin-left: 10px; }
.top-menu-layout h1 span::before { display: inline-block; content: ''; width: 1px; height: 14px; background-color: #AFAFAF; margin: 0 7px; display: none; }
.top-menu-layout .menu-ham {width: 35px;height: 35px;background: url(/images/menu.png) no-repeat center;border-radius: 5px;cursor: pointer;border: 0;}
.top-menu-layout .menu-ham:hover, .top-menu-layout .menu-ham:focus {background: #222 url('/images/menu-w.png') no-repeat center;}
.top-sub {border-bottom: 1px solid #EFF5FF;background-color: #F5F6FA;}
.top-list li a {position: relative;color: #555;min-width: inherit;padding: 0 10px;}
.top-list li:not(:first-child) a::before {content:'';display: inline-block;width: 1px;height: 15px;position: absolute;top: 50%;left: 0;transform: translateY(-50%);background: #bcbcbc;}
.top-list li:nth-child(2) a::before {display:none}
.top-list li.point a {background-color: #103C93;color: #fff;}
.top-list li a::after { background-color: #EFF5FF; }
.top-list li:hover a, .top-list li:focus a { text-decoration: underline; }
.top-menu .login { display: block; width: auto; height: 40px; line-height: 1.8; padding: 5px 10px 5px 36px; border-width: initial; border-style: none; border-color: initial; border-image: initial; border-radius: 50px; background: url(/images/icon-login.png) left 10px center no-repeat; transition: 0.3s; }
.top-menu .login:hover, .top-menu .login:focus { background: #F2F6F9 url('/images/icon-login.png') left 10px center no-repeat; }
.top-menu-list .user-dropdown .dropdown-user .dropdown-toggle {margin:0}
.top-menu-list .user-dropdown .dropdown-user .dropdown-toggle:hover, .top-menu-list .user-dropdown .dropdown-user .dropdown-toggle:focus {background-color: #0d6efd;}


/* top-menu mobile */
.menubar-close { height: 100%; background-color: #2e3039; }
.menubar-close::before, .menubar-close::after { top: 30px}

.top-menu .user-dropdown .user-setting li { font-size: 15px; }
.top-menu .user-dropdown .user-setting li select { font-size: 15px; }
.top-menu-info .user-dropdown .dropdown-user .dropdown-toggle { height: auto; padding: 7px 7px; border-radius: 0; background: transparent; color: #222; }
.top-menu-info .user-dropdown .dropdown-user .dropdown-toggle:hover, .top-menu-info .user-dropdown .dropdown-user .dropdown-toggle:focus { text-decoration: underline}
.top-menu-info .user-dropdown .dropdown-user .dropdown-toggle::before { background: url('/images/icon-user.png') center no-repeat; }

.top-menu-link li a {font-size:14px;font-weight:400}
.top-menu-info {background-color: #F5F6FA;padding: 0 20px;height: 60px;align-items: center;justify-content: space-between;}
.top-menu-info>div { display: flex; align-items: center; }
.top-menu-info .time-limit { color: #fff; font-family: 'prometo'; font-size: 16px; gap: 5px; }
.top-menu-info .time-limit .material-symbols-outlined { font-size: 16px; }
.top-menu-info .btn { color: #fff; background-color: #0d6efd; font-size: 14px; transition: .3s; }
.top-menu-info .btn:hover, .top-menu-info .btn:focus { color: #0d6efd; background-color: #fff; }
.top-menu .top-menu-info .login {color: #222;width: inherit;height: inherit;font-size: 14px;background-image: url('/images/icon-login.png');}

.menubar {margin: 0 20px;padding: 0;}
.menubar .menubox-inner > .menu > li > .menu > li:hover > .menuitem, .menubar .menubox-inner > .menu > li > .menu > li:focus > .menuitem { color: #0d6efd}
.menubar > li > .menuitem { margin-bottom: 5px; border: none; background: #F5F6FA; border-radius: 10px; }
.menubar > li > .menuitem.expanded-true { border-bottom: none}
.menubar .menubox-inner > .menu > li > .menuitem { padding: 5px 16px 5px 20px; background: #fff}
.menubar .menubox-inner > .menu > li > .menu > li:hover::before, .menubar .menubox-inner > .menu > li > .menu > li:focus::before { background-color: #0d6efd; }
.menubar > li > .menuitem.haspopup-true.expanded-true + .menubox > .menubox-inner > .menu { margin-bottom: 10px; }
.menubar .menubox-inner > .menu > li .menuitem.expanded-true + .menu { background: #fff; }

@media(min-width:1200px) {
	.menubar .menubox {top: 70px;max-width: 2560px;padding-left: clamp(53px, (100vw - 1025px) / 17.92 + 53px, 96px);padding-right: clamp(53px, (100vw - 1025px) / 17.92 + 53px, 96px);}
	.menubar .menubox-inner > .menu {padding:30px 0}
	.menubar .menubox-inner > .menu > li > .menu > li::before { width: 4px; height: 4px; background: #0d6efd }
	.menubar > li > .menuitem {background:#fffa}
	
	.container-fluid, #main .container-wrap { max-width: 2560px; padding-left: clamp(53px, (100vw - 1025px) / 17.92 + 53px, 96px); padding-right: clamp(53px, (100vw - 1025px) / 17.92 + 53px, 96px); }
	.top-menu .time-limit::before {display: none;}
	
}
@media(min-width:1300px) {
	.menubar > li { padding: 0 25px; }
}
@media(min-width:1500px) {
	.menubar .menubox-inner { max-width: inherit}
	.top-menu-layout h1 span {font-size:20px;}
}

/* footer */
#footer {background-color: #2e3039;}
.footer-wrap {max-width: inherit;padding: 19px;}

.footer-top { display: flex; flex-direction: column; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.footer-top .f-link { display: flex; flex-wrap: wrap; justify-content: center; margin-bottom: 10px; }
.footer-top .f-link li:not(:last-child):after { display: inline-block; content: ''; width: 4px; height: 4px; background-color: #747680; vertical-align: middle; margin: 0 10px; border-radius: 50%; }
.footer-top .f-link a { color: #fff; letter-spacing: -.05em; }
.footer-top .f-link a:hover, .footer-top .f-link a:focus { text-decoration: underline; }
.footer-top .f-link li:first-child a { color: #fff; font-weight: 500; text-decoration: underline dotted; -webkit-text-decoration: underline dotted; text-decoration-color: rgba(255, 255, 255, 0.4); text-decoration-thickness: 0.1rem; text-underline-offset: 0.4rem; }
.f-family .f-item { position: relative; }
.f-family .f-item .f-select {width: 180px;height: 50px;background-color: #1a1b21;position: relative;border: 0;color: #fff;text-align: left;padding: 0 20px;font-size: 15px;transition: .3s;border-radius: 50px;}
.f-family .f-item .f-select::after { display: block; content: ''; width: 0; height: 10px; border-top: 6px solid transparent; border-bottom: 6px solid #9EA2A9; border-left: 6px solid transparent; border-right: 6px solid transparent; position: absolute; right: 20px; top: 42%; transition: .3s; transform: translateY(-50%); }
.f-family .f-item.on .f-select::after { transform: rotate(180deg); top: 13px; }
.f-family .f-item.on .fs-list { visibility: visible; opacity: 1; }
.f-family .f-item .fs-list { visibility: hidden; opacity: 0; position: absolute; right: 50%; bottom: 37px; transform: translateX(50%); width: 90vw; background-color: #3D4452; padding: 20px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); transition: all 0.3s ease-out; z-index: 100; max-height: 60vh; overflow-y: auto; }
.f-family .f-item .fs-list .list { display: flex; flex-wrap: wrap; text-align: left; margin: 0; overflow-y: auto; gap: 7px 2%; }
.f-family .f-item .fs-list .list li { flex: 1 1 100%; }
.f-family .f-item .fs-list .list li a { display: inline-block; color: #fff; }
.f-family .f-item .fs-list .list li a::before { display: inline-block; content: ''; width: 4px; height: 4px; background-color: #fff; border-radius: 50%; vertical-align: middle; margin-right: 7px; }
.f-family .f-item .fs-list .list li a:hover, .f-family .f-item .fs-list .list li a:focus { text-decoration: underline; }
#footer .copyright { color: rgba(255, 255, 255, 0.3); font-weight: 300; font-size: 13px; text-align: center; }
.go-to-top{display:none}

@media (min-width:768px) {
	.footer-wrap { padding: 35px 0; }
	.footer-top { flex-direction: row; justify-content: space-between; align-items: flex-start; align-items: center; }
	.footer-top .f-link li:not(:last-child):after { margin: 0 10px; }
	.f-family .f-item .f-select::after { border-top: 5px solid transparent; border-bottom: 5px solid #9EA2A9; border-left: 5px solid transparent; border-right: 5px solid transparent; }
	.f-family .f-item.on .f-select::after { top: 22px; }
	.f-family .f-item .fs-list { width: 500px; right: 0; bottom: 60px; transform: none; }
	.f-family .f-item .fs-list .list li { flex: 1 1 45%; }
	#footer .copyright { text-align: left; }
}
@media (min-width:992px) {
	.go-to-top{background: url(/images/go-top.png) no-repeat center / cover;width:60px;height:60px;position:fixed;right:5%;bottom:5%;border-radius:50%}
	.go-to-top:focus,.go-to-top:hover{transform:translateY(-10px);box-shadow:0 0 10px rgba(0,0,0,.5)}
}
@media (min-width:1200px) {
	.f-family .f-item .fs-list .list li { flex: 1 1 45%; }
	.go-to-top{width:75px;height:75px}
}

/* sub-layout */
.sec-header {display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start;margin-top: 0;margin-bottom: 20px;}
.sec-header .header-gr { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 10px; }
.sec-header .header-gr>.sec-title { color: #1d1d1d; font-family: 'scdream'; font-size: 28px; font-weight: 700; line-height: 1.5; }
.sec-header .header-gr>.sec-title>small { font-size: 16px; font-weight: 400; }
.sec-header .btn-gr .btn { margin-bottom: 0; }
.icon-list { display: flex; justify-content: center; align-items: center; margin: 0 10px; }
.icon-list>li:not(:first-child) { position: relative; margin-left: 8px; }
.icon-list>li:not(:first-child)::before { content: ""; display: block; width: 1px; height: 14px; position: absolute; top: 50%; left: -4.5px; transform: translateY(-50%); background-color: #e0e0e0; }
.icon-list .btn-icon { display: block; width: 32px; height: 32px; color: #103977; text-align: center; }
.icon-list .btn-icon>span { display: block; height: 32px; line-height: 1.2; }
.icon-list .btn-icon.help-btn {margin-top: 4px;}
.icon-list .dropdown-menu {padding:0;border:1px solid #e9e9e9; border-radius:10px;box-shadow:0 0 10px rgba(0,0,0,.1)}
.icon-list .dropdown-menu .material-symbols {display:none}
.user-setting li > h6 {margin-bottom:6px;}

.breadcrumb {margin-bottom: 10px;}
.breadcrumb li { position: relative; padding-right: 20px; }
.breadcrumb li:not(:last-child)::after { content: '\e5cc'; display: block; position: absolute; top: 0; right: 0; font-family: 'Material Symbols'; font-size: 18px; }
.breadcrumb .txt {position: relative;display: flex;text-decoration: underline;color: #222;}
.breadcrumb .home .txt { padding-left: 20px; }
.breadcrumb .home .txt::before { content: '\e88a'; display: block; position: absolute; top: 0; left: 0; width: 14px; height: 14px; font-family: 'Material Symbols'; font-size: 18px; }
.breadcrumb .material-symbols { font-size: 18px; line-height: 1.3; }
.breadcrumb li:last-child .txt { font-weight: 600; }
@media (min-width:1200px) {
	.sec-header { flex-direction: row; align-items: center; justify-content: space-between }
	.sec-header .header-gr { margin-bottom: 0; }
	.sec-header .header-gr>.sec-title {font-size: 39px;}
}