#header01 {	margin: 0px auto 5px;	width:100%;	background: #fff; display: flex; justify-content: space-between;}
#header01 .logo {margin-left:2%; margin-top: 15px;}
#header01 .logo img {	width:100%;	max-width: 355px;}

#header01 .header_right { width: 80%;}
#header01 .header_right_online { margin-top: 20px; float: right;}

#header01 .sub_menu { margin-top:0px; padding-bottom:0px; display: flex; justify-content: flex-end; align-items: center;}
	
#header01 .sub_menu li {margin-right:10px;}
#header01 .sub_menu li .sub01 {order:2;}
#header01 .sub_menu li .sub02 {order:1;}
#header01 .sub_menu li a.telnumber {font-size: 180%; font-style: italic; color:#436359; line-height: 180%; padding-top:10px; display: block; margin-right: 15px; }
#header01 .sub_menu li img { width:100%; margin-bottom:3px;}
#header01 .sub_menu li .btn_online {width:190px; font-size: 90%;height: 50px;}
#header01 .sub_menu li a.btn_online{display:block;padding:0px 5px;text-align:center;text-decoration:none;border-radius:5px;background: #b09a09; color:#FFFFFF; font-size: 130%; vertical-align: middle; line-height: 50px;}
#header01 .sub_menu li a.btn_online:hover{background: #81710a;}

#header01 .sub_menu li .btn_oldsystem {width:190px; font-size: 90%;height: 50px;}
#header01 .sub_menu li a.btn_oldsystem{display:inline-block;padding:7px 15px 5px;text-align:center;text-decoration:none;border-radius:5px;background: #333333; color:#FFFFFF;line-height: 140%;}
#header01 .sub_menu li a.btn_oldsystem:hover{background: #000000;}

#header01 .sub_menu li .btn_douhan {width:150px; font-size: 90%;height: 35px;}
#header01 .sub_menu li a.btn_douhan{display:block;padding:0px 5px;text-align:center;text-decoration:none;background: #0870a6; color:#FFFFFF; font-size: 120%; vertical-align: middle; line-height: 35px;}
#header01 .sub_menu li a.btn_douhan:hover{background: #074e73;}

#header01 .sub_menu li .btn_contact {width:35px; font-size: 90%;height:35px;}
#header01 .sub_menu li a.btn_contact{display:block;text-align:center;text-decoration:none;background: #50aa1b; color:#FFFFFF; font-size: 130%; vertical-align: middle; line-height: 34px;}
#header01 .sub_menu li a.btn_contact span {padding-left: 3px;}
#header01 .sub_menu li a.btn_contact:hover{background: #255c05;}

#header01 .sub_menu li a {	text-decoration:none;	text-align:center;}
#header01 .sub_menu li a:hover { 	text-decoration:none;	text-align:center;}

#navi_box02 {	clear:both;	width:100%;background-image: linear-gradient(to bottom, #007355 0%, #03543f 100%);	height:80px;}

@media screen and (max-width:1200px)and (min-width:920px){
#header01 .sub_menu li a.telnumber {font-size: 140%; font-style: italic; color:#436359; line-height: 140%; padding-top:10px; display: block; margin-right:5px; }
	#navi_box02 {height:70px;}
    .navi li {font-size: 85%;	line-height:140%;}
}
@media screen and (max-width:919px){
#header01 {	margin: 0px auto 0px;	width:100%;	display: flex; justify-content: center; flex-wrap: wrap;}

#header01 .logo {	margin:40px auto 0px; text-align: center; width: 100%;}
#header01 .logo img {	width:100%;	max-width: 300px;}
#header01 .header_right_online { margin:0px auto; width: 100%;text-align: center;}
#header01 .sub_menu li {margin-right:0px; text-align: center;width: 100%;}
#header01 .sub_menu li a.telnumber,#header01 .sub_menu li a.btn_contact,#header01 .sub_menu li a.btn_douhan{display: none;}
#header01 .header_right_online .sub_menu li a.btn_oldsystem {width:180px; font-size: 90%;display:block;transition:0.3s;margin: 0px auto 5px;line-height: 140%;padding: 10px 10px 5px;}
#header01 .header_right_online .sub_menu li a.btn_online {width:180px; font-size: 90%;display:block;transition:0.3s;margin: 0px auto 5px;height: 40px;line-height: 40px;}
}

@media screen and (min-width: 920px){
    
.nav-check,.nav-btn,.logo_s{display:none;}
.navi_none{display:none;}
}

@media screen and (max-width: 919px) {
	#navi_box02 {	clear:both;	width:100%;background:#007355;	height:40px; position: absolute; top:0;}
    .logo_s img {width:100%; max-width: 200px;}
	.nav-menu{position:fixed;top:0;right:0;transform:perspective(500px) rotateY(-90deg);opacity:0;}
	.nav-check{display:none;}
	.nav-btn{position:fixed;display:block;top:10px;right:20px;display:block;width:40px;height:40px;font-size:10px;text-align:center;cursor:pointer;z-index:3;}
	.nav-bar{position:absolute;top:0;left:0;display:block;width:40px;height:3px;background:#fff;transition:all .1s;transform-origin:left top;}
	.nav-bar.middle{top:8px;opacity:1;}
	.nav-bar.bottom{top:17px;transform-origin:left bottom;}
    
    .nav-menu{
background-image: linear-gradient(to bottom, #007355 0%, #03543f 100%);box-sizing:border-box;width:250px;height:100%;padding:20px 0;transition-property:all;transition-duration:.1s;transition-delay:0s;transform-origin:right center;z-index: 999;}
	.nav-menu li a{color:#fff;display:block;padding:8px 20px;transition:all .1s;text-decoration:none;font-size:90%; border-bottom: 1px dotted #fff;}
    
    
	.nav-menu li a:hover, .nav-menu  li a:hover p, .nav-menu ul li a:hover font{color:#ffffff;background:rgba(0,0,0,0.60)}
	.nav-btn:hover .nav-bar{background:#fff;}
	.nav-close{position:fixed;top:0;right:250px;width:100%;height:100vh;background:rgba(0,0,0,0);cursor:auto;transition-property:all;transition-duration:.1s;transition-delay:0s;visibility:hidden;opacity:0;}
	.nav-check:checked ~ .nav-menu{transition-delay:.1s;transform:none;opacity:1;z-index:2;}
	.nav-check:checked ~ .nav-btn .nav-bar.top{width:45px;transform:rotate(45deg);}
	.nav-check:checked ~ .nav-btn .nav-bar.middle{opacity:0;}
	.nav-check:checked ~ .nav-btn .nav-bar.bottom{width:45px;top:31px;transform:rotate(-45deg);}
	.nav-check:checked ~ .nav-close{transition-duration:1s;transition-delay:.1s;background:rgba(0,0,0,.5);visibility:visible;opacity:1;z-index:3;}
}