body {
    font-family: 'Poppins';
}

.titl {

    color: #000;

}

.h-100 {

    height: 100%;

}

.bold {

    font-weight: bold;

}

.giftBtn{
    background-color: var(--color);
    position: relative;
    z-index: 2;
    color: #fefefe;
    padding: 13px 16px;
    font-size: 16px;
}

.giftBtn::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 50%;
    top: 0;
    width: 0;
    height: 100%;
    transform: translateX(-50%);
    -webkit-transition: 0.5s ease;
    -moz-transition: 0.5s ease;
    transition: 0.5s ease;
    background-color: #000;
    opacity: 0;
}

.giftBtn:hover::after {

    width: 100%;

    opacity: 1;

}

.gift-header {

    height: 90px;

    background-color: #fff;

    color: #090909;

}

.gift-header .container .right .phone {

    border-right: 1px solid #e0e0e0;

}

.gift-banner .bg {

    min-height: 350px;

    object-fit: cover;

    object-position: center;

}
.gift-banner  .list {
    max-width: 365px;
    margin: 20px 0;
}
.gift-banner .list ul {
    margin: 0 0 -31px;
}
.gift-banner .list ul li {
    font-family: 'Poppins';
    position: relative;
    font-size: 18px;
    line-height: 1.8;
    padding: 0 0 31px 43px;
}
.gift-banner .list ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 22px;
  height: 21px;
  background: url(../images/check.png) no-repeat;
  -webkit-filter: invert(1);
  filter: invert(1);
}
.gift-banner .container {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    color: #ffffff;

}

.gift-banner .container .titl {
    color: #ffffff;
    line-height: 1;
    font-weight: bold;
}

.gift-banner .container .txt {

    line-height: 1.875;

    width: 500px;

}

.gift-body .init-1 .container .line {

    width: 100%;

    border-bottom: 2px dashed #b8b7b7;

}

.gift-body .init-1 .left {

    width: 31%;

}

.gift-body .init-1 .left img {

    display: block;

    margin: 0 auto;

}

.gift-body .init-1 .right {

    width: 63%;

    color: #070707;

}

.gift-body .init-1 .right .titl {

    color: #070707;

}

.gift-body .init-1 .right p.txt {

    color: var(--color);

}


.gift-body .init-2 ul.lists li {

    width: 31%;

}

.gift-body .init-2 ul.lists li .list {

    width: 100%;

    height: 100%;

    padding-bottom: 50px;

    position: relative;

}

.gift-body .init-2 ul.lists li .btnBox {

    bottom: 0;

    z-index: 2;

    left: 50%;

    transform: translateX(-50%);

}

.gift-body .init-2 ul.lists li .txt:hover {

    color: var(--color);

}

.gift-body .init-2 ul.lists li .giftBtn {
    padding: 8px 19px;
    color: #fefefe;
}

.gift-body .init-2 .detBg {

    position: fixed;

    width: 100vw;

    height: 100vh;

    z-index: 20;

    background-color: rgba(0, 0, 0, .5);

    left: 50%;

    top: 50%;

    transform: translate(-50%,-50%);

    justify-content: center;

    align-items: center;

    display: none;

}

.gift-body .init-2 .detBg.active {

    display: flex;

}

.gift-body .init-2 .detBg .detBox {
    padding: 40px;
    background-color: #fff;
    border-radius: 25px;
    width: 70vw;
    position: relative;

}

.gift-body .init-2 .detBg .detBox .close {

    width: 35px;

    height: 35px;

    background-color: var(--color);

    border-radius: 7px;

    opacity: 0.8;

    position: absolute;

    right: 0;

    top: 0;

    transform: translate(110%);

    text-align: center;

    font-size: 24px;

    color: #ffffff;

    cursor: pointer;

    line-height: 1.7;

}

.gift-body .init-2 .detBg .detBox .close:hover {

    opacity: 1;

}

.gift-body .init-2 .detBg .detBox .det_item {

    display: flex;

    justify-content: space-between;

    align-items: center;

    flex-wrap: wrap;

    overflow-y: auto;

    height: 100%;

}
.gift-body .init-2 .detBg .detBox .det_item .t1{
    font-family: 'Poppins';
}
.gift-body .init-2 .detBg .detBox .det_item .line{

    border-bottom: 1px solid #b8b7b7;

}



 .m-page {

  margin-top: 40px;

  text-align: center;

}



 .m-page a,

 .m-page span {

  display: inline-block;

  text-align: center;

  width: 45px;

  height: 35px;

  font-size: 14px;

  line-height: 40px;

  border-radius: 5px;

  color: #111;

  font-weight: 500;

  -o-box-shadow: 0 2px 10px 0 #d8dde6;

  -webkit-box-shadow: 0 2px 10px 0 #d8dde6;

  box-shadow: 0 2px 10px 0 #d8dde6;

  -webkit-transition: .5s;

  -moz-transition: .5s;

  transition: .5s;

  margin: 5px;

}



 .m-page span.current,

 .m-page a:hover {

  background: var(--color) none repeat scroll 0 0;

  color: #fff;

}

.gift-body .init-3 img.img {

    display: block;

    margin: auto;

}

.gift-body .init-3 .about .left{

    color: #000;

}

.gift-body .init-3 .about .left .titl {

    color: #000;

    line-height: 1.6;

}

.gift-body .init-3 .about .right ul li {

    border-left: 3px solid var(--color);

}

.gift-body .init-3 .about .right ul li .txt {

    color: #1b1b1b;

    line-height: 1 !important;

}

.gift-body .init-3 .about .right ul li.color .num {
    color: var(--color);
}
.gift-body .init-3 .about .right ul li .num{
    font-family: 'PB';
}
.gift-body .init-4 .menuBox .left {

    width: 27.2%;

    color: #000;

}

.gift-body .init-4 .menuBox .left ul.lists li {

    margin-bottom: 2px;

    background-color: #f2f2f2;

}

.gift-body .init-4 .menuBox .left ul.lists li i {

    color: #fff;

    opacity: 0;

}

.gift-body .init-4 .menuBox .left ul.lists li.active,.gift-body .init-4 .menuBox .left ul.lists li:hover {

    background-color: var(--color);

    color: #fff;

}

.gift-body .init-4 .menuBox .left ul.lists li.active i,.gift-body .init-4 .menuBox .left ul.lists li:hover i {

    opacity: 1;

}

.gift-body .init-4 .menuBox .right {

    width: 72.8%;

}

.gift-body .init-4 .menuBox .right .imgUl li {

    display: none;

}

.gift-body .init-4 .menuBox .right .imgUl li img{
    width: 100%;
}

.gift-body .init-5 .left .colorTxt {

    color: var(--color);

}

.gift-body .init-5 .left .lists .colorTxt {

    line-height: 1.25;

}

.gift-body .init-5 .left .lists {

    color: #0f0f0f;
    max-height: 400px;
    overflow-y: auto;
}

.gift-body .init-6 {

    background-image: url(/cnsmyl/2026/02/02/0202-di.jpg);

}
.gift-body .init-6 .left{
    position: relative;
    z-index: 2;
}
.gift-body .init-6 img.Rbg {

    top: 0;

    right: 0;

    height: 100%;

    z-index: 1;

}

.gift-body .init-6 .form {

    width: 100%;

    max-width: 470px;

    margin-left: auto;

    z-index: 3;

    color: #fff;

}

.gift-body .init-6 .form .colorF {

    color: #fff;

}

.gift-body .init-6 .form form {

    width: 100%;

}

.gift-body .init-6 .form form input,.gift-body .init-6 .form form button {

    width: 100%;
}



.gift-body .init-6 .form form input {
    padding-left: 25px;
    background-color: var(--color);
    color: #fff;
    padding-top:17px;
    padding-bottom: 17px; 
    border: 1px solid #fff;
    font-size: 16px;
}

.gift-body .init-6 .form form input::placeholder {

    color: #fff;

}

.gift-body .init-6 .form form button {

    background-color: #fff;

    color: var(--color);

    padding: 17px 23px;

    border: none;



}


@media screen and (max-width: 1450px) {

    .gift-body .init-3 .about .right {

        width: 48%;

    }

}

@media screen and (max-width: 1250px) {
    .gift-body .init-6 .left{
        width: 50%;
    }
    
}

@media screen and (max-width: 1000px) {
    .pad-hide {

        display: none;

    }

    .gift-banner .container .txt {

        width: 100%;

    }

    .gift-body .init-2 ul.lists li {

        width: 48%;

    }
    .gift-body .init-1 .left img{
        width: 100%;
    }
    .gift-body .init-3 .about .right {

        margin-top: 20px;

        -webkit-flex-wrap: wrap;

        -ms-flex-wrap: wrap;

        flex-wrap: wrap;

    }
    .gift-body .init-6 .form{
        max-width: 100%;
    }
    .gift-header .right{
      zoom: .8;
    }
    .gift-body .init-6 .left{
         width: 100%;
     }
     .gift-body .init-5 .right{
         margin-top: 30px;
     }
     .gift-body .init-3 .about .right ul{
         display: -webkit-box;
        display: -webkit-flex;
       display: -moz-box;
       display: -ms-flexbox;
       display: flex;
       width: 50%;
        -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
     }
      .gift-body .init-3 .about .right ul li{
          width: 50%;
      }
}

@media screen and (max-width: 700px) {
    .phone-hide {

        display: none;

    }
    .gift-banner{
        zoom: .87;
    }
    .gift-body .init-2 .detBg .detBox {

        width: 80vw;

        padding: 20px;

    }

    .gift-body .init-2 .detBg .detBox .close{

        transform: translate(98%);

    }

    .gift-body .init-2 ul.lists li {

        padding: 0 5px 15px;

    }

    .gift-body .init-2 ul.lists {

        margin: 0 -5px;

    }

    .gift-body .init-6 .form form input {

        background-color: rgba(0, 0, 0, .5);

    }

    .right_nav_list ul li {

        /*width: 50px;

        height: 50px;*/

        border-radius: 10px;

    }

    .gift-body .init-2 ul.lists li .btnBox {

        width: 100%;

    } 

    .gift-body .init-2 ul.lists li .giftBtn {

        padding: 8px 10px;  

        width: auto;

        display: flex;

        justify-content: center;

    }
}

@media screen and (max-width: 500px) {
     .giftBtn{
         font-size: 14px;
         padding: 10px 16px;
     }
     .gift-banner .list ul li {
      padding: 0 0 10px 43px;
     }
    .gift-body .init-2 ul.lists li .list .txt {

        padding-left: 0;

        padding-right: 0;

    }

    .gift-body .init-3 .about .right ul {

        width: 100%;

    }

    .gift-body .init-3 .about .right ul li {

        width: 100%;

        margin-bottom: 20px;

    }

    .gift-body .init-2 ul.lists li {

        margin-bottom: 30px;

    }

}