@charset "utf-8";

/********************************************************
  HEADER
********************************************************/
.header,
.header .sta
{transition:all .16s cubic-bezier(.7,0,.3,1);transform:all .16s cubic-bezier(.7,0,.3,1);-webkit-transition:all .16s cubic-bezier(.7,0,.3,1);}

/* HEADER
------------------------------------------------*/
.header {width:100%; border-bottom:1px solid rgba(0,0,0,0.1); border-top:4px solid #666;}
.header .sta {height:60px; margin:0 auto;}
/* title */
.header .sta .title,
.header .sta .tools {margin:0 10px; font-size:0;}
.header .sta .title {}
.header .sta .title .fullTopNavi {font-size:25px; padding:0 10px; margin-left:-10px; color:#fff; display:none;}
.header .sta .title .logo {}
.header .sta .title .hgroup {margin-left:4px; line-height:18px;}
.header .sta .title .hgroup h1 {display:block; height:46px; line-height:46px; font-size:26px; font-weight:800; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.header .sta .title .hgroup h1 strong {color:#00bcd4;}
.header .sta .title .hgroup h1 img {height:100%; vertical-align:top;}
.header .sta .title .hgroup p {display:block; color:#666; font-size:14px;}
.header .sta .title .hgroup p em {font-style:normal;}

.header .sta .tools button {width:40px; height:40px; margin:0 8px; border-radius:50%; color:#555; font-size:25px; outline:none;}
.header .sta .tools button:hover {color:#333; background:rgba(0,0,0,0.06);}
.header .sta .tools button:active {color:#333; background:rgba(0,0,0,0.06);}
.header .sta .tools .btnTools {display:inline-block; vertical-align:middle;}
.header .sta .tools .user {position:relative; width:40px; height:40px; margin:0 4px; border-radius:50%; text-align:center; cursor:pointer;}
.header .sta .tools .user i {display:block; width:40px; height:40px; color:#666; font-size:24px; text-align:center; line-height:40px;}
.header .sta .tools .user i:before {vertical-align:top;}
.header .sta .tools .user img {width:40px; height:40px; border-radius:50%;}
.header .sta .tools .user .label_green {position:absolute; top:0; left:-8px; height:20px; padding:0 6px; border:2px solid #fff; border-radius:10px; background:#2c9bed; color:#fff; font-size:10px; font-weight:bold; text-align:center; line-height:16px; box-sizing:border-box;}
.header .sta .tools .user .label_orange {position:absolute; top:0; right:-8px; height:20px; padding:0 6px; border:2px solid #fff; border-radius:10px; background:#333; color:#fff; font-size:10px; font-weight:bold; text-align:center; line-height:16px; box-sizing:border-box;}
.header .sta .tools .resMobile {display:none;}

@media (max-width:1280px) {
	.responsive .header.fixed {position:fixed; top:0; z-index:99;}
	.responsive .header {margin-bottom:0px; border-top:0; border-bottom:0; background:#007bff; box-shadow:0 2px 8px rgba(0, 0, 0, 0.2);}
	.responsive .header .sta .title .hgroup h1 {color:#fff;}
	.responsive .header .sta .tools .user {position:fixed; z-index:9999; right:10px; bottom:10px; width:50px; height:50px; margin:0; border:2px solid #333; box-sizing:border-box; color:#333; background:#fff; box-shadow:0px 2px 20px rgba(0, 0, 0, 0.4);}
	.responsive .header .sta .tools button {color:rgba(255, 255, 255, 1);}
	.responsive .header .sta .tools button:hover {color:rgba(255, 255, 255, 0.8); background: rgba(0,0,0,0.1);}
	.responsive .header .sta .tools .user img {width:46px; height:46px;}
	.is-mobile .header.resize .sta {height:46px;}
}

@media (max-width:991px) {
	.responsive .header .sta .title .hgroup {}
	.responsive .header .sta .title .hgroup p {margin-top:-2px;}
	.responsive .header .sta .tools .resMobile {display:block;}
	.responsive .header .sta .tools .resPc {display:none;}
}

@media (max-width:767px) {
	.responsive .header .sta .title .hgroup .htitle ul li {font-size:20px;}
	.responsive .header .sta .title .hgroup .htitle ul li.ko {font-size:19px;}
	.responsive .header .sta .title .hgroup h1 {font-size:20px;}
	.responsive .header .sta .tools button {margin:0 4px;}
	.responsive .header .sta .title .hgroup p em {display:none;}

}

.mobileNavi {width:100%; display:none;}
.mobileNavi .twoDepth {height:46px; background:#fff; position:relative; margin-top:0; z-index: 1; touch-action:pan-x;}
.mobileNavi .twoDepth ul {display:block; margin:0; padding:0 10px; font-size:0; text-overflow:ellipsis; white-space:nowrap;}
.mobileNavi .twoDepth ul li {display:inline-block; vertical-align:top; box-sizing:border-box;}
.mobileNavi .twoDepth ul li:first-child {margin-left:10px;}
.mobileNavi .twoDepth ul li:last-child {margin-right:10px;}
.mobileNavi .twoDepth ul li a {display:block; margin:8px 0; padding:5px 8px; border-radius:20px; font-size:14px; line-height:unset;}
.mobileNavi .twoDepth ul li a i {height:13px; display:inline-block;}
.mobileNavi .twoDepth ul li a:hover {text-decoration:none;}
.mobileNavi .twoDepth ul li.active {border-bottom:2px solid #333;}
.mobileNavi .twoDepth ul li.active a {margin:7px 0; color:#333; font-weight:600;}

@media (max-width:1280px) {
	body[data-msubnavi="show"] .mobileNavi,
	body[data-msubnavi="show"].responsive .mobileNavi {display:block;}
}