.main01{position: relative; width: 100%; height: 920px;}
.main01 .main_bg01{width: 100%; height: 100%; background: url(../img/main_bg01.jpg)no-repeat; background-size: cover; background-position: center;}
.main01 .main_txt{position: absolute; top: 50%; left: 0; width: 100%; transform: translateY(-50%);}
.main01 .main_txt p{font-size: 24px; /* opacity: 0.5; */ opacity: 0; letter-spacing: 8px; font-weight: 500; padding-bottom: 10px;}
.main01 .main_txt p span{color:#3e7fdc; font-size:28px; position:relative; top:1px;}
.main01 .main_txt h1{font-size: 72px; height: 180px; width: 940px; line-height: 1.2;}
.main01 .main_txt h1 span{display: inline-block; line-height: 1;}
.main01 .main_txt h1.mobile{display: none;}

.main02{background-color: #144a97;}
.main02 .main_board li{float: left; color: #fff; padding: 14px 0;}
.main02 .main_board .name{width: 400px; text-align: center; border-left: 1px solid rgba(255, 255, 255, 0.2); border-right: 1px solid rgba(255, 255, 255, 0.2); }
.main02 .main_board .name span{font-size: 12px; opacity: 0.3; letter-spacing: 1px;}
.main02 .main_board .name p{font-size: 22px;}
.main02 .main_board .content{width: calc(100% - 400px); font-size: 18px; padding: 24px 60px; border-right: 1px solid rgba(255, 255, 255, 0.2); cursor: pointer; position: relative;}
.main02 .main_board .content span{opacity: 0.3; position: relative; top: -3px;}
.main02 .main_board .content p{display: inline-block; padding: 0 40px; width: calc(100% - 60px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; top: 2px;}
.main02 .main_board .arrow{display: inline-block; width: 10px; position: absolute; top: 50%; transform: translateY(-50%); right: 60px;}

.main03{position: relative;}
.main03 .inner{padding: 130px 0;}
.main03 .content_wrap{width: 100%; overflow: hidden;}
.main03 .content{float: left; width: 50%;}
.main03 .pic_wrap{width: 100%;}
.main03 .main_txt{padding: 24px 17% 60px 40px; word-break: keep-all;}
.main_txt h1{font-size: 42px; font-weight: 500;}
.main_txt p{padding: 28px 0 40px 0; font-size: 18px; line-height: 1.6;}
.main03 .main_btn{color: #e48e2e; font-size: 18px; position: relative; cursor: pointer;}
.main03 .main_btn .arrow{width: 48px; height: 48px; border: 1px solid #e48e2e; border-radius: 50%; display: inline-block; position: absolute; top: -10px; margin-left: 20px;}
.btn_img img{width: 19px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.main03 .pic_wrap li{float: left; width: 50%; position: relative;}
.main03 .main_pic{width: 100%; overflow: hidden;}
.main03 .main_pic img{transition-duration: 0.5s;}
.main03 .main_pic:hover img{transform: scale(1.05);}
.main03 .pic_wrap p{position: absolute; top: 24px; left: 24px; font-size: 22px; color: #fff;}
.main03 .s_logo{position: absolute; right: 0; bottom: 195px;}

.main04 .content{width: 100%;}
.main04 .content li{float: left;}
.main04 .content .left{width: 43.75%; height: 720px; position: relative;}
.main04 .main_bg04{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.main04 .main_bg04 .bg_slide{width: 100%; height: 100%;}
.main04 .main_bg04 .bg_slide li{width: 100%; height: 100%; position: relative;}
.main04 .main_bg04 .bg_slide li.pic01{background: url(../img/main_pic05.jpg)no-repeat; background-size: cover;}
.main04 .main_bg04 .bg_slide li.pic02{background: url(../img/main_pic06.jpg)no-repeat; background-size: cover;}
.main04 .main_bg04 .bg_slide li.pic03{background: url(../img/main_pic07.jpg)no-repeat; background-size: cover;}
.main04 .main_txt{background-color: #144a97; position: absolute; top: 0; right: 0; padding: 60px; width: 580px; height: 360px; z-index: 50;}
.main04 .slide_btn{position: relative; display: inline-block;}
.main04 .slide_btn::before{content: ""; width: 1px; height: 40px; background-color: rgba(255, 255, 255, 0.3); position: absolute; left: 50%;}
.main04 .slide_btn li{width: 40px; height: 40px; border: 1px solid #fff; border-radius: 50%; position: relative; cursor: pointer;}
.main04 .slide_btn .prev{margin-right: 40px;}
.main04 .content .right{width: 56.25%;}
.main04 .content .slide li{width: 360px; height: 360px; position: relative;}
.main04 .slide_pic{width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.main04 .customer li{float: left; width: 356.5px; height: 360px; padding: 60px;}
.main04 .customer li:nth-child(2),.main04 .customer li:nth-child(3){border-left: 1px solid #ddd; padding: 60px 0 0 60px;}
.main04 .customer h4{font-size: 32px; font-weight: 400; padding-bottom: 32px;}
.main04 .customer p{word-break: keep-all; line-height: 1.6; font-size: 18px;}
.main04 .customer .main_btn{background-color: #144a97; color: #fff; padding: 8px 16px; display: inline-block; margin-top: 60px; cursor: pointer;}
.main04 .customer .main_btn:hover{background-color: #ccc; color: #333;}
.main04 .customer h1{font-size: 40px;}
.main04 .customer .tel{padding-top: 40px;}
.main04 .customer .tel span{color: #aaa; font-weight: bold; display: inline-block; width: 80px;}
.main04 .in_product{position: absolute; width: 520px; right: 20px; bottom: 20px;}

.swiper_btn{display: none !important;}
 
 /* ********************************************* *
 * 1400px
 * ********************************************* */
 @media screen and (max-width: 1400px){

    .main01{height: 690px;}
    .main01 .main_txt h1{font-size: 56px; width: 750px;}
    .main03 .pic_wrap p{font-size: 20px;}
    .main04 .content .left{width: 360px;}
    .main04 .content .right{width: calc(100% - 360px);}
    .main04 .main_txt{width: 100%;}
    .main03 .s_logo{display: none;}
    .main04 .in_product{display: none;}
    .main04 .main_txt{padding: 40px; word-break: keep-all;}
    .main04 .customer li{width: 50%; padding: 40px;}
    .main04 .customer li:nth-child(2),.main04 .customer li:nth-child(3){padding: 40px 0 0 40px;}
    .main04 .customer h4{font-size: 28px;}
    .main04 .customer h1{font-size: 36px;}

 }

 /* ********************************************* *
 * 1200px
 * ********************************************* */
 @media screen and (max-width: 1200px){

    .main02 .main_board .name{width: 240px;}
    .main02 .main_board .content{width: calc(100% - 240px);}
    .main03 .content.txt_wrap{width: 100%;}
    .main03 .main_txt{padding-left: 0; padding-right: 20%;}
    .main03 .pic_wrap p{top: 16px; left: 16px; font-size: 18px;}

 }
 /* ********************************************* *
 * 1024px
 * ********************************************* */
 @media screen and (max-width: 1024px){

   .main01{height: 580px;}
   .main01 .main_txt{top: 58%;}
   .main01 .main_txt h1{font-size: 42px; width: 570px;}
   .main01 .main_txt p{font-size: 20px;}
   .main01 .main_txt p span{font-size: 24px;}
   .main02 .main_board .name p{font-size: 20px;}
   .main04 .content .left{width: 100%; height: auto;}
   .main04 .main_txt{position: relative; height: auto;}
   .main04 .main_bg04{display: none;}
   .main04 .content .right{width: 100%;}
   .main04 .content .slide li{height: 300px;}
   .main04 .customer li{height: 300px;}

 }
  /* ********************************************* *
 * 890px
 * ********************************************* */
 @media screen and (max-width: 890px){

   .main03 .pic_wrap li{width: 100%;}
   .main01 .main_txt h1.pc{display: none;}
   .main01 .main_txt h1.mobile{display: block;}
   .main02 .main_board .name{display: none;}
   .main02 .main_board .content{width: 100%; border-right: 0; padding: 20px 0;}
   .main02 .main_board .content p{padding-right: 0;}
   .main02 .main_board .arrow{right: 0;}
   .main03 .inner{padding: 60px 0;}
   .main03 .main_txt{padding-top: 0;}

 }
   /* ********************************************* *
 * 620px
 * ********************************************* */
 @media screen and (max-width: 650px){

   .main01 .main_txt h1{width: 100%;} 
   .main04 .content .slide li{height: auto;}
   .main04 .slide_pic{position: relative;}
   .main04 .customer li{width: 100%; height: auto;}
   .main04 .customer li:nth-child(2){border-left: 0; border-top: 1px solid #ddd; padding: 40px;}
   .main04 .customer h4{padding-bottom: 20px; font-size: 24px;}
   .main04 .customer .main_btn{margin-top: 32px;}
   .main_txt h1{font-size: 32px;}
   .main_txt p,.main04 .customer p{font-size: 16px;}
   .main04 .customer .tel{padding-top: 32px;}   
   .main04 .main_txt,.main04 .customer li,.main04 .customer li:nth-child(2){padding: 40px 20px;}

 }
    /* ********************************************* *
 * 340px
 * ********************************************* */
 @media screen and (max-width: 370px){

  .main03 .content{width: 100%;}

 }