* { margin: 0; padding: 0; text-decoration: none; font-style: normal }
html,
body { color: #111; line-height: 1.6em; font-family: "Arial Unicode MS", Arial, Helvetica, sans-serif; font-size: .95em; background-color: #fafafa; }
h1,h2,h3,h4,h5,h6 { font-size: 1.1em; }
p { margin: 0 0 20px 0 }
ul,ol,li { margin: 0; padding: 0; list-style: none }
a { color: #333; outline: none; text-decoration: none; -webkit-transition:all .3s ease; }
a:hover { text-decoration: none; color: #669933 }
input,textarea { font-family: "Arial Unicode MS", Arial, Helvetica, sans-serif; font-size: 1em; color: #333; line-height: 1.6em; }
img { width: 100%; display: block }

.mio-header { height: 60px; width: 100%; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 100; box-shadow: 0 5px 5px rgba(0,0,0,.2) }
.mio-header a.mio-logo { width: 94px; height: 60px; background: url(logo.webp) no-repeat center; display: block; text-indent: -999999px; float: left; background-size: 90% }

.mio-footer { background-color: #5d6164; padding: 50px 0; color: #fff; }
.mio-footer a { color: #cbced4 }
.mio-footer a:hover { color: #8fdf00; text-decoration: none }

.mio-copyright { background-color: #5d6164; padding: 15px 0; color: #cbced4; border-top: rgba(255,255,255,.1) 1px solid; }
.mio-copyright a { color: #cbced4 }
.mio-copyright a:hover { color: #8fdf00; text-decoration: none }

.mio-section { padding: 50px 0 }

.mio-side .mio-block { font-size: .9em; margin-bottom: 50px }
.mio-side .mio-block h3 { margin-bottom: 15px; padding-bottom: 15px; border-bottom: #ccc 1px solid }
.mio-side .mio-block .mio-smenu li { padding: 5px 0; border-bottom: #ddd 1px dashed }
.mio-side .mio-block .mio-smenu li.hover a { font-weight: bold;color: #669933; }

.mio-side .mio-block dl { margin-bottom: 5px; padding: 20px; background-color: #fff }
.mio-side .mio-block dt { font-size: 1.1em;color: #669933; border-left: #669933 2px solid; padding-left: 10px; margin-bottom: 6px; line-height: 1em  }
.mio-side .mio-block dd {}


h1.mio-h1t { border-bottom: #ccc 1px solid; padding-bottom: 20px; margin-bottom: 20px; line-height: 1.2em }

.mio-section-pro { background-color: #eee }
.mio-section-pro h2 { text-align: center; text-transform: uppercase; margin-bottom: 50px; font-size: 2em }

.mio-section-apro h1 {text-align: center; text-transform: uppercase; margin-bottom: 50px; font-size: 2em}
.mio-section-apro p.p1 { margin-bottom: 50px }

.mio-plist li:nth-child(odd) { background-color: #eee }
.mio-plist li h3 a { text-decoration: underline }
.mio-plist li .mio-intro {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 12; overflow: hidden;text-overflow: ellipsis;}

.mio-plistb li .mio-txt { padding: 10px 0 }
.mio-plistb li h3 { font-size: 1em; margin-bottom: 15px }
.mio-plistb li h3 a { text-decoration: underline }
.mio-plistb li .mio-intro {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6; overflow: hidden;text-overflow: ellipsis; font-size: .9em; line-height: 1.3em; color: #777 }

.mio-alist li { margin-bottom: 20px; padding-bottom: 20px }
.mio-alist li .mio-intro { display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6; overflow: hidden;text-overflow: ellipsis; font-size: .9em; line-height: 1.3em; color: #777 }
.mio-alist li h3 a { text-decoration: underline }


@media (min-width:320px) and (max-width:640px) {
html,body { background-color: #fff; overflow-x: hidden; width: 100% }
	.container { padding: 0 25px; }
	.mio-header a.mio-logo { background-size: 70%}
	.mio-navm { float: right; width: 30px; height: 30px; overflow: hidden; padding: 15px 0; cursor: pointer }
	.mio-navm span { width: 30px; height: 30px; display: block; background-position: center; background-repeat: no-repeat }
	.mio-navm span.mio-open { background-image: url(icon-menu.webp) }
	
	.mio-nav { position: fixed; top: 0; bottom: 0; right: -640px; width: 100%; z-index: 999; background-color: rgba(255,255,255,.95); }
	.mio-nav .mio-close { text-align: right; padding: 20px 20px 0 0 }
	.mio-nav .mio-close span { display:inline-block; width: 30px; height: 30px; overflow: hidden; padding: 5px; cursor: pointer; background-image: url(icon-close2.webp); background-size: 40%; background-repeat: no-repeat; background-position: center; background-color: #5d6164; }
	.mio-nav ul { padding: 20px; }
	.mio-nav li { margin-bottom: 5px; padding-bottom: 5px; border-bottom: rgba(255,255,255,.1) 1px dashed }
	.mio-nav li a.mio-a { display: block; height: 32px; line-height: 32px; background-color: #5d6164; padding: 5px 15px; color: #fff }
	.mio-nav li a.mio-a span { display: inline-block; float: right; width: 12px; height: 32px; background: url(icon-ar.webp) no-repeat center; background-size: 100%}

	.mio-hct { display: none }
	
	.mio-banner { margin-top: 60px; }
	
	.mio-section { padding: 25px 0 }
	.mio-section-apro h1 { margin-bottom:20px; font-size: 1.4em}
	
	.mio-plist li { padding: 25px 0 }
	.mio-plist li .mio-txt { padding-top: 10px }
	
	.mio-plistb { padding: 25px 0 0 0 }
	.mio-plistb li { width: 49%; float: left; margin-right: 2% }
	.mio-plistb li:nth-child(2n) { margin-right: 0 }

	.mio-section-pro h2 { margin-bottom: 20px; font-size: 1.2em }

	.mio-plista { }
	.mio-plista li { width: 49%; float: left; margin-right: 2% }
	.mio-plista li:nth-child(2n) { margin-right: 0 }
	.mio-plista li .mio-txt { padding: 10px 0 }
	
	.mio-a3 .mio-txt { padding-top: 20px }
	.mio-a3 .mio-txt h2 { margin-bottom: 20px }
	.mio-a3 .mio-txt a { text-decoration: underline }
	
	.mio-alist li h3 { margin-bottom: 15px }
	.mio-alist li .mio-txt { padding: 15px 0 0 0 }

}
@media (min-width:641px) {
	body {  }
	.mio-fl { float: left }
	.mio-fr { float: right }

	.container { padding: 0 25px; width: 1150px; margin: 0 auto }

	.mio-header { height: 100px; border-top: #669933 3px solid }
	.mio-header a.mio-logo { height: 100px }

	.mio-nav { float: right; height: 50px; margin-top: 9px; border-top: #eee 1px solid; border-left:#eee 1px solid }
	.mio-nav ul li { float: left; border-right: #eee 1px solid }
	.mio-nav ul li a { display: block; line-height: 50px; font-weight: bold; text-transform: uppercase; padding: 0 60px; }
	.mio-nav ul li a:hover { background-color: #fafafa }
	.mio-nav ul li.hover a { color: #669933; border-bottom: #669933 3px solid; height: 47px; }
	
	.mio-hct { float: right; height: 40px; line-height: 40px; }
	.mio-hct li { float: left; margin-left: 30px }
	.mio-hct li b { margin-right: 6px; }
	.mio-hct li a { text-decoration: underline }
	
	.mio-banner { margin-top: 100px; }
	
	.mio-main { width: 70%; float: left; border-right: #ccc 1px solid; padding-right: 2.5% }
	.mio-side { width: 25%; float: right }
	
	h1.mio-h1t { font-size: 2em; font-family: Verdana, Arial, Helvetica, sans-serif }
	
	.mio-alist li .mio-img { width: 35%; float: left }
	.mio-alist li .mio-txt { width: 60%; float: right; padding-top: 20px }
	.mio-alist li h3 { font-size: 1.4em; margin-bottom: 20px }
	.mio-alist li .mio-intro { -webkit-line-clamp: 16; }

	.mio-apage .mio-wrap {}
	.mio-apage .mio-img { width: 48%; float: left }
	.mio-apage .mio-txt { width: 48%; float: right }
	
	.mio-a2 .mio-wrap:nth-child(2) .mio-img { float: right }
	.mio-a2 .mio-wrap:nth-child(2) .mio-txt { float: left; padding-top: 30px }
	.mio-a2 .mio-wrap:nth-child(1) .mio-txt { padding-top: 50px }
	.mio-a2 .mio-wrap:nth-child(3) .mio-txt { padding-top: 80px }
	
	.mio-a3 .mio-img { width: 45% }
	.mio-a3 .mio-txt { width: 50%; padding: 50px 0 0 0 }
	.mio-a3 .mio-txt h2 { font-size: 1.6em; margin-bottom: 30px }
	.mio-a3 .mio-txt a { text-decoration: underline }
	.mio-a3 .mio-txt em { display: inline-block; width: 90px }
	
	.mio-plista {}
	.mio-plista li { width: 15%; float: left; margin-right: 2% }
	.mio-plista li:nth-child(6n) { margin-right: 0 }
	.mio-plista li .mio-img { height: 129px; overflow: hidden; background-color: #999 }
	.mio-plista li .mio-txt { height: 60px; padding: 10px 0 }
	
	.mio-plistb { padding: 50px 0 0 0 }
	.mio-plistb li { width: 18.4%; float: left; margin-right: 2% }
	.mio-plistb li:nth-child(5n) { margin-right: 0 }
	.mio-plistb li .mio-img { }
	.mio-plistb li .mio-txt { }
	
	.mio-plist li {}
	.mio-plist li .mio-img { width: 50%; float: left }
	.mio-plist li .mio-txt { width: 50%; float: right }
	.mio-plist li .mio-c { padding: 50px }
	.mio-plist li h3 { font-size: 1.4em; margin-bottom: 25px }
	.mio-plist li:nth-child(2n) .mio-img { float: right }
	.mio-plist li:nth-child(2n) .mio-txt { float: left }
	.mio-plist li:nth-child(2n) .mio-c { padding-left: 0 }
	.mio-plist li:nth-child(odd) .mio-c { padding-right: 0 }


}

.clear { clear: both }
.container::before,
.container::after,
.clearfix::before,
.clearfix::after {
	content: "";
	display: block;
	visibility: hidden;
	clear: both;
}