/*介绍风格1开始*/
.container_mudidi_xiangqing01_all{
width:100%;

background-image: url(/img/bg/27.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;



padding:50px 0}

.container_mudidi_xiangqing01 {
max-width: 1200px;
margin: 20px auto; 			

}
/* 图文模块 */
.premium-section {
background: #ffffff;
border-radius: 20px;
padding: 100px 120px;
box-shadow: 0 40px 80px rgba(45, 55, 72, 0.08);
display: flex;
align-items: center;
gap: 90px;
position: relative;
overflow: hidden;
border: 1px solid rgba(0, 0, 0, 0.04);
}
/* 背景装饰 - 右上角变淡 */
.premium-section::before {
content: "";
position: absolute;
top: -140px;
right: -140px;
width: 360px;
height: 360px;
background: radial-gradient(circle, rgba(31, 95, 139, 0.06), rgba(31, 95, 139, 0) 70%);

/* 提升到独立合成层，避免频繁重绘光栅 */
will-change: background;
/* 或者用 transform  hack（兼容性更好） */
transform: translateZ(0);


border-radius: 50%;
z-index: 0;
}
/* 背景装饰 - 左下角变淡 */
.premium-section::after {
content: "";
position: absolute;
left: -100px;
bottom: -100px;
width: 260px;
height: 260px;
background: radial-gradient(circle, rgba(31, 41, 55, 0.04), rgba(31, 41, 55, 0) 70%);

/* 提升到独立合成层，避免频繁重绘光栅 */
will-change: background;
/* 或者用 transform  hack（兼容性更好） */
transform: translateZ(0);

border-radius: 50%;
z-index: 0;
}
/* 图文位置互换 */
.premium-section.reverse {
flex-direction: row-reverse;
}
.text-side {
position: relative;
z-index: 1;
flex: 6;
min-width: 0;
}
.image-side {
position: relative;
z-index: 1;
flex: 4;
min-width: 280px;			

}
/* 文字区 */
.eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
font-size: 13px;
color: #1F5F8B;
letter-spacing: 3px;
text-transform: uppercase;
margin-bottom: 24px;
}
.eyebrow::before {
content: "";
width: 40px;
height: 1px;
background: linear-gradient(90deg, #1F5F8B, transparent);
}
.text-side h2 {
font-size: 30px;
font-weight: 700;
color: #111827;
line-height: 1.45;
margin-bottom: 28px;
letter-spacing: -0.5px;
}
.text-side h2 span {
color: #0049a3;
}
.text-side h2 strong {
color: #0049a3; /*#1F5F8B;*/
}
.lead {
font-size: 17px;
color: #4b5563;
margin-bottom: 20px;
font-weight: 500;
}
.text-side p {
font-size: 15px;
color: #6b7280;
margin-bottom: 16px;
line-height:1.8;
}
.highlight-list {
list-style: none;
margin: 32px 0 40px;
}
.highlight-list li {
position: relative;
padding-left: 28px;
margin-bottom: 14px;
color: #374151;
font-size: 15px;
}
.highlight-list li::before {
content: "";
position: absolute;
left: 0;
top: 5px;
width: 10px;
height: 10px;
border-radius: 50%;
background: #0049a3;/*#1F5F8B;*/
box-shadow: 0 0 0 4px rgba(31, 95, 139, 0.18);
}
.btn_fg1-row {
display: flex;
gap: 18px;
flex-wrap: wrap;

}
.btn_fg1 {
display: inline-block;
padding: 10px 36px;
border-radius: 999px;
font-size: 14px;
font-weight: 500;
text-decoration: none;
transition: all 0.4s ease;
border: none;
cursor: pointer;
}
.btn_fg1-gold {
background: linear-gradient(90deg, #0049a3, #1F5F8B);
color: #fff;
box-shadow: 0 12px 24px rgba(31, 95, 139, 0.25);
margin-right:15px;
}
.btn_fg1-gold:hover {
transform: translateY(-4px);
box-shadow: 0 18px 32px rgba(31, 95, 139, 0.35);
}
.btn_fg1-light {
background: #fff;
color: #1f2937;
border: 1px solid #e5e7eb;
}
.btn_fg1-light:hover {
border-color: #1F5F8B;
color: #1F5F8B;
transform: translateY(-4px);
}
/* 图片区 */
.image-frame {
position: relative;
}
.image-frame img {
width: 100%;
height: 480px;
object-fit: cover;
border-radius: 16px;
box-shadow: 0 30px 60px rgba(45, 55, 72, 0.25);
transition: transform 0.7s ease;
}
.image-frame img:hover {
transform: scale(1.02);
}
/* 边框右上角偏移 */
.image-frame::before {
content: "";
position: absolute;
top: -18px;
right: -18px;
bottom: 18px;
left: 18px;
border: 1px solid rgba(31, 95, 139, 0.45);
border-radius: 16px;
z-index: -1;
}
/* 模块间距 */
.premium-section + .premium-section {
margin-top: 25px;
}
/* 平板 */
@media (max-width: 1024px) {
.premium-section {
padding: 70px 50px;
gap: 60px;
}
.text-side h2 {
font-size: 36px;
}
.image-frame img {
height: 400px;
}
}
/* 手机 */
@media (max-width: 768px) {	

.btn_fg1-gold{ margin-right:0px;}

.container_mudidi_xiangqing01_all {
padding: 30px 0 10px 0;
margin-top:0px;

background-image: url(/img/bg/24.jpg);


}

.btn_fg1-row {
display: flex;
gap: 18px;
flex-wrap: wrap;
justify-content: center; /* 水平居中（换行也保持居中，你要的） */
align-items: center;     /*  垂直居中，可选 */
padding-bottom:10px;
}	



.text-side {
padding-bottom:25px;
border-bottom:1px #cccccc dashed;
margin-bottom: 10px;

}
.premium-section {
box-shadow: 0 10px 20px rgba(45, 55, 72, 0.08);
}

.highlight-list {
margin: 15px 0 25px;
}


.text-side p {
font-size: 14px;
color: #6b7280;
margin-bottom: 10px;
line-height: 1.8;
}

.highlight-list li {
padding-left: 20px;
font-size: 14px;
margin-bottom: 8px;
color: #6b7280;
}

.btn_fg1 {
display: inline-block;
padding: 8px 23px;
border-radius: 22px;
font-size: 13px;
}

.container_mudidi_xiangqing01 {
margin: 20px auto 0px auto;
padding: 0 10px;
}
.premium-section,
.premium-section.reverse {
flex-direction: column;
padding: 50px 30px;
gap: 0px;
}
.premium-section + .premium-section {
margin-top: 20px;
}
.text-side h2 {
font-size: 25px;
text-align: center;
line-height: 1.2;
}

.image-frame {
position: relative; /* 必须加！伪元素定位参照这个容器 */
display: inline-block; /* 让容器贴合图片尺寸，而不是撑满整行；如果要占满一行就换成 block */
}
.image-side{
text-align: center;
/*background-color: #f8fafc;/*#f5f8fa;*/ 
background-color: #f7faff;
background-image: radial-gradient(rgba(31, 95, 139, 0.04) 1px, transparent 1px);
padding: 35px 15px 15px 15px;
border-radius: 16px;
}



.image-frame img {
max-height: 265px;
}
.image-frame::before {
top: -12px;
right: -12px;
bottom: 20px;
left: 12px;
}
}
/*风格1结束*/



/*风格2开始*/

.container_mudidi_xiangqing02_all{
width:100%;
background-image: url(/img/bg/22.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
padding:50px 0 50px 0}
.container_mudidi_xiangqing002 {
max-width: 1200px;
margin: 0px auto 20px auto;

}

/* 图文外层盒子 */
.text-img-wrap {
display: flex;
align-items: center;
gap: 80px;
background: #ffffff;
padding: 80px 120px;
border-radius: 20px;
box-shadow: 0 12px 48px rgba(60, 70, 80, 0.10);
transition: all 0.4s ease;
min-height:450px;			
}

.text-img-wrap:hover {
box-shadow: 0 18px 60px rgba(60, 70, 80, 0.14);
/*transform: translateY(-4px);*/
}

/* 反转类：图片在左边，文字在右边 */
.text-img-wrap.reverse {
flex-direction: row-reverse;
}

.text-box{flex: 5.5;}
.img-box {flex: 4.5;}

.text-box h2 {
font-size: 26px;
color: #0049a3;/*#083d81;*/
margin-bottom: 22px;
font-weight: 700;
letter-spacing: 0px;
position: relative;
display: inline-block;
line-height:1.5;
}



/* 标题左下方装饰线 + 灰色阴影 */
.text-box h2::after {
content: "";
position: absolute;
left: 0;
bottom: -6px;
width: 60px;
height: 2px;
background: linear-gradient(90deg, #1F5F8B, transparent);
border-radius: 3px;
box-shadow: 0 6px 14px rgba(80, 90, 100, 0.25);
}

.text-box, .text-box p, .text-box div, .text-box br {
font-size: 15px;
color: #586674;
margin-bottom: 10px;
line-height:1.7;
}

/* 按钮 */
.text-box .btn {
display: inline-block;
margin-top: 16px;
padding: 8px 32px;
background: linear-gradient(90deg, #0049a3, #2c78ac);
color: #fff;
text-decoration: none;
border-radius: 999px;
font-size: 14px;
transition: all 0.3s ease;
}
/* hover：向上微移 */
.text-box .btn:hover {
transform: translateY(-3px);
box-shadow: 0 6px 14px rgba(80, 90, 100, 0.25);
}



/* 图片容器：定位父级，装饰边框固定不动 */
.img-box {
position: relative;
display: block;
}

/* 背后装饰边框：固定位置，hover不移动！ */
.img-box::before {
content: "";
position: absolute;
top: -20px;
right: -20px;
width: 100%;
height: 100%;
border: 2px solid rgba(31, 95, 139, 0.3);
border-radius: 16px;
z-index: 0;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.14);
transition: none;
}

/* 反转时，装饰边框偏移到左上方 */
.text-img-wrap.reverse .img-box::before {
right: auto;
left: -20px;
}

.img-box img {
position: relative;
display: block;
width:  100%;
max-height:315px;
border-radius: 16px;
object-fit: cover;
z-index: 1;
box-shadow: 0 16px 34px rgba(60, 70, 80, 0.16);
transition: transform 0.6s ease, box-shadow 0.6s ease;
}

/* 只放大图片，边框不动 */
.img-box:hover img {
transform: scale(1.03);
box-shadow: 0 22px 44px rgba(60, 70, 80, 0.22);
}

/* 响应式：768px以下，上下堆叠 */
@media (max-width: 768px) {

.btn-row {
display: flex;
justify-content: center;
gap: 16px; /* 按钮之间空隙 */
}


.img-box img {max-height: 250px;}

.text-box {

padding-bottom: 20px;
border-bottom: 1px #cccccc dashed;

display: flex;
flex-direction: column;
align-items: center;

}
.text-box .btn {padding: 7px 52px;}	

.text-box, .text-box p, .text-box div, .text-box br {
font-size: 14px;
color: #6b7280;
margin-bottom: 5px;
line-height:1.8;
text-align:left
}


.container_mudidi_xiangqing002 {
margin: 20px auto 20px auto;
padding: 0 10px
}

.text-img-wrap,
.text-img-wrap.reverse {
flex-direction: column;
gap: 40px;
padding: 36px 28px;
}

.text-box h2 {
font-size: 20px;
margin-bottom: 35px;
position: relative;
}

.text-box h2::after {
width: 51px;
bottom: -15px;
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);    
height: 3px;
background: #1F5F8B; /* 纯色，去掉渐变 */
border-radius: 3px;
box-shadow: 0 -1px 2px rgba(255,255,255,0.4), 0 1px 2px rgba(0,0,0,0.2);
}




/* 移动端装饰边框固定偏移 */
.img-box::before {
top: -14px;
right: -14px;
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.12);
}

.text-img-wrap.reverse .img-box::before {
right: auto;
left: -14px;
}
}
/*风格2结束*/

/*风格3开始*/
.kongbai-section {
background: #ffffff;
border-radius: 20px;
padding: 70px 80px 60px 80px;
box-shadow: 0 40px 80px rgba(45, 55, 72, 0.08);   
align-items: center;    
position: relative;
overflow: hidden;
border: 1px solid rgba(0, 0, 0, 0.04);
line-height:1.7;
font-size:15px;
color:#555;
}

/* 背景装饰 - 右上角变淡 */
.kongbai-section::before {
content: "";
position: absolute;
top: -140px;
right: -140px;
width: 360px;
height: 360px;
background: radial-gradient(circle, rgba(31, 95, 139, 0.06), rgba(31, 95, 139, 0) 70%);

/* 提升到独立合成层，避免频繁重绘光栅 */
will-change: background;
/* 或者用 transform  hack（兼容性更好） */
transform: translateZ(0);

border-radius: 50%;
z-index: 0;
}
/* 背景装饰 - 左下角变淡 */
.kongbai-section::after {
content: "";
position: absolute;
left: -100px;
bottom: -100px;
width: 260px;
height: 260px;
background: radial-gradient(circle, rgba(31, 41, 55, 0.04), rgba(31, 41, 55, 0) 70%);

/* 提升到独立合成层，避免频繁重绘光栅 */
will-change: background;
/* 或者用 transform  hack（兼容性更好） */
transform: translateZ(0);

border-radius: 50%;
z-index: 0;
}


@media (max-width: 768px) {
.kongbai-section {
background: #ffffff;
border-radius: 20px;
padding: 30px 25px 30px 25px;    
line-height: 1.7;
font-size: 14px;
margin-bottom:10px;

}
}
/*风格3结束*/






/*风格4开始=========================*/
.group_travel_with_xq_all{
width:100%;
background-image: url(/img/bg/92.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
padding:50px 0}
.group_travel_with_xq{
padding: 48px 0px 0px 0px;
max-width: 1200px;
margin: 0 auto;
}
.bai_yuan{
padding:40px 80px 40px 80px;
background-color:#FFFFFF;
border-radius: 16px;
box-shadow: 0 40px 80px rgba(45, 55, 72, 0.08);
align-items: center;
position: relative;
overflow: hidden;
margin-bottom:20px;
overflow: hidden;  
}
/* 背景装饰 - 右上角变淡 */
.bai_yuan::before {
content: "";
position: absolute;
top: -140px;
right: -140px;
width: 300px;
height: 300px;
background: radial-gradient(circle, rgba(31, 95, 139, 0.06), rgba(31, 95, 139, 0) 70%);

/* 提升到独立合成层，避免频繁重绘光栅 */
will-change: background;
/* 或者用 transform  hack（兼容性更好） */
transform: translateZ(0);

border-radius: 50%;
z-index: 0;
}
/* 背景装饰 - 左下角变淡 */
.bai_yuan::after {
content: "";
position: absolute;
left: -100px;
bottom: -100px;
width: 200px;
height: 200px;
background: radial-gradient(circle, rgba(31, 41, 55, 0.04), rgba(31, 41, 55, 0) 70%);

/* 提升到独立合成层，避免频繁重绘光栅 */
will-change: background;
/* 或者用 transform  hack（兼容性更好） */
transform: translateZ(0);

border-radius: 50%;
z-index: 0;
}
/* ===== 通用区块样式 ===== */
.xdok_travel-section {
display: grid;
/* 默认：1fr 文字 + 500px 图片 */
grid-template-columns: 1fr 500px;
gap: 50px;
align-items: start;
padding:40px 0;
margin:auto;
}
/* 默认【不加reverse】：文字左，图片右 */
.xdok_travel-section .xdok_section-text {
order: 1;
}
.xdok_travel-section .xdok_img-box {
order: 2;
width: 500px;
}
/* 加上 reverse：调换顺序，图片左，文字右 */
.xdok_travel-section.reverse {
grid-template-columns: 500px 1fr;
}
.xdok_travel-section.reverse .xdok_img-box {
order: 1;
width: 500px;
}
.xdok_travel-section.reverse .xdok_section-text {
order: 2;
}
.xdok_img-box img {
border-radius: 10px;
width:100%;
}
/* 图片固定宽高 */
.xdok_travel-section .xdok_section-img {
width: 500px;
height: 300px;
object-fit: cover;
;
}
.xdok_section-text h2 {
font-size: 24px;
margin-bottom: 12px;
color: #111827;
}
.xdok_section-text h2 strong {
color: #0049a3;
}
/* ========== 核心修改：把原来的class选择器改成标签选择器 ========== */
/* 原来 .xdok_desc / .xdok_descok 改成直接选中p标签 */
.xdok_section-text p {
font-size: 14px;
color: #444;
line-height: 1.7;
}
.xdok_section-text p:first-of-type {
margin-bottom: 13px;
}
.xdok_section-text p:last-of-type {
margin-top: 13px;
}

/* 原来 .xdok_check-list.xdok_wrap-by-line-height 改成选中ul标签 */
.xdok_section-text ul {
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 6px 16px;
grid-template-columns: unset;
}
.xdok_section-text ul > li {
flex: 0 0 calc(50% - 8px);
white-space: normal;
font-size: 15px;
margin: 6px 0;
padding-left: 20px;
position: relative;
}
.xdok_section-text ul > li::before {
content: "✓";
position: absolute;
left: 0;
color: #083d81;
font-weight: bold;
}
/* 强制通栏li保留（如果你后续要用到） */
.xdok_section-text ul > li.force-full {
flex: 0 0 100%;
}
/* ====================================== */

/* ========== 移动端样式（768px以下） ========== */
@media (max-width:768px) { 

.group_travel_with_xq_all {
padding: 50px 0 5px 0;
}


.bai_yuan{margin: 20px 2px; }
.xdok_section-text h2 {
font-size: 20px;
}
.group_travel_with_xq{
padding: 0px 10px 0px 10px;
}
.xdok_travel-section.reverse .xdok_img-box,
.xdok_travel-section .xdok_img-box {
width: 100%;
padding-top:20px
}


.xdok_img-box img {
width: 100%;
max-height: 140px;
object-fit: unset;
}		           
.xdok_steps-wrap {
flex-direction: column;
gap: 32px;
}
.xdok_step-item {
max-width: unset;
text-align: left;
padding-bottom: 24px;
border-bottom: 1px solid #eee;
display: flex;
align-items: flex-start;
gap:12px;
}
.xdok_step-item:last-child {
border-bottom: none;
}
.xdok_step-icon {
flex-shrink: 0;
margin-bottom:0;
}
/* 移动端：图片永远在上，文字在下 */
.xdok_travel-section,
.xdok_travel-section.reverse {
grid-template-columns: 1fr;
gap: 20px;
display: flex;
flex-direction: column;
padding:0 5px;				
}
.xdok_travel-section .xdok_img-box,
.xdok_travel-section.reverse .xdok_img-box {
order: 1;
}
.xdok_travel-section .xdok_section-text,
.xdok_travel-section.reverse .xdok_section-text {
order: 2;
}
.xdok_travel-section {    
margin-bottom: 10px;
}
/* 移动端ul改成单列 */
.xdok_section-text ul {
display: grid;
grid-template-columns: 1fr;
}
.xdok_section-text ul > li {
flex: unset;
}
}
/*风格4结束*/