.top-header-box{margin:0 auto;max-width:1800px;}
.top-header-box:after{content:'';display:block;clear:both;}
.top-header-box > div{display:inline-block;background-color:#1c8fce;}
.top-header-box > div > a{display:inline-block;padding:0 27px;font-size:12px;color:#fff;line-height:30px}
.top-header-box > ul{float:right;padding: 0 0 0 20px;min-height: 36px;font-size:0;background-color:rgba(0,0,0,0.4);border-radius:50px;}
.top-header-box > ul > li{display:inline-block;position:relative;margin:0 14px 0 0;padding:3px 14px 0 0;vertical-align: middle;}
.top-header-box > ul > li::after{content: '';display: inline-block;position: absolute;top: 50%;right: 0;width: 1px;height: 42%;background: #fff;vertical-align: middle;transform: translateY(-50%);}
.top-header-box > ul > li:last-of-type{margin:0;padding:0;}
.top-header-box > ul > li:last-of-type:after{display:none;}
.top-header-box > ul > li:nth-of-type(3){margin:0;}
.top-header-box > ul > li:nth-of-type(3):after{display:none;}
.top-header-box > ul > li > a{font-size:12px;color:#fff;line-height:30px}



.top-header-box > ul.search-ul{position:relative;margin: 10px 0 0;}
.top-header-box > ul .sch {width: 36px;padding-right: 0;}
.top-header-box > ul.search-ul.on {padding: 0 0 0 56px;}
.top-header-box > ul.search-ul.on > li:not(.sch){visibility:hidden;opacity:0;}
.top-header-box > ul.search-ul.on .sch{position: absolute;right: 0;width: 100%;top: 0;}


.top-header-box > ul .search-wrap {
    
    position: relative;
	padding-right:32px;
	width: 100%;
    height: 36px;
	border: 2px solid #fff;
    border-radius: 50px;
	box-sizing: border-box;
}

.top-header-box > ul .search-wrap input {
    display: none;
    z-index: 10;
    padding:0 0 0 16px;;
	height: 32px;
    border-right: 0;
    border-radius: 50px 0 0 50px;
    box-sizing: border-box;
	background-color:transparent;
	color:#fff;
	
}
.top-header-box > ul .search-wrap .sch-btn:focus-visible{
	border: 2px solid blue;
    outline: none;
}
.top-header-box > ul.on .search-wrap input {max-width:calc(100% - 36px);}
.top-header-box > ul .search-wrap input:focus-visible {
    /*border: 1px dashed #fff;*/
    outline: none;
}

.top-header-box > ul .search-wrap input::placeholder {
    font-family: inherit;
    color: #999;
}

.top-header-box > ul .search-wrap input:focus::placeholder {
    color: #fff;
}

.top-header-box > ul .search-wrap .sch-btn {
    position: absolute;
    z-index: 20;
	right:0;
    width: 32px;
    height: 33px;
    background: url(../img/common/ico-search.png) no-repeat center center/16px 16px;
    border: none;
    vertical-align: middle;
    cursor: pointer;
	box-sizing:border-box;
}