@charset "gb2312";
@import "Noto Sans SC.css";
*{ margin:0px; padding:0px; border:0;}  
body { -webkit-text-size-adjust: 100%; }
html,body {width:100%; height:100%; margin:0px; padding:0; font:16px/1.5  'Noto Sans SC','Microsoft YaHei', arial, \5FAE\8F6F\96C5\9ED1, 'Hiragino Sans GB', sans-serif;  background:url(../images/bj.jpg) center top repeat-y; background-attachment:fixed; }
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,img,button,font,i {border:0;  padding:0; margin:0;  } 
li{list-style-type:none;list-style:none;}
img{vertical-align:top;border:0;}
h1,h2,h3,h4,h5,h6,p,em,i,b,span,font,div { margin:0; padding:0; font-weight:normal; font-style:normal;}
ol,ul {list-style:none;}
address,cite,code,th {font-weight:normal;font-style:normal;}
img:hover { opacity:1; filter: alpha(opacity=100); }
code, kbd, pre, samp { font-family: courier new, courier, monospace; }
small { font-size: 12px; }
legend { color: #000; }
fieldset, img { border: 0; }
button, input, select, textarea { font-size: 100%; }
.fl { float:left; }
.fr { float:right; }
a { color:#333; text-decoration:none; }
a:hover{ color:var(--color); text-decoration:none;}
.cl { clear:both;}
div,ul,li,h1,h2,h3,h4,h5,h6,dl,dd,dt,p,i,em,b,span,td,tr,font,strong { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }

:root {
--transition:all ease-out .3s 0s;
--color:#e2442c; /*主体色改这个颜色*/
--color2:rgba(255,255,255,1); 
--color3:#111; 
--color4:#d63223;
--bgcolor:rgba(255,255,255,.8);
--bgcolor2:#fff;
--bgcolor3:rgba(225,157,117,.75);
--bgcolor4:#eaddd4;	
--shadow: 0 2px 18px rgba(225,157,117,.4);
--text-shadow:0px 2px 8px rgba(0, 0, 0, .5); 
--radius: 20px;
}

.nav { padding:0 10px; position:fixed; top:0; left:0;  z-index:1000; background:linear-gradient(to left,#f05a3a 0,#c61815 100%);  }
.nav ul li { float: left;  }
.nav ul li a { display: inline-block; color:#fff; font-size:16px; line-height:50px; padding:0 22px; text-align:center; font-weight: 300;}
.nav ul li.cug a { background:linear-gradient(135deg,#e7141a 0,#ff6d26 100%); }
.nav ul li a:hover { background:linear-gradient(135deg,#e7141a 0,#ff6d26 100%); }
.nav ul li a:focus { background:linear-gradient(135deg,#e7141a 0,#ff6d26 100%); }
.nav .affer { position:absolute; width:0px; height:0px; top:0px; right:-35px; border-right:35px solid transparent;  border-top:50px solid #f05a3a;  }

.reveal { opacity:0; transform:translateY(50px);transition:opacity .7s ease,transform .7s ease; }
.reveal.in {opacity:1; transform:none}

.header { width:100%; margin:0 auto; height:100%; overflow:hidden;  z-index:99; position:relative;  background:url(../images/banner.jpg) center bottom no-repeat; background-size: cover;  }
.header .tit { width:100%; max-width: 1200px; margin: 0 auto;  text-align: center; padding:10vh 0 0 0; }
.header .tit img { max-height: 58vh;}

.arrows{width:60px;height:72px;position:absolute;left:50%;margin-left:-30px;bottom:70px}
.arrows path{stroke:#fffab8;fill:transparent;stroke-width:2px;animation:arrow 2s infinite;-webkit-animation:arrow 2s infinite}
@keyframes arrow{0%{opacity:0}
40%{opacity:1}
80%{opacity:0}
100%{opacity:0}
}
@-webkit-keyframes arrow{0%{opacity:0}
40%{opacity:1}
80%{opacity:0}
100%{opacity:0}
}
.arrows path.a1{animation-delay:-1s;-webkit-animation-delay:-1s}
.arrows path.a2{animation-delay:-0.5s;-webkit-animation-delay:-0.5s}
.arrows path.a3{animation-delay:0s;-webkit-animation-delay:0s}
.mobtop { display: none; }



.warp { width: 1200px; margin: 0 auto;  }


/*头条*/
.tt { width:100%; float:left; margin:50px 0 55px 0; }
.tt span { width:100%; float:left; font-size:42px; line-height:1.4; margin-bottom:15px; text-align:center; color:var(--color3); font-weight: 800; }
.tt span b { display:inline-block; background:var(--color4); margin:0 15px 8px 0; padding:0 18px; line-height:1.95; font-size:22px; color:#fff; border-radius:5px; vertical-align:middle; font-weight: 400; }
.tt p { width:100%; font-size:18px;  color:rgba(0,0,0,.8); float:left; line-height:1.5; text-align:center;  font-weight: 300; }


/*焦点图*/
.focus { width:55%; float: left;  border-radius: var(--radius); box-shadow:var(--shadow); overflow: hidden; }
.focus .swiper-container { width:100%; margin:0 auto; position:relative; overflow:hidden; z-index:1; height:394px;  }
.focus .swiper-wrapper { position: relative; width:100%;  height:100%;  z-index:1; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex;}
.focus .swiper-slide { width:100%; height:100%; position:relative; -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; }
.focus .swiper-slide li { width:100%; height:100%;  position: absolute; overflow:hidden; background-repeat:no-repeat; background-position:center center;  background-size: cover; }
.focus .swiper-slide li img { width:100%; height:100%; }
.focus .swiper-slide li span { width: 100%;  position:absolute; bottom:0; float:left; padding:20px 4% 50px 4%; font-size:22px; line-height:1.4; font-weight: 500; color:#fff; text-align:center;  text-shadow:1px 1px 5px rgba(0,0,0,.5); background:-webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,0)),to(rgba(0,0,0,.8)));  }
.focus .swiper-pagination { position:absolute; text-align:center;  z-index:10; bottom:0; padding:18px;  left:0; width:100%; }
.focus .swiper-pagination-bullet { width:12px; height:12px; display:inline-block; border-radius:100%; opacity:1;  border:2px solid #fff; border-radius:50px; cursor:pointer; margin:0 5px;  border:2px solid #fff;  transition:all ease-out .5s 0s; background:none; }
.focus .swiper-pagination-bullet-active{  width: 32px;  background:#ff6600; border:2px solid #ff6600;}

.focus .swiper-button-prev,.focus .swiper-button-next { width:50px; height:60px; top:50%; margin-top:-30px; cursor:pointer; position:absolute; z-index:99; text-align:center; line-height:60px; font-size:50px; color:#fff; font-family:"\5B8B\4F53";  font-weight:bold; text-shadow:1px 1px 5px rgba(0,0,2,.5); }
.focus .swiper-button-next { right:5px;}
.focus .swiper-button-prev { left:5px;}


/*新闻动态*/
.news { width:41%; float:right; margin-top: -10px;  }
.news ul li { width:100%; float:left; border-bottom:1px dotted rgba(0,0,0,.1); width:100%; padding:10px 0; }
.news ul li span { width:100%; float:left; font-size:18px; line-height:35px;  overflow:hidden; display: -webkit-box; -webkit-line-clamp: 1;-webkit-box-orient: vertical; background: url(../images/yuan.png) left center no-repeat; padding:0 0 0 25px;}
.news ul li a:hover { color: var(--color4); }

.more { float:right; margin-top:24px; }
.more a { display:inline-block; font-size:16px; color:#946c38; background:#fff; padding:0 25px; line-height:42px; border-radius: var(--radius); box-shadow:var(--shadow);  transition:var(--transition);  }
.more a:hover { color:#fff; background:linear-gradient(135deg,#c68e50 0,#dbac72 100%);   }




.lm { width:100%; float:left; padding:50px 0; text-align: center; }


/*我在温州过假期*/
.holiday { width: 100%; max-width: 1200px;  display:grid; gap:25px; grid-template-columns:repeat(2,1fr);  }
.holiday .card { background:#fff; overflow:hidden;  padding:20px; display:flex; flex-direction: row; /*方向为水平*/ align-items: center; border-radius: var(--radius); box-shadow:var(--shadow);  transition:var(--transition); }
.holiday .card:hover{ transform:translateY(-10px);  background:linear-gradient(135deg,rgba(225,157,117,.2), rgba(255,255,255,.8)); }
.holiday .card .photo { width: 32%; aspect-ratio: 16 / 10; object-fit: cover;  object-position: center; position:relative; display:flex; align-items:flex-end;  background-size:cover; background-position:center; }
.holiday .card .photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; z-index:0;  border-radius: 10px;}
.holiday .card .photo .cag { position:relative; z-index:1; font-size:14px; font-weight:300; color:#fff; background:rgba(0,0,0,.4); padding:6px 12px; border-radius:6px; backdrop-filter:blur(5px); display: none; }
.holiday .card .text { width: 68%; padding:0 28px; }
.holiday .card .text h3 {color:#111; font-size:20px; line-height: 1.5; font-weight: 500;  }
.holiday .card .text p { color:rgba(0,0,0,.8); line-height:1.7; font-size:16px; font-weight: 300; padding:12px 0 0 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:3; display: none;}
.holiday .card:hover .text h3 { color:var(--color4); }



/*我在温州走山海*/
.travel {width: 100%; max-width: 1200px;  display:grid; gap:30px; grid-template-columns:repeat(3,1fr);   }
.travel .card { background:#fff; overflow:hidden; display:flex; flex-direction:column; /*方向为垂直*/border-radius: var(--radius); box-shadow:var(--shadow);  transition:var(--transition);}
.travel .card:hover{ transform:translateY(-10px);  background:linear-gradient(135deg,rgba(225,157,117,.2), rgba(225,157,117,.02)); }
.travel .card .photo { aspect-ratio: 16 / 9; object-fit: cover; object-position: center;  position:relative; display:flex; align-items:flex-end; background-size:cover; background-position:center; }
.travel .card .photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; z-index:0;  border-radius: 10px 10px 0 0; }
.travel .card .photo .cag { position:relative; z-index:1; bottom:15px; left: 15px; font-size:14px; font-weight:300; color:#fff; background:rgba(0,0,0,.4); padding:6px 12px; border-radius:6px; backdrop-filter:blur(5px);  }
.travel .card .text { padding:20px 28px 28px;  }
.travel .card .text h3 {color:#111; font-size:20px; line-height: 1.5; font-weight: 500;  }
.travel .card .text p { color:rgba(0,0,0,.8); line-height:1.7; font-size:16px; font-weight: 300; padding:12px 0 0 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:3;}
.travel .card:hover .text h3 { color:var(--color4); }



/* 轮播-活动图集 */
.carousel-container {  position: relative;  width: 100%;  height:65vh;  display: flex;  justify-content: center;  align-items: center; overflow: hidden;  }
.carousel-container .slide { position: absolute; width: 60%;  height: 100%; overflow: hidden; transition: all 0.6s cubic-bezier(0.25, 1, 0.5, 1); opacity: 0; box-shadow:0 15px 40px rgba(0, 0, 0, 0.6);  pointer-events: none; /*border-radius: var(--radius); */ }
.carousel-container .slide img { width: 100%;  height: 100%;  object-fit: cover;   }
.carousel-container .slide-caption { position: absolute; bottom:0; left:0; width:100%; padding:35px 40px; background:linear-gradient(to top, rgba(0,0,0,0.85), transparent);  opacity: 0; transition: opacity 0.4s ease;  pointer-events: none; }
.carousel-container .slide-caption font { max-width: 80%; float: left;  color: #fff; font-size:24px; font-weight:500; line-height: 1.4; text-shadow:var(--text-shadow); }

/* 数字指示器 */
.carousel-container .slide-pagination { position: absolute; bottom:30px; right: calc(20% + 25px); font-size:16px; color: var(--color2); font-weight:100; background: rgba(0,0,0,.6); padding:10px 14px; border-radius:50px; opacity:0; transition: opacity 0.4s ease;  pointer-events: none;  z-index: 10; }
.carousel-container .slide-pagination span { line-height: 1.2; font-weight:500;font-size:18px; }
.carousel-container .slide-pagination span.current { color:var(--color); font-weight:900; font-size:19px;}

 /* 状态类 */
.carousel-container .slide.active { opacity: 1;  transform: translateX(0); z-index: 3; pointer-events: auto; filter: brightness(1); }
.carousel-container .slide.active .slide-caption { opacity: 1;}
.carousel-container .slide.prev { opacity:.5;  transform: translateX(-55%);   z-index: 2; filter: brightness(0.4);  }
.carousel-container .slide.next { opacity:.5;  transform: translateX(55%);  z-index: 2;  filter: brightness(0.4);   }

/* 当容器有 active 状态时，显示全局数字 */
.carousel-container .show-pagination .slide-pagination { opacity: 1; }

/* --- 左右箭头 --- */
.nav-arrow { position: absolute;  top: 50%; transform: translateY(-50%); width: 50px;  height: 50px; background:rgba(255,255,255,.15); border: 2px solid rgba(255, 255, 255, .4); border-radius: 50%; color: #fff; font-family:"\5B8B\4F53"; font-weight:bold; font-size:28px;  display: flex;  justify-content: center;  align-items: center;  cursor: pointer; z-index: 10;  transition:var(--transition);  user-select: none;  backdrop-filter: blur(10px);}
.nav-arrow:hover { background: rgba(255, 255, 255, 0.3); border-color:#fff; transform:translateY(-50%) scale(1.1); }
.nav-arrow.prev-btn { left:4%; }
.nav-arrow.next-btn { right:4%; }



.footer { width: 100%; float: left; background:linear-gradient(to right,#f05a3a 0,#c61815 100%);  padding:14px 0;  font-size: 17px; line-height: 1.6; color:rgba(255,255,255,.95); text-align: center;  }
.footer span { font-weight: 200; }
.footer span strong { font-weight: 500; margin-right:015px; display: inline-block; }
.footer font { font-weight: 200; }






/* -----------------------------------------------  移动端适配 -------------------------------------------------------------------- */

@media (max-width: 820px) {
:root {
--shadow: 0 2px 2vw rgba(225,157,117,.4);
--text-shadow:0px 2px 8px rgba(0, 0, 0, .5); 
--radius: 2vw;
}
	
.nav,.header { display: none; }
.mobtop { display:block; }		
.mobtop img { width: 100%; }	
	
	
.warp { width:100%; padding:0 5%; }	
	
/*头条*/
.tt { width:100%; float:left; margin:6% 0;   }
.tt span { width:100%; float:left; font-size:5vw; line-height:1.3em; margin-bottom:2.5vw; font-weight: 700;  }
.tt span b { margin-bottom:5px; padding:0 2.5vw; line-height:2em; font-size:3.5vw; margin-right:2.5vw; font-weight: 300; }
.tt p { font-size:3.5vw; line-height:1.6em;  }
	

/*焦点图*/
.focus { width:100%; margin-bottom:3vw;  }
.focus .swiper-container { height:55vw;  }
.focus .swiper-slide li span { padding:5vw 5% 10vw 5%; font-size:4.5vw; line-height:1.3;  text-align: center;   }
.focus .swiper-pagination {  padding:3vw;  }


.focus .swiper-button-prev,.focus .swiper-button-next { width:10vw; height:10vw;  margin-top:-5vw; line-height:1; font-size:10vw;  }
.focus .swiper-button-next { right:5px;}
.focus .swiper-button-prev { left:5px;}


/*新闻动态*/
.news { width:100%; margin-top: 0;  }
.news ul li { width:100%; float:left; border-bottom:1px dotted rgba(0,0,0,.1); width:100%; padding:2.75vw 0; }
.news ul li span { font-size:3.75vw; line-height:1.4;  -webkit-line-clamp: 3; background: url(../images/yuan.png) left 1.5vw no-repeat; padding:0 0 0 25px;}
.news ul li a:hover { color: #333; }

.more { float:right; margin-top:4vw; }
.more a { font-size:3.75vw;  padding:0 4vw; line-height:2.4;  }
.more a:hover { color:#946c38; background:#fff;  }

	

.lm { padding:5vw 0; }
.lm img { max-width: 55%;}



	
/*我在温州过假期*/
.holiday { max-width: 100%; gap:4vw; grid-template-columns:repeat(1,1fr);  }
.holiday .card { padding:3vw 3.5vw; }
.holiday .card:hover{ transform:translateY(0px);  background:#fff;}
.holiday .card .photo { width: 32%; aspect-ratio: 16 / 10;  }
.holiday .card .photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; z-index:0;  border-radius: 2.5vw; }
.holiday .card .text { width: 68%; padding:0 5vw; }
.holiday .card .text h3 {  font-size:3.75vw; line-height: 1.6; font-weight:400; }
.holiday .card .text p {  line-height:1.6; font-size:3.5vw; padding:2vw 0 0 0;  -webkit-line-clamp:5; display: none ;}
.holiday .card:hover .text h3 { color:#111; }



/*我在温州走山海*/
.travel { max-width: 100%; gap:4vw; grid-template-columns:repeat(1,1fr);  }
.travel .card:hover{ transform:translateY(0px);  background:#fff; }
.travel .card .photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; z-index:0;  border-radius: 2.5vw 2.5vw 0 0; }
.travel .card .text { padding:4vw 5vw;  }
.travel .card .text h3 { font-size:4.25vw; line-height: 1.5;  }
.travel .card .text p { line-height:1.6; font-size:3.5vw; padding:2vw 0 0 0;  -webkit-line-clamp:5; }
.travel .card:hover .text h3 { color:#111; }

	

/* 轮播-活动图集 */
.carousel-container { width: 90%; height:55vw; margin:0 5% 5vw 5%; overflow: hidden; border-radius: var(--radius); box-shadow:var(--shadow); }
.carousel-container .slide { width: 100%;  }
.carousel-container .slide-caption { padding:4vw 5vw; }
.carousel-container .slide-caption font { max-width: 95%;  font-size:4.5vw; font-weight:400; }
.carousel-container .slide-pagination { display: none;}

/* 左右箭头 */
.nav-arrow { width:9vw; height: 9vw; font-size:5vw;  background:rgba(0,0,0,.2); border: 1px solid rgba(255, 255, 255, .7);  top:46%;}
.nav-arrow:hover { background:rgba(0,0,0,.2); border: 1px solid rgba(255, 255, 255, .7);  transform: translateY(-50%) scale(1); }
.nav-arrow.prev-btn { left: 3vw; }
.nav-arrow.next-btn { right: 3vw; }

	



.footer {  padding:2.75vw 2%;  font-size: 3.5vw; line-height: 1.6;  }
.footer span { width: 100%; float: left; text-align: center; font-weight: 200; }
.footer span strong { ; margin-right:2vw; }
.footer font { width: 100%; float: left; text-align: center;  font-weight: 200; display:none; }
	
}