header{transition: transform 0.8s,opacity 0.8s; transform: translateY(0); opacity: 1;}
header .bg{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; 
	transition: background-color 0.8s; z-index: -1; pointer-events: none; backdrop-filter: blur(10px);
}
header.hide{transform: translateY(-100%); opacity: 0;}
header.bg{backdrop-filter: blur(10px);}
header.bg .bg{background-color: rgba(255,255,255,0.8);}
header.bg .logoBx .logo svg .st0{fill: #004F9E;}
header.bg .logoBx .logo svg .st1{fill: #000;}
header.bg .right nav ul::before{background-color: rgba(0,0,0,0.25);}
header.bg .menuIco div{background-color: #000;}


._pagination { text-align: center; }
._pagination .inner { display: inline-flex; align-items: stretch; justify-content: center; position: relative; padding: 0 10px; box-sizing: border-box; }
._pagination .inner .arrow { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; bottom: 0; }
._pagination .inner .arrow.prev { right: 100%; }
._pagination .inner .arrow.next { left: 100%; }
._pagination .inner .arrow a { display: flex; align-items: center; align-items: center; height: 100%; padding: 0 0.4em; color: rgba(0,0,0,0.5); }
._pagination .inner .arrow a:hover { color: #000; }
._pagination .inner .arrow a i { }
._pagination .inner .arrow a.double { }
._pagination .inner .arrow a.double i { margin: 0 -0.3em; }
._pagination .inner .arrow a.single { }
._pagination .inner ul { display: flex; align-items: center; justify-content: center; }
._pagination .inner ul li { }
._pagination .inner ul li a { min-width: calc(30/16*1em); min-height: calc(30/16*1em); display: flex; align-items: center; justify-content: center; border-radius: 50%; color: rgba(0,0,0,0.5); }
._pagination .inner ul li:hover a { color: #000; }
._pagination .inner ul li.on a { background-color: var(--blue); color: #fff; }

._searchBar { }
._searchBar .inner { border-radius: 100px; border: 1px solid #dedfe2; box-sizing: border-box; display: flex; align-items: stretch; justify-content: center; width: 100%; max-width: 337px; overflow: hidden; font-size: 17px; }
._searchBar input { border: 0; margin: 0; width: 100%; height: 100%; width: 100%; height: calc(44/17*1em); letter-spacing: -0.04em; padding-left: calc(23/17*1em); box-sizing: border-box; font-size: 1em; }
._searchBar input::placeholder { }
._searchBar button { font-size: calc(20/17*1em); min-width: calc(52/20*1em); }
._searchBar button:hover { color: #000; }
._searchBar button i { }


._circleIco{
	font-size: 1px; position: absolute;
	width: calc(59/1*1em); height: calc(59/1*1em); background-color: rgba(0,0,0,0.26); border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
}
._circleIco .bar{
	height: calc(26/1*1em); width: 3px; background-color: rgba(255,255,255,0.5); border-radius: 10px;
}
._circleIco .white{background-color: #fff; width: 100%; height: 100%; animation: bar forwards infinite 4s;}
@keyframes bar {
	0% { transform: scaleY(0); transform-origin: top; }
	50% { transform: scaleY(1); transform-origin: top; }
	50.01% { transform-origin: bottom; }
	100% { transform: scaleY(0); transform-origin: bottom; }
}

@media screen and (max-width:1600px) { }
@media screen and (max-width:1440px) { }
@media screen and (max-width:1280px) { }
@media screen and (max-width:1024px) {
	._sub > .wrap { padding-top: 120px !important; padding-bottom: 90px !important; }
}
@media screen and (max-width:820px) {
	._searchBar .inner{font-size: 15px; }
}
@media screen and (max-width:500px) {
	._searchBar{width: 100%;}
	._searchBar .inner{font-size: 14px; border-radius: 6px;}
	._searchBar input{padding-left: 10px;}
}
@media screen and (max-width:320px) {
	._pagination .inner ul li a { font-size: 14px; }
}
