html {font-size: 62.5% !important;}
#title{ background: #f5f5f2; height: 3.4rem; line-height: 3.4rem; display: flex;}
#title .wi{ display: flex; flex-direction: row; font-size: 1.2rem; color: #333; padding: 0 1rem;}
#title span{ background: url(../img/tel.png) no-repeat 0 center; align-items: center; display: flex; background-size: 1.8rem; padding-left: 2.6rem; line-height: 100%;}
#title em{ margin-left: auto; display: flex; flex-direction: row; align-items: center; }
#title em a{ color: #333;}
#title em a:hover,nav.navbar.bootsnav ul.nav > li > a:hover,nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a:hover{ color: #0e9393;}
#title em i{ color: #ccc; margin: 0 1rem;}
.wi{ width: 100%;}
.navbar .logo{ color: #333; line-height: 50px; flex: 1; font-size: 2rem; display: flex; flex-direction: row; align-items: center; justify-content: center;}
.navbar .logo::before{ content: ""; background: url(../img/logo.png) no-repeat center; background-size: contain; width: 4rem; height: 4rem; margin-right: 0.5rem;}
nav.navbar.bootsnav ul.nav > li > a{ font-size: 1.4rem;}
nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a{ font-size: 1.2rem;}
nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a.s{ font-weight: bold;}
i.fa{ background-size: 2rem; background-repeat: no-repeat; width: 40px; height: 50px; display: block; background-position: center; opacity: 0.4;}
i.fa.fa-bars{ background-image: url(../img/menu.png);}
i.fa.fa-times{ background-image: url(../img/close.png);}
.banner_box { position: relative; width: 100%; overflow: hidden;}
#banner{ width: 100%; text-align: center; overflow: hidden;background: linear-gradient( 45deg, #0e9393 0%,#dfc93a 100%);}
#banner .swiper-slide{ position: relative;}
#banner .swiper-slide div{ position: absolute; width: 100%; z-index: 1; color: #dfc93a; height: 100%; display: flex;}
#banner .swiper-slide div p{ display: flex; flex-direction: column; text-align: left; font-size: 2rem; justify-content: center; font-weight: bold;}
#banner a{ display: block;}
#banner img{ width: 100%; z-index: -1; height: 100%; /*opacity: 0.4;*/ object-fit: cover; max-height: 450px; min-height: 120px;}
#banner .pagination{ position: absolute; bottom: 0.8rem; z-index: 1;}
#banner .swiper-pagination-bullet-active {background: #fff;}
#banner .picbg img{ max-height: 300px; min-height:120px;}
#banner .swiper-slide div p i{ font-size: 1.6rem; font-weight: normal; margin-top: 0.5rem; color: #fff;}
#banner .swiper-slide div p em{ font-size: 2.1rem;}
.banner1{ height: 300px;}
.picbg::after{ content: ""; width: 100%; height: 100%; background-position: right center; background-repeat: no-repeat; background-color: #ededed; position: absolute; left: 0; top: 0; background-size: cover;}
.picbg.p1::after{ background-image: url(../img/top2.jpg);}
.picbg.p2::after{ background-image: url(../img/top3.jpg);}
.picbg.p3::after{ background-image: url(../img/top4.jpg);}
.picbg.p4::after{ background-image: url(../img/top5.jpg);}
#copyright{ background: #f2f2f2; padding: 1rem 0; border-top: #dfc93a 0.4rem solid;}
#copyright .wi{ font-size: 1.2rem; color: #6e6e6e; text-align: center; justify-content: center; line-height: 2rem; display: flex; flex-direction: row; flex-wrap: wrap;}
#copyright .wi p{ margin: 0 1rem; width: auto;}
#footer{ background: #0a4d1a; padding: 2rem 0;}
#footer .wi{ display: flex; flex-direction: row; align-items: center;}
#footer .r{ flex: 1; background: #0e9393; display: flex; flex-direction: row; justify-content: space-between; padding: 1rem 2rem;}
#footer .l{ width: 34rem;}
#footer .l dd p{ font-size: 1.2rem; display: flex; flex-direction: row; line-height: 2rem; margin-bottom: 0.5rem; display: flex; flex-direction: row;}
#footer .l dd p::before{ content: ""; width: 2rem; height: 2rem; background-repeat: no-repeat; background-size: 1.4rem; background-position: 0 center; opacity: 0.4; flex-shrink: 0;}
#footer .l dd p:nth-child(1):before{ background-image: url(../img/i1.png);}
#footer .l dd p:nth-child(2):before{ background-image: url(../img/i2.png);}
#footer .l dd p:nth-child(3):before{ background-image: url(../img/i3.png);}
#footer .l dd p em{ flex-shrink: 0; opacity: 0.4;}
#footer dl{ display: flex; flex-direction: column; color: #fff;}
#footer dl dt{ font-size: 1.6rem; margin-bottom: 1rem; font-weight: bold;}
#footer dl dt a{ color: #fff;}
#footer dl.o dt{border-bottom: rgba(255, 255, 255, 0.2) 0.1rem solid; margin-bottom: 0.5rem; padding-bottom: 1rem; text-align: center;}
#footer dl.o dt p{ font-size: 1.2rem;}
#footer dl dd{ display: flex; flex-direction: column;}
#footer dl dd a{ color: rgba(255, 255, 255, 0.7); font-size: 1.2rem; line-height: 2.4rem;}
#footer dl dd a:hover{ text-decoration: underline;}
#totop{width:4rem;height:4rem;cursor:pointer;position:fixed;right:2rem;bottom:5rem;background: url(../img/totop.png) no-repeat center; background-size: contain; text-indent: -9999em; z-index:100;display:none;opacity:0.7;}
#totop:hover{opacity:1;}
.navbar-fixed{ top: 0;}
.navbar-fixed.no-background{ top: inherit;}
.fixhi{ height: 50px;}
.col1{ width: 100%; display: flex; flex-direction: column; margin: 3rem auto; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.15);}
.col2{ width: 100%; display: flex; flex-direction: column; margin: 3rem auto; line-height: 2rem;}
.col2 dt{ font-size: 2.2rem; margin-bottom: 1rem; color: #0e9393; border-left: #0e9393 0.6rem solid; padding-left: 0.6rem;}
.col2 dd{ font-size: 1.2rem; font-weight: normal;}
.col1 .txt{ padding: 3rem; display: flex; flex-direction: column;}
.col1 .txt h3{ font-size: 2.4rem; margin-bottom: 1rem;}
.col1 .txt h3 p{ font-size: 1.8rem;}
.col1 .txt h4{ font-size: 1.2rem; font-weight: normal; line-height: 2rem;}
.col1 .txt a{ margin: 1rem auto 0; padding: 0.8rem 2rem; font-size: 1.2rem; color: #fff; background: #0e9393; border-radius: 5rem;}
.col1 .txt a:hover{ opacity: 0.8;}
.bmenu{ background: #f2f2f2;}
.bmenu .wi{ display: flex; flex-direction: row; justify-content: center; line-height: 4.2rem; align-items: center;}
.bmenu .wi a{ font-size: 1.4rem; margin: 0 2rem; border-bottom: #f2f2f2 0.3rem solid; white-space: nowrap;}
.bmenu .wi a.s{ color: #0e9393; font-size: 1.6rem; border-bottom: #0e9393 0.3rem solid; font-weight: bold;}
.box{ padding: 2rem 1rem; font-size: 1.4rem; line-height: 2.8rem; display: flex; flex-direction: column;}
.box p{ margin: 0.5rem 0;}
.box p.ti{ text-indent: 2em;}
.box p.c6{ text-align: center;}
.event{ position: relative; margin: 3rem;}
.event .line { width: 1px;height: 100%;background: #e7e8ea;position: absolute;left: 50%;}
.event ul li {position: relative;overflow: hidden;margin-bottom: 1rem;line-height: 2.4rem;padding-top: 3rem;}
.event ul .date {float: left;width: calc(50% - 3rem);padding-right: 3rem;text-align: right;font-size: 1.4rem;color: #0e9393;transition: 300ms ease 0ms; font-weight: bold;}
.event ul li::after {content: ' ';width: 1rem;height: 1rem;background: #0e9393;border-radius: 50%;position: absolute;left: 50%;top: 3.6rem;transition: 300ms ease 0ms;margin-left: -0.5rem;}
.event ul .txt {float: right;width: calc(50% - 3rem);padding-left: 3rem;text-align: left;font-size: 1.4rem;color: #666;}
.event ul li:first-child{ padding-top: 1rem;}
.event ul li:first-child::after{ top: 1.6rem;}
.wa{ max-width: 56rem; margin: auto;}
.col3 p{ display: flex; flex-direction: row; line-height: 2rem; margin: 1rem 0;}
.col3 p::before{ display: flex; color: #0e9393; padding-right: 0.5rem; margin-right: 0.5rem; border-right: #ddd 0.1rem solid; font-weight: bold; font-size: 2rem; align-items: center;}
.col3 p:nth-child(1):before{ content: "A";}
.col3 p:nth-child(2):before{ content: "B";}
.col3 p:nth-child(3):before{ content: "C";}
.col3 p:nth-child(4):before{ content: "D";}
.col3 p:nth-child(5):before{ content: "E";}
.col3 p:nth-child(6):before{ content: "F";}
.lxi{ display: flex; flex-direction: row; display: flex; flex-direction: row;}
.lxi::before{ content: ""; width: 2.4rem; height: 2.8rem; background-repeat: no-repeat; background-size: 1.8rem; background-position: 0 center; flex-shrink: 0;}
.lxi.i1:before{ background-image: url(../img/i4.png);}
.lxi.i2:before{ background-image: url(../img/i5.png);}
.lxi.i3:before{ background-image: url(../img/i6.png);}
.lxi em{ flex-shrink: 0; color: #0e9393;}
nav.navbar.bootsnav ul.nav > li > a.s{ font-weight: bold; color: #0e9393; border-bottom: #dfc93a 0.5rem solid;}
.img{ display: flex; margin-top: 1rem; flex-direction: row; flex-wrap: wrap; justify-content: center;}
.img dl{ margin: 0 0.5rem 1rem; width: calc(50% - 1rem); display: flex; flex-direction: column; align-items: center;}
.img.img1 dl{ width: calc(33.3% - 1rem);}
.img dl.wb{ width: 100%;}
.img dl img{ width: 100%;}
.img dl dd{ line-height: 2rem; margin-top: 0.5rem;}
.ti1{ font-size: 1.2rem; margin: 0; color: #999; line-height: 2rem;}
.ti2{ display: flex; flex-direction: row; align-items: center; justify-content: center; margin: 1rem !important;}
.ti2 b{ border-bottom: #dfc93a 0.5rem solid; font-size: 1.8rem; line-height: 2rem; padding: 0.8rem 0; color: #0e9393;}
.img p{line-height: 2rem;}
.tt{ border-top: #e0e0e0 1px solid; padding-top: 1rem;}
.img dl img{ border: #e0e0e0 1px solid; border-radius: 1rem;}
.home h3{ font-size: 1.2rem; line-height: 2rem; font-weight: normal;}
.home h4{ font-size: 1.6rem; line-height: 2rem; margin: 4rem 0 2rem; display: flex; flex-direction: row; align-items: center;}
.home h4::after{ content: "";width:0;height:0;border-right:0.8rem solid transparent;border-left:0.8rem solid transparent;border-top:0.8rem solid rgba(0, 0, 0, 0.6); margin-left: 0.4rem;}
.col4{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.col4 dl{ width: calc(25% - 1rem); box-shadow: 0 0 2rem 0 rgba(0,0,0,0.15); margin: 8rem 0 2rem; border-radius: 6rem 6rem 1rem 1rem; display: flex; flex-direction: column; align-items: center; position: relative;}
.col4 dl::before{ content: ""; background-size: contain; width: 14rem; height: 14rem; position: absolute; top: -7rem; left: auto; border-radius: 50%; background-repeat: no-repeat; background-position: center; box-shadow: 0 0 2rem 0 rgba(0,0,0,0.15); border: #fff 0.3rem solid;}
.col4 dl:first-child:before{ background-image: url(../img/pic2.jpg?202204141507);}
.col4 dl:nth-child(2):before{ background-image: url(../img/pic1.jpg?202204141507);}
.col4 dl:nth-child(3):before{ background-image: url(../img/pic4.jpg?202204141507);}
.col4 dl:nth-child(4):before{ background-image: url(../img/pic3.jpg?202204141507);}
.col4 dl dt{ line-height: 2rem; padding: 9rem 1rem 0; font-size: 1.6rem; font-weight: bold;}
.col4 dl dd{ font-size: 1.2rem; padding: 1rem 1.5rem; line-height: 2rem; width: calc(100% - 3rem);}
.home .picbox{ display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 2rem;}
.home .picbox div.c1{ display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: calc(45% - 2rem);}
.home .picbox div.c1 p{ width: calc(50% - 1rem);}
.home .picbox div img{ width: calc(100% - 2px); box-shadow: 0 0 2rem 0 rgba(0,0,0,0.15); border: #e0e0e0 1px solid; border-radius: 1rem;}
.lightense-wrap img{ width: auto !important; border: 0 !important; border-radius: 0 !important; max-width: 100%; max-height: 100%;}
.home .picbox div.c2{ display: flex; flex-direction: column; padding: 4rem 0; width: 55%; position: relative;}
.home .picbox div.c2 p{ width: 80%; position: absolute;}
.home .picbox div.c2 p:nth-child(2){ right: 0; top: 0;}
.home .picbox div.c2 p:nth-child(1){ left: 0; bottom: 0;}
.c3{ display: flex; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 4rem 0;}
.c3.c4{ padding: 0 20rem;}
.c3 p{ width: calc(50% - 1rem); margin: 1rem 0;}
.c3.c5 p{ width: calc(25% - 1rem);}
.c3.c9 p{ width: calc(100% / 6 - 1rem); display: flex; flex-direction: column; font-size: 1.2rem; text-align: center; line-height: 1.6rem;}
.c3.c9 p i{ padding-top: 0.5rem;}
.c3 img{ width: calc(100% - 2px); box-shadow: 0 0 2rem 0 rgba(0,0,0,0.15); border: #e0e0e0 1px solid; border-radius: 1rem;}
.c3.c9 img{ border-radius: 2.5rem;}
.c3.c9{ align-items: flex-start;}
.c3.c9 .lightense-wrap img{ border-radius: 2.5rem !important;}
.video{ margin:6rem 16rem;}
p.c7{display: flex; flex-direction: row; align-items: center; color: #0e9393; margin-top: 3rem;}
p.c7::before{ content: "";width:0;height:0;border-top:0.6rem solid transparent;border-bottom:0.6rem solid transparent;border-left:0.6rem solid #0e9393; margin-right: 0.4rem;}
.c8{ margin: 2rem 2rem 0; display: flex; flex-direction: column; align-items: center;}
.c8 div{ display: flex; flex-direction: column; align-items: center; border: #dfc93a 0.4rem solid; text-align: center; font-size: 1.4rem; padding: 0.5rem 0;}
.c8 p{ padding: 0.5rem 3rem; color: #0e9393;}
.hline p{ font-size: 1.2rem; color: #999; line-height: 2rem;}
.c3.c0{ padding: 3rem 0 0;}

@media screen and (min-width: 960px) {
	html {font-size: 80% !important;}
    .wi{ width: 90rem; margin: 0 auto;}
    .navbar .logo{ line-height: 80px;}
    .img dl.half dt{ width: 60%;}
    #title .wi{ padding: 0;}
    #banner .swiper-slide div p{ font-size: 3.6rem;}
    .fixhi{ height: 80px;}
    .col1{ width: 90rem; flex-direction: row; flex-direction: row-reverse; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.15);}
    .col2{ width: 90rem;}
    .col1 .txt a{ margin: auto auto 0 0;}
    #banner .swiper-slide div p i{ font-size: 2rem; margin-top: 1rem;}
    .box{ padding: 2rem 0;}
    .box.box1{ padding: 0;}
    .box.box2{ padding: 0 0 3rem;}
    .event ul li.even .date {float: right;text-align: left;padding: 0 0 0 3rem;}
    .event ul li.even .txt {float: left;text-align: right;padding: 0 3rem 0 0;}
    .img{ width: 54rem; margin: 1rem auto 0;}
    .home h4{ margin: 6rem 0 2rem;}
    .col4{ margin: 6rem 0 2rem;}
    .hline{border-bottom: #dfc93a 0.1rem solid; height: 1.8rem; margin: 4rem 0;}
    .hline .rela{ position: relative;}
    .hline h2{ background: #fff; position: absolute; top: 0; left: -1rem; padding: 0 1rem;}
    .hline h2 b{ font-size: 2rem; line-height: 3.6rem; color: #0e9393;}
    .hline p{ padding-top: 4rem;}
    .c3.c4{ margin: 3rem 0;}
}
@media screen and (max-width: 959px){
    nav.navbar.bootsnav .navbar-header{ padding: 0 !important; line-height: 4rem;}
    .swiper-button-next, .swiper-container-rtl .swiper-button-prev{ right: 0 !important;}
    .swiper-button-next:after, .swiper-button-prev:after{ transform: scale(0.5);}
    .swiper-button-prev, .swiper-container-rtl .swiper-button-next{ left: 0 !important;}
    #footer{ padding:1rem;}
    #footer .l dt{ text-align: center; line-height: 3rem;}
    #footer .r{ display: none;}
    #footer .l{ width: auto; margin-right: 0; border-right: 0;}
    .event .line { left: 20%;}
    .event{ margin: 3rem 1rem;}
    .event ul li .date{width: calc(20% - 1rem);padding-right: 1rem;}
    .event ul li::after{ left: 20%;}
    .event ul .txt{width: calc(80% - 1rem);padding-left: 1rem;}
    nav.navbar.bootsnav.no-full .navbar-collapse{ box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);}
    nav.navbar.bootsnav{ border-bottom: 0 !important;}
    .bmenu .wi{ justify-content: space-around;}
    .bmenu .wi a{ margin: 0;}
    nav.navbar.bootsnav .navbar-nav{ padding-bottom: 10px;}
    .box{ padding:1rem 2rem;}
    .box.box1{ padding: 0 2rem;}
    .box.box2{ padding: 0 2rem 3rem;}
    .navbar .wi{ border-bottom: solid 1px #e0e0e0;}
    #banner .swiper-slide div p em{ font-size: 1.6rem;}
    .col1 .txt{ padding: 2rem;}
    .banner1{ height: 120px;}
    .img dl.half1 dt{ width: 60%;}
    .navbar .logo{  font-size: 1.6rem; width: calc(100% - 40px); margin-left: 40px;}
    .navbar .logo::before{  width: 3rem; height: 3rem;}
    .col4{ flex-direction: column; margin: 4rem 0 2rem;}
    .col4 dl{ width: auto; margin: 8rem 2rem 2rem; border-radius:1rem;}
    .home h2,.home h3,.home h4{ padding: 0 2rem;}
    .home .picbox{ flex-direction: column; padding: 0 2rem;}
    .home .picbox div.c1{ width: 100%; margin-bottom: 2rem;}
    .home .picbox div.c2{ width: 100%; flex-direction: column-reverse; padding: 0; margin-bottom: -3rem;}
    .home .picbox div.c2 p{ width: 80%; position: relative;}
    .home .picbox div.c2 p:nth-child(2){ margin-left: auto;}
    .home .picbox div.c2 p:nth-child(1){ left: 0; bottom: 3rem;}
    #banner .swiper-slide div p{ padding-left: 2rem;}
    .c3.c4{ padding: 0; margin-bottom: 2rem;}
    .c3{ flex-direction: column; padding: 2rem 0; }
    .c3.c4,.c3.c5,.c3.c9{ flex-direction: row;}
    .c3 p{ width: 100%;}
    .c3.c4 p,.c3.c5 p{ width: calc(50% - 1rem);}
    .c3.c9 p{ width: calc(100% / 3 - 1rem);}
    .video{ margin:3rem 2rem;}
    .c8 div{ width: calc(100% - 0.8rem);}
    .c8 p{ padding: 0.5rem 1rem;}
    .c3.c9 img{ border-radius: 2rem;}
    .c3.c9 .lightense-wrap img{ border-radius: 2rem !important;}
    #banner .swiper-slide div p{ text-shadow: rgba(0, 0, 0, 0.5) 0 0 0.5rem;}
    .hline{ margin: 4rem 2rem;}
    .hline.hm{ margin: 4rem 2rem 2rem;}
    .hline h2{border-bottom: #dfc93a 0.1rem solid;padding: 0.6rem 0; }
    .hline h2 b{ font-size: 2rem; line-height: 2.4rem; color: #0e9393;}
    p.c7{ margin-top: 2rem;}
    .hline p{ padding-top: 0.8rem;}
}