关于我们/业务介绍

直接使用代码

图片素材

css代码

 <style>
.insure-int { margin-top:100px; margin-bottom:100px;}
.insure-int .wen { text-align:center; color:#81d8cf}
.insure-int .wen p { font-size:22px; padding-top:80px; line-height:25px; letter-spacing:5px;}
.insure-int .wen h1 { font-size:46px; letter-spacing:10px;}
.insure-sug { background:url(http://www.bootfastui.cn/img/2021/0423/bg.png) no-repeat center; height:650px; padding-top:179px; color:#fff; padding-left:120px; padding-right:120px; }
.insure-sug h1 { text-align:center; margin:30px auto;}
.insure-sug p { font-size:20px; line-height:40px; letter-spacing:5px; }
.in-af-ser { margin:50px auto;}
.in-af-ser .tit { color:#489090; text-align:left; background:url(http://www.bootfastui.cn/img/2021/0423/bg_1.png) no-repeat center; height:200px; padding-top:58px;}
.in-af-ser .tit h1 { border-left:#489090 solid 4px; margin-left:30px; padding-left:20px; line-height:50px; letter-spacing:10px;font-size:35px; }
.in-af-ser  .item {height:150px;border:#e1e1e1 solid 1px;  border-radius:10px; margin-bottom:20px;}
.in-af-ser  .b1 { background:url(http://www.bootfastui.cn/img/2021/0423/ser_1_1.png)  no-repeat -5px;  background-size:auto 100%; }
.in-af-ser  .item p { margin-left:350px; margin-top:60px; font-size:20px; color:#666666; letter-spacing:3px;padding-right:10px}
.in-af-ser  .b2  p {margin-top:50px; }
.in-af-ser  .b3 p { margin-top:40px;}
.in-af-ser  .b4 p { margin-top:30px;}
.in-af-ser  .b2 { background:url(http://www.bootfastui.cn/img/2021/0423/ser_2.png)  no-repeat -5px;  background-size:auto 100%;  }
.in-af-ser  .b3 { background:url(http://www.bootfastui.cn/img/2021/0423/ser_3.png)  no-repeat -5px;  background-size:auto 100%;  }
.in-af-ser  .b4 { background:url(http://www.bootfastui.cn/img/2021/0423/ser_4.png)  no-repeat -5px;  background-size:auto 100%;  }

.tab-nav{height:100px;background: #f6f6f6;text-align: center}
.tab-nav .nav-item{display:inline-block;padding:6px 30px;margin:25px;color:#000;font-size:25px;cursor: pointer;}
.tab-nav .current{color:#fff;background: #dd7c6a;}
.tab-body{display:none;padding:20px 0;font-size:16px}
.body-list:first-child{display: block}
</style>

HTML+JS代码

 
<div class="container">
  <div class="insure-int" style="margin-top:20px">

    <div class="col-md-5">
      <div class="wen">
        <p>PUBLIC <br>LIABILITY INSURANCE<br><br><br>河南省校外艺术培训机构</p>
        <h1> 公众责任险</h1>
      </div>
    </div>
    <div class="col-md-7 pm">
      <img src="/Public/images/img21.jpg" width="100%" alt="">
    </div>
    <div class="clear"></div>

  </div>
  <div class="insure-sug " style="margin-top:-120px">
    <h1>保险介绍</h1>
    <p>
      目前河南省有各种类型的艺术培训机构上万所。这些培训机构普遍是：特定时间内人员较为密集且培训对象以未成年人为主。容易出现拥挤、打闹、踩踏等意外事故以及特定专业训练中发生骨折、摔伤、磕碰等意外风险。一旦出现意外不管是不是培训机构的责任，都可能会对培训机构造成名誉损失和不可预估的经济损失。
    </p>
    <div class="clear"></div>
  </div>
  <div class="in-af-ser" style="margin-top:-30px">
    <div class="tit ">
      <h1>协会后续服务</h1>
    </div>
    <div class="item b1">
      <p>为机构负责人提供解答保险相关问题的服务。</p>
    </div>
    <div class="item b2">
      <p class="pad-top10">为机构购买保险时提供投保主体的服务和核实机构地点、确认其真实性的服务。</p>
    </div>
    <div class="item b3">
      <p class="pad-top15">在保单生效后，协会为机构提供核实证明保险期内变更地址的服务。</p>
    </div>
    <div class="item b4">
      <p class="pad-top10">产生理赔时，协会专人对接跟踪保险公司理赔进程，出具相关证明文件，为机构提供相关理赔服务。</p>
      </p>
    </div>
    <!--介绍结束-->
    <div>
      <div class="tab-nav">
        <p class="nav-item current"> 产品特色 </p>
        <p class="nav-item"> 理赔说明 </p>
        <p class="nav-item"> 常见问题 </p>
      </div>


      <div class="tab-body">
        产品特色
      </div>

      <div class="tab-body">
        理赔说明
      </div>

      <div class="tab-body">
        常见问题
      </div>

      <script type="text/javascript">
        $(document).ready(function (e) {
          $(".tab-body").eq(0).show();
          $(".nav-item").click(function () {
            $(".nav-item ").eq($(this).index()).addClass("current").siblings().removeClass("current");
            $(".tab-body").hide().eq($(this).index()).show();
          })
        });
      </script>

      <div class="clear"></div>
    </div>
  </div>