#menuText{ display:none;}
@media (min-width: 1px) and (max-width: 600px){
.href-one{	width:48.5%; }
#logo img{
	max-width:270px;
	max-height:80px;
}
#menuText{position:absolute;width:35px;height:10px;top:100px ;right:10px; display:block;}
}

@media (min-width: 400px) and (max-width: 600px){
.href-one{	width:30%;}
}

@media (min-width: 600px) and (max-width: 850px){
.wrap,#content-bg .wrap,#section2,#href-slide{	width:100%;}
#footer .wrap{	width:100%;}
#href-slide{background:transparent;}
#f-power{width:100%;}
#webtitle{ font-size:1.3em; display:block;}
#btn-open-search{display:none;}
#search-wrap{ width:320px; top:0px;	background:transparent;}
#btn-close-search, #btn-open-search span{ display:none;}
#search-box {margin:0px 10px 0px 10px;}
#search-box input[type="text"]{
	width:63%;
	padding:5px 5px;
	color: #666;
	background:#f5f5f5;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
	margin:6px 0px 0px 0px;
}
.section-box{ width:33.3%;}
.section-bot-title{
	padding:30px 10px 20px 10px;
	margin:0px 10px 15px 10px;
	text-align:center;
	background:transparent;
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px solid rgba(255,255,255,0.3);
}
.section-bot-title:before{
	position: absolute;
	top: -25px;
	left:50%;
	transform: translateX(-50%);
	-webkit-transform:  translateX(-50%);
	-moz-transform:  translateX(-50%);
	-o-transform:  translateX(-50%);
	-ms-transform:  translateX(-50%);
	width:46px;
	height:46px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	content:' ';
	padding:0px;
	margin:0px;
	background-size:contain;
	background-position:center ceneter;
	background-repeat:no-repeat;
	background-color:#005B45;
	border:4px solid #005B45;
}
.product-menu{	padding:0px 10px;}
.href-one{	width:24.2%;}

}

@media (min-width: 850px) and (max-width: 1100px){
.wrap, #content-bg .wrap, #section2, #href-slide{	width:100%;}
#footer .wrap{	width:100%;}
#href-slide{background:transparent;}
#f-power{width:100%;}

#webtitle{
	/*width: -moz-calc(100% - 190px);
	width: -webkit-calc(100% - 190px);
	width: calc(100% - 190px);
	width: expression(100% - 190px);====can't open until support*/
	width:60%;
	padding-left:0px;
	padding-right:50px;
	font-size:1.5em;
	display:block;
}
.header-fixed #webtitle{ 
	/*width: -moz-calc(100% - 143px);
	width: -webkit-calc(100% - 143px); 
	width: calc(100% - 143px); 
	width: expression(100% - 143px);====can't open until support*/
	width:60%;
	padding-left:0px;
	padding-right:35px;
	height:75px;
}
#btn-close-search, #btn-open-search span{ display:none;}
#search-wrap{ width:350px; top:0px;	background:transparent;}
#btn-close-search{ display:none;}
#search-box {margin:0px 5px 0px 10px;}
#search-box input[type="text"]{
	width:67%;
	padding:5px 5px;
	color: #666;
	background:#f5f5f5;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
	margin:6px 0px 0px 0px;
}
.section-box{ width:33.3%;}
.section-bot-title{
	padding:30px 10px 20px 10px;
	margin:0px 10px 15px 10px;
	text-align:center;
	background:transparent;
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px solid rgba(255,255,255,0.3);
}
.section-bot-title:before{
	position: absolute;
	top: -25px;
	left:50%;
	transform: translateX(-50%);
	-webkit-transform:  translateX(-50%);
	-moz-transform:  translateX(-50%);
	-o-transform:  translateX(-50%);
	-ms-transform:  translateX(-50%);
	width:46px;
	height:46px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	content:' ';
	padding:0px;
	margin:0px;
	background-size:contain;
	background-position:center ceneter;
	background-repeat:no-repeat;
	background-color:#005B45;
	border:4px solid #005B45;
}
.product-menu{	padding:0px 10px;}
.href-one{	width:19.4%;}

}


@media (min-width: 1100px) {
.wrap, #content-bg .wrap, #section2, #href-slide{	width:1100px;}
#footer .wrap{	width:100%;}
#href-slide{background:transparent;}
#f-power{width:100%;}

#logo a{ height:80px;}
.header-fixed #logo a{height:80px;}
#webtitle{ width:300px; height:75px; font-size:1.5em; display:block;}
.header-fixed #webtitle{ display:block;}
#ticker{ display:block;}
#btn-close-search, #btn-open-search span{ display:none;}
#search-wrap{ width:350px; top:0px;	background:transparent;}
#btn-close-search{ display:none;}
#search-box {margin:0px 0px 0px 10px;}
#search-box input[type="text"]{
	width:67%;
	padding:5px 5px;
	color: #666;
	background:#f5f5f5;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
	margin:6px 0px 0px 0px;
}
.section-box{ width:33.3%;}
.section-bot-title{
	padding:30px 10px 20px 10px;
	margin:0px 10px 15px 10px;
	text-align:center;
	background:transparent;
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px solid rgba(255,255,255,0.3);
}
.section-bot-title:before{
	position: absolute;
	top: -25px;
	left:50%;
	transform: translateX(-50%);
	-webkit-transform:  translateX(-50%);
	-moz-transform:  translateX(-50%);
	-o-transform:  translateX(-50%);
	-ms-transform:  translateX(-50%);
	width:46px;
	height:46px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	content:' ';
	padding:0px;
	margin:0px;
	background-size:contain;
	background-position:center ceneter;
	background-repeat:no-repeat;
	background-color:#005B45;
	border:4px solid #005B45;
}
.product-menu{	padding:0px 10px;}
.href-one{	width:19.4%;}

.menu-link {
	display:none;
}
.menu{
	clear: both;
	position:absolute;
	/*width: -moz-calc(100% - 400px);
	width: -webkit-calc(100% - 400px);
	width: calc(100% - 400px);
	width: expression(100% - 400px);====can't open until support*/
	
	width:100%;
	padding-left:360px;
	padding-right:0px;
	-moz-box-sizing: border-box;
    box-sizing: border-box;

	top:33%;
	transform: translateY(-50%);
	-webkit-transform:  translateY(-50%);
	-moz-transform:  translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	right:0px;
	left:auto;
	background:transparent;
	line-height:1.2em;
}

.menu,.menu ul, .menu.active, .menu ul.active {
	overflow:visible;
	max-height:0;/*must*/
	background-color:transparent;
}
.menu > ul > li {  /*first class*/
	float:left;
	border-top:none;
	border-left:none;
	position:relative;
	padding:0px 5px;
	margin:0px 0px;
	visibility:hidden;	
	display: inline;
}
.menu > ul > li.more-li {  /*first class*/

	margin:0 -26px 0 -5px;

}
.menu > ul > li:first-child{
	border-left:none;
}
.menu > ul > li:hover{	background-color:transparent;}
.menu ul li > a { 
	padding:10px 18px 10px 20px;
	font-size:1.2em;
}
.menu li.has-nextmenu > .plus{
	width:10px;
	height:10px;
	border-radius:50%;
	position:absolute;
	right:3px;
	top:8px;
}
.menu li.has-nextmenu > .plus:after {
	width:10px;
	height:10px;
}

.menu ul ul,.menu ul ul.nextmenu {
	overflow:hidden;
	max-height:0;
	position:absolute;
	z-index:3000;	
	min-width:160px;
	width: max-content;
	margin-top:0px;
	margin-left:0px;
}

.menu ul ul.active {/*open*/
	max-height:100em;
	border:none;
	background:#333;
}
.menu ul ul li{
	display:block;
	padding:0px 0px;
	margin:0px 0px;
	border-top:1px rgba(255,255,255,0.3) solid;
	border-left:none;
}
.menu ul ul li:first-child{
	border-top:none;
	border-left:none;
}
.menu ul ul li > a {
	padding:9px 5px;
	font-size:1.1em;
}
.menu ul ul li > a:before {
	content: '．';
}
/*============*/

.btn-moremenu{
	float:right;
	cursor:pointer;
}
.btn-moremenu span{
	background-color: transparent;
	background-image: url(../svg/menu-link.svg);
	background-repeat: no-repeat;
	background-position:center center;
	background-size:contain;
	height:18px;
	width:18px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
	float:left;
	transition:all 0.1s linear;
}
/*.btn-moremenu span:before{
	content:'More';
}*/
.btn-moremenu span.top{
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform:rotate(90deg);
	background-image: url(../svg/close.svg);
}
/*.btn-moremenu span.top:before{
	content:' ';
}*/



#more-menu{/*more menu ul*/
	clear: both;
	position:absolute;
	width:100%;
	top:40px;
	left:15px;
	background:rgba(0,0,0,0.8);
	line-height:1.5em;
}
.header-fixed #more-menu{top:45px;}

#more-menu, #more-menu ul{
	background:#454545;
	overflow:hidden;
	max-height:0%;
}
#more-menu.active, #more-menu.active ul {
	overflow:visible;
	max-height:100%;
}
#more-menu > ul > li { /*more menu first class = responsive .menu ul ul.active*/
	padding:0px 0px;
	margin:0px 0px;
	border-top:1px rgba(255,255,255,0.3) solid;
	border-left:none;
	position:relative;
	background-color:#454545;
}
#more-menu > ul > li:first-child{
	border-top:none;
	border-left:none;
}
#more-menu > ul > li:hover{	background-color:#333;}/*more menu first class hover bg = mainshare .menu > ul > li:hover,.menu > ul > li:active*/
#more-menu ul li > a { 
	padding:9px 5px;
	font-size:1.1em;
}
#more-menu li.has-nextmenu > .plus{
	color:#fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	position: absolute;
	right: 5px;
	top: 8px;
	padding:5px;
	cursor: pointer;
}
#more-menu li.has-nextmenu > .plus:hover{
	background-color:rgba(0,0,0,0.6);
}
#more-menu li.has-nextmenu > .plus:after {
	content: ' ';
	display:block;
	width:10px;
	height:10px;
	padding: 0px;
	margin: 0px;
	background-image: url(../svg/arrow.svg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	-ms-transform:rotate(270deg);
}
#more-menu li.has-nextmenu > .plus.active:after {
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform:rotate(90deg);
}

#more-menu ul ul, #more-menu ul ul.nextmenu {
	overflow:hidden;
	max-height:0em;
	position:relative;
	width:100%;
	margin-top:0px;
	margin-left:0px;
	
}

#more-menu ul ul.active {/*more menu > ul open*/
	max-height:100%;
	border:none;
	background-color:#111;
}
#more-menu ul ul li{
	position:relative;
	display:block;
	padding:0px 0px;
	margin:0px 0px;
	border-top:1px rgba(255,255,255,0.3) solid;
	border-left:none;

}
#more-menu ul ul li:hover{background-color:transparent;}
#more-menu ul ul li:first-child{
	border-top:none;
	border-left:none;
}
#more-menu ul ul li > a {
	padding:9px 5px;
	font-size:1em;
	font-family:Arial, Helvetica, sans-serif;
}
#more-menu ul ul li > a:before {
	content: '．';
}
#carousel {
    margin:121px auto 0px auto;
}

}


