@charset "utf-8";
.carousel {}
.carousel .banner {   display: flex; justify-content: space-between; align-items:center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; }
.carousel .banner .txt { width: 50%;;}
.carousel .banner .txt p { padding: 0; margin: 0; color: #fff; letter-spacing: -0.02em; word-break: keep-all; }
.carousel .banner .txt .p1 { font-size: 50px; font-weight: 500; line-height: 1.32;  }
.carousel .banner .txt .p1 b { display: inline-block; position: relative; margin: 0 0 0 10px; font-weight: 500; } 
.carousel .banner .txt .p1 b:after { content:''; display: block; position: absolute; left: 50%; top: 56%; transform: translate(-50%,-50%);  width: 115%; height: 83%; background: #0b5490;} 
.carousel .banner .txt .p1 b span { position: relative; z-index: 2;}
.carousel .banner .txt .p2 { padding: 30px 0 60px; font-size: 25px; }
.carousel .banner .txt .tel { position: relative; padding: 0 0 0 80px; width: 332px; height: 55px; font-size: 30px; font-weight: 500; line-height: 50px; background: linear-gradient(to right, #145ab4,#3d93bb); border-radius:28px; }
.carousel .banner .txt .tel:before { content:''; display: block; position: absolute; left: 10px; top: 50%; transform: translateY(-50%);  width: 42px; height: 42px; background: url('/data/main/bg_tel.png') no-repeat center / contain;}
.carousel .banner .img { width: 48%; padding: 0 0 0 10px;}
.carousel .banner .img img { width: 100%; max-width: 578px;}


@media (max-width:1199px){
    .carousel .banner .txt .p1 { font-size: 46px;}
}


@media (max-width:991px){
    .carousel .banner .txt { width: 53%;}
    .carousel .banner .txt .p1 { font-size: 38px; line-height: 1.5;}
    .carousel .banner .txt .p2 {padding: 30px 0 50px;   font-size: 21px;}
    .carousel .banner .txt .tel {  width: 310px; height: 52px; font-size: 26px;}
    .carousel .banner .img { width: 46%;}
}
@media (max-width:768px){
    .carousel .banner .txt .p1  { font-size: 28px;}
    .carousel .banner .txt .p2  { padding: 20px 0 40px; font-size: 18px;}
    .carousel .banner .txt .tel { padding: 0 0 0 60px; width: 260px; height: 46px; font-size: 24px; line-height: 44px;}
    .carousel .banner .txt .tel:before { width: 34px; height: 34px; } 
}

@media (max-width:576px){    
    .carousel .banner .txt .p1  { font-size: 23px;}
    .carousel .banner .txt .p2  { padding: 15px 0 30px; font-size: 15px;}
    .carousel .banner .txt .tel { padding: 0 0 0 55px; width: 250px; height: 42px; font-size: 22px; line-height: 40px;}
    .carousel .banner .txt .tel:before { width: 30px; height: 30px; } 
}
@media (max-width:480px){
    .carousel .banner { flex-direction: column-reverse; text-align: center;}
    .carousel .banner .txt { margin: 0; width: 100%;}
    .carousel .banner .txt .p1 br,
    .carousel .banner .txt .p2 { display: none;}
    .carousel .banner .txt .tel { margin: 15px auto 0; width: 230px; text-align: left;}
    .carousel .banner .img { width: 100%;}
    .carousel .banner .img img {margin: -20px 0 0; max-width: 250px;}
}