@charset "UTF-8";
*,*::before,*::after{box-sizing:border-box;margin: 0;padding: 0;}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}ul,ol{margin:0;padding:0;list-style:none}picture,video,canvas,svg{display:block;max-width:100%;height:auto}input,button,textarea,select{font:inherit;letter-spacing:inherit;word-spacing:inherit;color:inherit}input:not([type="checkbox"]):not([type="radio"]),textarea,select{font-size:16px!important}button{cursor:pointer;border:none;background:none;padding:0}a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}table{border-collapse:collapse;border-spacing:0;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3}blockquote{quotes:none}blockquote::before,blockquote::after{content:''}code,pre{font-family:"Courier New",monospace}hr{border:none;border-top:1px solid #e5e7eb;margin:1rem 0}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.clearfix::after{content:'';display:table;clear:both}*{-webkit-tap-highlight-color:transparent}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}
:root {
  --max-width: 1380px;        
  --gutter: 40px;              
  --gap-sm: 16px;
  --gap-md: 24px;
  --gap-lg: 40px;
  
  --color-primary: #1a3c6e;   
  --color-accent: #c41a1a;
  --color-text: #222;
  --color-text-light: #666;
  --color-bg: #f5f7fa;
  
  --font-base: 16px;
  --font-family: system-ui, "Microsoft YaHei", sans-serif;
}
body {
  font-family: var(--font-family);
  font-size: var(--font-base);
  color: var(--color-text);
  background: #fff;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a{color: var(--color-text);text-decoration: none; transition: color 0.3s;}
a:hover{var(--color-accent);}
img{max-width:100%;height:auto;}
ul,ol {  list-style: none;}
button,input,select,textarea {  font: inherit; border: none; outline: none;}


/*--- box ---*/
.wrapper-box{background-color: #f4f6f5; padding: 50px 0;}
.wrapper {  max-width: var(--max-width); margin: 0 auto; padding: 0 var(--gutter); width: 100%;}
.grid-3-1{ display: grid; grid-template-columns: 346px 1fr; gap: 40px; min-width: 0; max-width: 100%;}
.sider-box{background: url(../images/kaoyan-siderbg.png) no-repeat;min-height: 570px;}
.main-box { overflow: hidden;background-color: #fff; padding: 30px;}
.banner-kaoyan { width: 100%;  height: 499px;  background: url('../images/kaoyan-banner.jpg') no-repeat center center; background-size: cover;}
.go-home{ text-align: right; padding-top: 15px;}
/* 基础样式 */
/* .li-item-kaoyan { min-width: 0; width: 100%;} */
.li-item-kaoyan li {
  display: flex;
  align-items: center;
  padding: 15px 0;
  padding-left: 35px;
  border-bottom: 1px #dadada dashed;
  transition: background 0.2s;
  position: relative;
  /* min-width: 0; */
  gap: 12px;
}

.li-item-kaoyan a {
  flex: 1 1 0%;
  min-width: 0;
  color: #2a3a5a;
  padding: 3px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.li-item-kaoyan a:hover {
  color: var(--color-accent);;
}

.li-item-kaoyan span {
  font-size: 14px;
  color: #8a9bb5;
  white-space: nowrap;
  flex-shrink: 0;
}

.li-item-kaoyan li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background:url(../images/dot-bs.png) left center no-repeat;
  border-radius: 50%;
  flex-shrink: 0;
}

.kaoyan-fengcai{ padding-top: 40px;}

.li-case{}
.li-case .list-card{   box-sizing: border-box;   height:100%;   width:100%; padding:10px; background-color: #fff;}
.li-case .list-card .list-img img{ width: 100%;  }


.qh-btn{  margin-top: 16px;  text-align: center;}
.qh-btn div{  background-color: #ebebeb;  opacity: 1;  width: 42px;  height: 40px;  line-height: 40px;  text-align: center; border-radius: 0px; color: #d71d06;display: inline-block;zoom: 1; font-size: 20px; cursor: pointer;}
.qh-btn div:hover{ background-color: #d71d06; color: #fff;}

.footer{  background:url(../images/kaoyan-footerbg.png) left center no-repeat; border-top: 10px solid #f7c75b; padding: 30px 0; }
.footer-content{display: flex;justify-content: space-between; font-size: 15px;align-items: center;}
.erweima dl{ color: #fff; text-align: center;}
/* -- bread -- */
.main-box-head,.current-column{display: flex;justify-content: space-between;  align-items: center;}
.main-box-head{ border-bottom: 1px solid #ddd; padding-bottom: 12px;}
.current-column span{ margin-left: 8px; font-size: 22px; color: #d81e06;}
.breadcrumb,.breadcrumb a { color: #666;font-size: 13px; }
/* --- sider --- */
.sider-menu{padding: 30% 15% 0 15%;}
.sider-menu ul{ display: flex; gap: 6px;flex-direction: column; }
.sider-menu ul li{border-radius: 4px;background: linear-gradient(to right, #fff6e7, #fee2b3,#fff6e7);}
.sider-menu ul li a{ display: block; line-height: 2.4; font-size: 19px; font-weight: bold;  text-align: center;padding: 0 10px;  }
.sider-menu ul li:hover{background: linear-gradient(to right, #ff3833, #ff972e);}
.sider-menu ul li:hover a{ color: #fff;}
/*---- page ---- */
.pagination {padding-top: 20px;width:100%;text-align: center; font-size: 14px;}
.pagination ul{display: inline-block;}
.pagination li {display: inline-block; margin-right:10px; line-height: 40px; height: 40px;}
.pagination li:last-child{margin-right:0px;}
.pagination li a,.pagination li span {display: block;color: #555;background-color: #f3f3f3;padding:0 15px;}
.pagination li a:hover,.pagination li a:focus,.pagination li span:hover,.pagination li span:focus {background-color: #d7d7d7;}
.pagination .active a,.pagination .active a:hover,.pagination .active a:focus,.pagination .active span,.pagination .active span:hover,.pagination .active span:focus {background-color: #d7d7d7;}
/* 大屏显示完整图片 */
@media (min-width: 1920px) {
  .banner-kaoyan {
    height: 500px;
  }
}

/* 中等屏幕 */
@media (max-width: 1366px) {
  .banner-kaoyan {
    height: 400px;
  }
}

/* 平板 */
@media (max-width: 768px) {
  .banner-kaoyan {
    height: 240px;
  }
}

/* 手机 */
@media (max-width: 480px) {
  .banner-kaoyan {
    height: 140px;
  }
}
/* 响应式设计 */
@media (max-width: 1024px) {
  .grid-3-1 {
      grid-template-columns: 240px 1fr;
      gap: 30px;
  }
  .sider-box{background: url(../images/kaoyan-m-siderbg.png) no-repeat;min-height: 570px;}
  .sider-menu ul li a{ font-size: 16px;line-height: 1.8;}
}

@media (max-width: 768px) {
  .wrapper-box{ padding:1.2rem 0;}
  .kaoyan-fengcai{ padding-top:1.2rem;}
  .go-home img{ width:100px;}
  .grid-3-1 { grid-template-columns: 1fr;  gap: 20px; height: auto;}
  .wrapper{ padding:0 1rem;}
  .main-box{padding:1.2rem;}
  .sider-box { display: none;}
  .li-item-kaoyan li { padding: 12px 0; padding-left: 30px;}
}

@media (max-width: 480px) {
  .go-home img{ width:60px;}
  .go-home{ padding-top:3px; display:none;}
  .li-item-kaoyan li {  flex-wrap: wrap; gap: 8px;}
  .li-item-kaoyan a {  flex: 1 1 100%;  min-width: 0; white-space: normal;  word-break: break-word; }
  .li-item-kaoyan li::before{top:30px;}
  .li-item-kaoyan span { flex: 0 0 auto; margin-left: auto; }
  .foot-logo img{ width:90%}
}