header{position:fixed;top:0;padding:30px 30px 0 30px; margin:0 auto; width:95%; letter-spacing:-0.5px; border-bottom:1px solid #ddd;background-color :rgba(255,255,255,0.9);z-index : 9999999;width : 100%;}
header .div1 {position:relative;}
header .div1 .logo{width:200px;position:absolute; left:0;right:0; margin:auto;}
header .div1 li{float:left;font-size:13px; margin-left:12px;display: flex; align-items: center; justify-content: center; height: 30px;}
header .div1 li.flags{width:30px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); border-radius: 50%;}
header .div2 > ul{ display: flex;}
header .div2 > ul > li{flex : 1;cursor:pointer; font-family:'Noto Sans JP';font-size:14px; text-align:center;padding:30px 0;position:relative;}
header .div2 .sub{text-align:left;color:white;background:rgba(0,0,0,0.7);display:none;margin-top:30px;position:absolute;padding:10px;min-width:100%;z-index:999999;}
header .div2 .sub.show{display:block;}
header .div2 .sub li{padding:5px 15px;font-size:13px;}

.introduce-sub{width:110%;}
.baby-face-sub{width:125%;}


#quick{
	position: fixed;
  right: 30px;
  width: 90px;
}

#quick ul {background:#e877ad;}

#quick li{
	display : flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding : 0 15px;
	cursor : pointer;
	background : rgba(255,255,255,0.90);
	/* border-left : 1px solid #ddd; */
	/* border-right : 1px solid #ddd; */
}

#quick li > div{	
	position: relative;
	padding : 0px 0;
}
#quick li > div:after{	
	position: absolute;content: '';
	width: 60px;height:1px;
  border-bottom: 2px dotted #ddd;
  bottom: 0;
  left: 11px;
}
#quick li.top{
	background : none;
	border : 0;
	margin-bottom : 8px;
}

#quick li:nth-child(2){
	/* border-top : 1px solid #ddd; */
	/* border-radius : 30px 30px 0 0; */
}
#quick li:last-child{
	padding : 0;
	border:0;
  background: #e877ad;
}

#quick li:last-child > div{
	padding : 0;
	border-bottom : 0;
}

#quick li:last-child > div:after { border-bottom: 0px; }

#quick li.top img{
	width : auto;
	margin-bottom : 0;
}


#quick li img{
	width : auto;
}

#wechat_pc, #so_info, #line{
	display : none;
	position : fixed;
	width : 100%;
	top : 0;
	left : 0;
	height : 100vh;
	background : rgba(0,0,0,0.5);
	z-index: 9999999;
}

#wechat_pc img{
	width : auto;
}

#wechat_pc .qrcode, #so_info .qrcode, #line .qrcode{
	display : flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	height : 100%;
}

#wechat_pc .qrcode .id, #line .id{
	background : #333;
	padding :20px;
	width : 512px;
	text-align : center;
	color : #fff;
	font-weight : 700;
}

#so_info .img{
	width : 40%;
}

#so_info_mo{
	display : none;
}

#wechat{
	display : none;	
}

@media screen and (max-width:1150px){
	header .div1 .logo{right:initial;}
}

@media screen and (max-width:991px){
	header{
		width : 100%;
		padding : 0;
		z-index : 999999;
		background-color : rgba(255,255,255);
		display : flex;
		flex-direction : column;
		overflow-y : auto;
	}

	header.on{
		height : 100%;
	}

	header .div1{
		display : flex;
		padding : 30px;
	}
	header .div1 img{
		width : auto;
	}

	header .div1 .logo img{
		width : 100%;
	}
	header .div1 > div:nth-child(1),
	header .div1 > div:nth-child(3){
		flex: 1;
	}
	header .div1 > div:nth-child(2){
		flex: 4;
		text-align:center;
	}
	header .div1 > div:nth-child(3){
		text-align : right;
	}
	header .div1 > div:nth-child(3) img{
		width : 24px;
	}

	header .div1 .menu{
		cursor : pointer;
	}
	
	header .div1 .logo{
		position : relative;
	}

	header .div2 > ul.menu-list{
		flex-wrap : wrap;
	}
	header .div2 > ul.menu-list > li{
		width : 50%;
		flex : auto;
		border-bottom : 1px solid #ddd;
		padding : 20px 0;
		position : relative;
	}

	header .div2 > ul.menu-list > li:nth-child(2n+1){
		border-right : 1px solid #333;
	}

	header .div2{
		display:none;
		background-color : #fff;
	}

	header .div2 .menu-list{
		background : #f4f4f4;
		width : 100%;
		z-index : 99999999999;
		box-shadow : 0px 5px 5px grey;
	}

	header .div2 .menu-list img{
		width : 16px;
		margin-left : 30px;
		position : absolute;
		right : 10px;
	}

	header .div2 .sub{
		position : relative;
		width : 100%;
		background : #fff;
		color : #333;
		padding: 0;
	}

	header .div2 .sub > li {
		border-bottom : 1px solid #ddd;
		padding: 0;
	}
	header .div2 .sub > li > a{
		display: block;
		padding: 20px;
	}

	header .languages{
		background : #333;
	}

	header .languages li{
		padding : 30px 10px !important;
	}

	header .quick-menu{
		border-top : 1px solid #ddd;
		border-bottom : 1px solid #ddd;
		background : #fff;
	}

	#wechat, #so_info_mo{
		height : 100vh;
		background-color : rgba(0,0,0,0.3);
		display:none;
		z-index:9999999999;
		position : fixed;
		left : 0;
		top : 0;
	}
	#wechat .qrcode, #so_info_mo .qrcode{
		display : flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		height : 100%;
	}

	#wechat .qrcode .id{
		background : #fff;
		padding :20px;
		width : 100%;
		text-align : center;
	}

}