#content {	width: 960px;	margin: 0 auto;	margin-bottom: 85px}
#content h2 {	margin: 20px 0 0;	padding: 0}
#content>.menu {	position: relative;	height: 64px;	margin: 30px 0 0;	padding: 0;	z-index: 0;width: 100%;
  display: -webkit-flex;display: -ms-flexbox;display: flex;}

#content>.menu li {	background-image: url(../img/category_bg.png);background-repeat: no-repeat;background-position: bottom;background-size: contain;width: 50%;	height: 68px;	text-align: center;background-color: #bcdcae;border-radius: 4px;  display: -webkit-flex;display: -ms-flexbox;display: flex;}
#content>.menu li::before{content:"";background-image:url(../img/betweenBefore.png);height: 100%;display: block;background-repeat: no-repeat;background-size: contain;width:35px}
#content>.menu li::after{content:"";background-image:url(../img/betweenAfter.png);height: 100%;display: block;background-repeat: no-repeat;background-size: contain;width:35px;background-position: right;}
#content>.menu li:first-child::before,#content>.menu li:last-child::after{content:"";background-image: none}
#content>.menu li a {width: 100%;height: 100%;display: block;transition: opacity 0.5s ease-out}
#content>.menu li a span {display: block;margin-top: 19px}
#content>.menu li a span img{	width: 180px}
#content>.menu li a:hover {	opacity: 0.5}
#content>.menu li.on {	z-index: 1;background-image: url(../img/category_bg.png);background-color: #376F9B}
#content>.menu li.on a {	cursor: default;opacity: 1}
#content .category {	margin-top: 50px}
#content .category .title {	height: 40px;	background-color: #376F9B}
#content .category .title h4 {	display: inline-block;	margin: 0;	padding: 0;	padding-left: 10px;	font-size: 1em;	font-weight: bold;	color: #fff;	background: none;	line-height: 40px}
#content .category ul{  display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;padding: 0 20px}
#content .category ul li {display: inline-block;	width: 192px;	margin: 25px 15px 5px;}
#content .category ul li .image {	display: table-cell;	width: 192px;	height: 120px;	vertical-align: middle;	text-align: center}
#content .category ul li .image a {	display: inline-block}
#content .category ul li .image a img {	vertical-align: top}
#content .category ul li p { margin-top: 8px; padding: 0 35px}
#content .category ul li p a {	display: inline-block;	margin-left: 12px;	font-size: 0.75em;	color: #215596;	text-indent: -14px;	text-decoration: underline}
#content .category ul li p a:before {	content:url(../img/icon_arrow.gif);	position: relative;	top: 2px;	margin-right: 2px;}
#content .category ul li p a:hover {	text-decoration: none}
#content .category ul li.new .image a ,#content .category ul li.renewal .image a {	margin-left: -47px}
#content .category ul li.new .image a:before {	content: "";background-image: url(../img/icon_new.gif);	margin-right: 5px;display: block;background-size: contain;width: 42px;height: 42px;float: left}
#content .category ul li.renewal .image a:before {	content: "";background-image: url(../img/icon_renewal.gif);	margin-right: 5px;display: block;background-size: contain;width: 42px;height: 42px;float: left}
/* #content .category ul li.previous .image a:before {	content: "";	margin-right: 5px;display: block;background-size: contain;width: 42px;height: 42px;float: left} */

@media all and (max-width: 640px) {
  #content {	width: 95vw;	margin-bottom: 10vw}
  #content>.menu{height: auto}
  #content>.menu li {height: 8vw;}
  #content>.menu li a span {margin: 0;height: 7vw;display: -webkit-flex;display: -ms-flexbox;display: flex;flex-direction: column;-webkit-flex-direction: column;	-ms-flex-direction: column;justify-content: center;	-webkit-justify-content: center;	-ms-flex-pack: center}
  #content>.menu li a span img{	width: 31vw;margin: auto;display: block;}
  #content .category {	margin-top: 5vw}
  #content .category .title {	height: 10vw;}
  #content .category .title h4 {font-size: 3vw;	line-height: 11vw}

  #content .category ul{padding: 0 1vw}
  #content .category ul li {margin: 3vw 0 2vw;width: 46vw}
  #content .category ul li .image {}
  #content .category ul li .image a img{width: 25vw}
  #content .category ul li p {padding: 0 2vw}
  #content .category ul li p a {}
  #content .category ul li p a:before {}
  #content .category ul li.new .image a ,#content .category ul li.renewal .image a {	margin-left: 0vw}
  #content .category ul li.new .image a:before ,#content .category ul li.renewal .image a:before {width: 10vw;height: 10vw}
}