@charset "UTF-8";
@media only screen and (max-width: 1080px) {
*{
	box-sizing: border-box;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.lzpic2{
	display: block;
}
.lzpic1{
	display: none;
}
.article {
	line-height: 24px;
	font-size: 14px;
}
.header {
	width: 100%;
	height: 60px;
}
.header.white:hover{
	background: #fff;
}
.header:hover {
	background: none;
}
.topnav .logo,
.header .logo {
	width: 30px;
	height: auto;
	margin: 15px auto 0 auto;
	display: block;
}
.topnav .logo img,
.header .logo img{
	width: 50px;
	height: auto;
}
.topnav .language,
.header .language {
	right: 10px;
	top: 10px;
	background-size: 18px auto;
}
.menuBtn{
	display: block;
}
.nav {
	width: 100%;
	position: fixed;
	left: 0;
	top: 60px;
	z-index: 7777;
	opacity: 0;
	pointer-events: none;
	transform: translateY(10px);
	backface-visibility: hidden;
	background: #FFF;
	min-height: 100vh;
	padding: 40px 15px 0;
	transform-style: preserve-3d;
	transition-duration: .5s;
	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-ms-transition-duration: .5s;
	-o-transition-duration: .5s;
}
.nav.show{
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}
.nav > ul {
	display: block;
	text-align: left;
	min-height: 100vh;
}
.nav > ul > li {
	float: none;
	position: static;
}
.nav > ul > li > a {
	font-weight: 360;
	font-size: 1.1em;
	width: 100%;
	height: 50px;
	line-height: 50px;
	padding: 0 20px;
	border-bottom: 1px solid #E5E5E5;
	position: relative;
	outline: 0;
	align-items: center;
	justify-content: flex-start;
}
.nav > ul > li > a:hover {
	color: #333;
}
.nav > ul > li > a.add{
	background: url(../images/add.png) no-repeat right 20px center;
}
.nav .sub {
	width: 100%;
	left: 0;
	top: 0;
	transform: translate(0,0);
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	box-shadow: 0 0 0 rgba(0, 0, 0, 0);
	background: #FFF;
	min-height: 100vh;
	padding: 40px 15px 0;
	transform-style: preserve-3d;
}
.nav .sub .back{
	display: block;
}
.nav .sub .back a{
	padding-left: 40px;
}
.nav .sub .back a::after{
	content: '';
		display: block;
		position: absolute;
		top: 50%;
		width: 10px;
		height: 10px;
		margin-top: -5px;
		border-top: 1px solid #333;
		border-left: 1px solid #333;
		left: 20px;
		transform: rotate(-45deg);
}
.nav .sub a {
	height: 50px;
	line-height: 50px;
	padding: 0 20px;
	outline: 0;
	align-items: center;
	justify-content: flex-start;
	position: relative;
}
.nav .sub a:hover {
	color: #333;
}
.nav .sub li:last-child a {
	border-bottom: 1px solid #E5E5E5;
}
.topnav .logo {
	left: 0;
	top: 0;
	position: relative;
}
.topnav .nav {
	display: none;
}
.footer {
	position: relative;
	padding: 0;
}
.footer .wrap{
	padding: 40px 15px 0 15px;
}
.footer .returnTop{
	display: block;
	width: 40px;
	height: 40px;
	margin-left: -20px;
	position: absolute;
	left: 50%;
	top: 20px;
	z-index: 5;
}
.footer .returnTop::after{
	content: '';
	display: block;
	width: 10px;
	height: 10px;
	margin: -2.5px 0 0 -5px;
	border-top: 1px solid #333;
	border-left: 1px solid #333;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: rotate(45deg);
}
.footer .logo {
	display: block;
	width: 120px;
	height: 75px;
	margin: 40px auto;
}
.footer .logo img{
	width: 100%;
	height: auto;
}
.footer .linkList {
	text-align: left;
	margin-top: 0;
	clear: both;
}
.footer .linkList > ul {
	padding-bottom: 0;
}
.footer .linkList .tit {
	display: block;
}
.footer .linkList ul ul {
	display: none;
}
.footer .linkList li {
	display: block;
	margin: 0;
	border-bottom: 1px solid #DDD;
}
.footer .linkList .tit,
.footer .linkList li a {
	width: 100%;
	height: 40px;
	line-height: 40px;
	position: relative;
	display: block;
	align-items: center;
	font-weight: 400;
}
.footer .linkList .tit{
	background: url(../images/add.png) no-repeat right 20px center;
}
.footer .linkList .tit.sub{
	background-image: url(../images/sub.png)
}
.footer .linkList li a:hover {
	color: #333;
}
.footer .linkList li a::after {
	display: none;
}
.footer .linkList .sub li{
	border-top: 1px solid #DDD;
	border-bottom: none;
}
.footer .linkList .sub li a{
	font-size: .8em;
	padding: 0 10px;
}
.footer .abtn a {
	margin-top: 20px;
}
.footer .abtn a:hover {
	border: 1px solid #999;
	color: #999;
}
.footer .sns {
	margin-top: 20px;
}
.footer .bottom {
	padding: 20px 15px;
	margin-top: 30px;
	font-weight: 400;
}
.footer .lang {
	background-size: 18px;
	line-height: 24px;
	clear: both;
}
.footer .lang a {
	font-size: .8em;
}
.footer .copy {
	float: none;
	clear: both;
	padding-top: 4px;
}
.footer .copy p {
	font-size: .8em;
}
.popup-language ul li a:hover {
	color: #333;
	background: url(../images/arrow2.png) no-repeat right 18px center;
}
.swiper-pagination .swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	margin: 0 5px;
}
.main .banner{
	padding-bottom: 30px;
}
.main .banner .swiper-slide {
	height: auto;
}
.main .banner .pic {
	height: calc(100vh - 120px);
}
.main .serum .wrap,
.main .banner .wrap {
	position: static;
	top: 0;
	left: 0;
	transform: translate(0,0);
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	padding: 0;
}
.main .banner .swiper-pagination {
	bottom: 0;
}
.main .banner .fixedtext {
	float: right;
}
.main .banner .fixedtext .p2,
.main .banner .fixedtext .p3,
.main .banner .fixedtext .more span {
	color: #333;
}
.main .banner .fixedtext .more span {
	background-image: url(../images/arrow2.png);
}
.main .banner .fixedtext .more span::after {
	display: none;
}
.main .fixedtext {
	width: 100%;
	float: none;
	padding: 50px 10px;
}
.main .fixedtext .p2 {
	margin: 8px 0 20px 0;
}
.main .fixedtext .more {
	margin-top: 20px;
}
.main .fixedtext .more a,
.main .fixedtext .more span {
	font-size: 12px;
	padding-right: 14px;
}
.main .fixedtext .more a:hover::after,
.main .fixedtext .more a::after,
.main .fixedtext .more span::after {
	display: none;
}
.main .serum .pic{
	background-attachment: scroll;
	height: calc(100vh - 120px);
	min-height: 320px;
}
.main .product {
	padding: 0px 40px 30px 40px;
}
.main .product .swiper-slide a:hover img {
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	-o-transform: scale(1, 1);
	-moz-transform: scale(1, 1);
}
.main .product .swiper-slide .text {
	padding: 14px;
}
.main .product .swiper-pagination {
	margin-top: 20px;
}
.main .latest .row .pic {
	min-height: 300px;
	width: 100%;
	float: none;
}
.main .latest .row .cont {
	width: 100%;
	min-height: auto;
	float: none;
	padding: 40px 20px;
}
.main .latest .row:nth-child(even) .cont ,
.main .latest .row:nth-child(even) .pic {
	float: none;
}
.main .latest .news,
.main .latest .fixedtext {
	padding: 0;
}
.main .latest .fixedtext .more a {
	margin: 0 12px;
}
.main .latest .news ul {
	margin: 30px 0;
}
.main .latest .news li {
	padding: 14px 0;
}
.main .latest .news li .date {
	width: 100%;
	float: none;
}
.main .latest .news li .txt {
	padding: 0;
	margin-top: 6px;
}
.main .latest .news li .txt a:hover {
	color: #333;
}
.main .latest .news .btn:hover {
	border: 1px solid #999;
	color: #999;
}
.brace100{
	height: 50px;
}
.brace230 {
	height: 110px;
}
.column-menu {
	margin-bottom: 50px;
}
.column-menu .wrap {
	padding: 0 15px;
}
.column-menu .swiper-slide {
	min-width: 25%;
	width: auto;
}
.column-menu a {
	min-width: 120px;
	font-size: .8em;
}
.column-menu a:hover {
	color: #333;
}
.column-menu.s3 .swiper-slide a{
	padding: 0;
	font-size: .7em;
}
.store-page {
	padding: 0 15px 30px;
}
.store-page .store {
	background: #fff;
	padding: 0px;
	margin: 40px 0;
}
.store-page .store .box:nth-child(even) ,
.store-page .store .box {
	width: 100%;
	border: none;
	border-bottom: 1px solid #DDD;
	border-top: 1px solid #DDD;
}
.store-page .store .box a {
	padding: 15px 0;
}
.store-page .store .box a:hover {
	background: #FFF;
}
.intelligence {
	padding: 0 15px 30px;
}
.intelligence .concept .title .tit {
	font-size: 1.4em;
}
.intelligence .concept .title .en {
	font-weight: 300;
}
.intelligence .concept .cont {
    padding: 45px 20px 15px 20px;
    margin-bottom: 50px;
}
.intelligence .concept .action .box:last-of-type,
.intelligence .concept .action .box,
.intelligence .concept .vision .box:nth-last-of-type(-n+3),
.intelligence .concept .vision .box:nth-of-type(3n),
.intelligence .concept .vision .box,
.intelligence .concept .task .box:nth-last-of-type(-n+2) ,
.intelligence .concept .task .box:nth-of-type(even),
.intelligence .concept .task .box,
.intelligence .concept .cont .box {
	width: 100%;
	padding: 0;
	border: none;
	display: block;
	text-align: left;
}
.intelligence .concept .cont .box span {
	display: inline-block;
}
.intelligence .concept .action .en {
    font-size: 1.25em;
    line-height: 1.6em;
}
.intelligence .concept .action .tit {
	font-size: 1.25em;
    line-height: 1.6em;
    margin-bottom: 20px;
}
.intelligence .concept .action .box {
	padding: 0 0 20px 0;
	margin: 0 0 40px 0;
	border: none;
	border-bottom: 1px dashed #DDD;
}
.intelligence .lst {
	margin-bottom: 20px;
}
.intelligence .profile {
  border: none;
}
.intelligence .profile .row {
  padding: 0;
  border: none;
  display: block;
}
.intelligence .profile .tit {
  width: 100%;
  padding: 0px;
  margin-bottom: 20px;
	border: none;
}
.intelligence .profile .txt {
  width: 100%;
  padding: 0;
}
.intelligence .page-map {
  margin: 0 -15px;
  padding-bottom: 50px;
}
.intelligence .address .col {
  width: 100%;
  float: none;
}
.intelligence .address .tit {
  font-size: 1.25em;
  line-height: 1.6em;
  margin-bottom: 20px;
}
.intelligence .address .lst,
.intelligence .address .txt {
  margin-bottom: 20px;
}
.intelligence .address .lst li {
  position: relative;
  padding-left: 20px;
}
.intelligence .address .lst li::after {
  background: #CCC;
  width: 12px;
  height: 12px;
  left: 2px;
  top: 6px;
  display: block;
  position: absolute;
  border-radius: 50%;
  content: '';
  border: none;
}
.statute-page {
  padding: 0 15px 30px;
}
.statute-page .contact {
  padding: 55px 25px 35px;
}
.statute-page .contact .title {
      font-size: 1.25em;
}
.statute-page .contact .col {
  width: 100%;
  float: none;
}
.statute-page .contact .col:nth-child(even) {
  float: none;
}
.statute-page .contact .col:nth-child(1) {
	border-bottom: 1px solid #DDD;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.statute-page .contact .phone{
	padding-top: 10px;
}
.statute-page .contact .phone span {
  font-size: 1.563em;
}
.container .banner {
  min-height: auto;
}
.container .banner .en {
  font-size: 1.8em;
  line-height: 1.6em;
}
.container .banner .txt {
  font-size: 1.5em;
}
.brand-introduce {
  padding: 50px 15px;
  margin-bottom: 50px;
}
.brand-introduce .col {
  width: 100%;
  float: none;
}
.brand-introduce .col:nth-child(even) {
	float: none;
}
.brand-introduce .ttl {
    font-size: 1.25em;
  	margin: 0 0 20px 0;
}
.brand-introduce .p2 {
  font-size: 1.2em;
}
.brand-introduce .p2 .b2 {
  font-size: 1.2em;
}
.brand-introduce ul li {
  width: 86.5px;
  height: 50px;
  margin-right: 10px;
}
.brand-introduce ul li::before,
.brand-introduce ul li::after {
  width: 61px;
  height: 61px;
  left: 12px;
}
.brand-introduce ul li::before{
 	top: -30px;
}
.brand-introduce ul li::after{
 	bottom: -30px;
}
.brand-page {
  padding: 0 15px;
}
.pctitle2 .tit {
  font-size: 1.25em;
}
.pctitle2 .txt {
  font-size: 1em;
  padding-top: 16px;
}
.products-list {
  margin-bottom: 50px;
}
.products-list li {
  width: 33.333%;
}
@media only screen and (max-width: 600px){
	.products-list li {
	  width: 50%;
	}
	.products-list li .pic {
	  padding: 40px 10px 0;
	}
	.products-list li .text {
	  padding: 20px;
	}
}
.products-post {
  padding-bottom: 0px;
  background: #FFF;
  margin: 0 -15px;
}
.products-post .photo {
  width: 100%;
  float: none;
  background: #F5F5F5;
  padding: 0 15px 40px 15px;
}
.products-post .photo .content {
  padding: 0px;
}
.products-post .photo .gallery-thumbs {
  width: 1px;
  height: 1px;
  opacity: 0;
}
.products-post .photo .gallery-top{
	height: 300px;
	padding-bottom: 20px;
}
.products-post .photo .gallery-top img{
	width: auto;
	height: 100%;
	margin: 0 auto;
}
.products-post .photo .swiper-pagination {
  display: block;
  bottom: 0;
}
.products-post .top {
  width: 100%;
  padding: 1px 15px;
  float: none;
  background: #F5F5F5;
  text-align: center;
  font-size: .8em;
}
.products-post .top .title {
  font-size: 1.8em;
  line-height: 1.8em;
  margin-bottom: 20px;
}
.products-post .introduce {
  width: 100%;
  float: none;
	padding: 50px 15px 0;
	display: block;
}
.products-post .introduce .p2 {
  text-align: center;
}
.products-post .introduce .data {
  margin: 20px 0;
}
.products-post .introduce .buy {
  margin-bottom: 30px;
}
.products-post .introduce .shop{
  text-align: center;
}
.products-post .introduce .ingr {
  margin: 10px auto 0 auto;
  float: none;
}
.products-post .introduce .ingr:hover {
  border: 1px solid #999;
  color: #333;
}
.products-post .introduce .ingr:hover::after,
.products-post .introduce .ingr:hover::before {
  border: 1px solid #999;
}
.products-post .sns {
  position: static;
  width: 100%;
  right: 0;
  top: 0;
  text-align: center;
  margin-top: 24px;
}
.products-post .sns ul{
	display: inline-block;
}
.products-post .sns li {
  float: left;
  margin: 0 4px;
}
.products-post .sns li a {
  width: 30px;
  height: 30px;
}
.brand-page .details {
  margin: 50px 0;
}
.brand-page .details .col:nth-child(even),
.brand-page .details .col {
  width: 100%;
  padding: 0;
  margin-top: -1px;
}
.brand-page .details .title{
	background: url(../images/add.png) no-repeat right 15px center;
}
.brand-page .details .title.on{
	background-image: url(../images/sub.png);
}
.brand-page .details .box {
  padding: 20px 0;
  display: none;
}
.brand-page .details .step li {
  width: 50%;
}
.technology {
  padding: 0 15px;
}
.technology .freeze {
  margin-bottom: 40px;
}
.technology .top .tit {
  font-size: 1.25em;
  line-height: 1.6em;
}
.technology .frame {
  padding: 0;
  margin-bottom: 30px;
}
.technology .frame::after {
	display: none;
}
.technology .frame .box{
	display: block;
}
.technology .frame .col:nth-child(2),
.technology .frame .col {
  width: 100%;
  padding: 0;
  display: block;
}
.technology .frame .col:nth-child(2) .pic {
  padding: 0;
}
.technology .frame .txt{
	padding: 0;
	margin: 20px 0;
}
.technology .capsule {
  padding: 50px 15px 30px;
  margin: 40px 0;
}
.technology .capsule .row {
  margin: 0;
  padding: 0;
}
.technology .capsule .col {
  width: 100%;
  float: none;
  padding: 0;
}
.technology .capsule dl dt {
  width: 22%;
}
.technology .capsule dl dd {
  width: 78%;
  background: #FFF;
  border-left: none;
}
.technology .marine {
  padding-bottom: 30px;
}
.technology .marine .hdr {
  font-size: 1.25em;
  padding: 20px;
}
.technology .marine .hdr br{
	display: none;
}
.technology .marine .hdr::after,
.technology .marine .hdr::before {
  font-size: 1.33em;
}
.technology .marine .row {
  padding-bottom: 0px;
  margin-bottom: 0px;
  border: none;
}
.technology .marine .row .col {
  width: 100%;
  display: block;
  margin-top: 20px;
}
.technology .marine .row .txt {
  padding: 0;
}
.technology .marine .row .btn {
  text-align: left;
}
.base-hdr .tit {
  font-size: 1.20em;
}
.base-hdr .en{
	font-size: .9em;
}
.technology .distro {
  padding: 50px 15px 30px;
}
.technology .distro .map {
  padding: 20px;
  margin-bottom: 20px;
}
.technology .distro .row {
  font-size: .64em;
  line-height: 1.6em;
}
.technology .distro .row .col {
  width: 100%;
  padding: 0;
  float: none;
}
.technology .distro .row .col:nth-child(even) {
  padding: 0;
}
.technology .distro .row table .num {
  width: 36px;
  padding: 5px 10px;
}
.technology .distro .row table .name {
  padding: 5px 10px 5px 0;
}
.technology .distro .row table .cate {
  width: 108px;
  padding: 4px 9px;
}
.technology .distro .row .cate span {
  margin: 1px;
  font-size: .8em;
  line-height: 16px;
  width: 16px;
  height: 16px;
}
.technology .distro .row .note ul li {
  line-height: 16px;
  vertical-align: top;
  display: inline-block;
  margin: 0 5px 5px 0;
}
.technology .distro .row .pic .tit {
  text-align: center;
}
.news-page {
  padding: 0 15px 50px 15px;
}
.news-list {
  padding: 0;
}
.news-list li {
  padding: 15px 0;
}
.news-list li .tit span {
  font-size: .8em;
}
.news-list li .tit a {
  font-size: 1em;
  line-height: 1.6em;
}
.news-list li .tit a:hover {
  color: #333;
}
.news-list .more {
  margin: 40px auto 0;
}
.news-page .title {
  margin-bottom: 40px;
}
.news-page .title .date {
  margin-bottom: 10px;
}
.news-page .title .tit {
  font-size: 1.25em;
}
.news-page .navi-post {
      padding: 40px 0 0 0;
}
.media-list {
  margin: 0 -10px;
}
.media-list li {
  width: 50%;
  padding: 0 10px;
  margin-bottom: 20px;
}
.media-list li .pic {
  margin-bottom: 15px;
}
.media-list li .tit,
.media-list li .date {
  font-size: 0.8em;
}












}/*手机版css*/