/* BASIC css start */
/*--------------------------------------------------------------------------------
//
//            °ψΕλ
//
--------------------------------------------------------------------------------*/
body header{
    border-bottom:none;
}

body header.fixed{
    border-bottom:1px solid #e9e9e9;;
}

section{
    margin-bottom:185px;
    padding: 0 16px;
    box-sizing: border-box;
}

section h2.secTit,
section h2.secTit a{
    display:block;
    margin-bottom:40px;
    font-size:34px;
    font-weight:600;
    line-height:50px;
}

section h2.secTit span.icon{
    display: inline-block;
    margin-top: -7px;
    margin-left: 10px;
    font-size: 20px;
    vertical-align: middle;
}

.banner {
    margin-bottom:185px;
    background:url('/design/kgcbrand1/img/2025visual/pc_band_banner.png') no-repeat;
    background-size:cover;
    background-position:center center;
    width:100%;
    height:200px;
}

.banner .txt {
    padding:40px 80px;
}

.banner .txt p.title {
    margin-bottom: 10px;
    font-size: 36px;
    line-height: 46px;
    color: #000;
    font-weight: 800;
}

.banner .txt p.title strong {
    display:block;
    font-weight: 800;
}

.banner .txt .title span b {
    font-weight: 800;
}

.banner .txt .title span b.t1 {
    color:#0051a4;
}

.banner .txt .title span b.t2 {
    color:#34ab8f;
}

.banner .txt .title span b.t3 {
    color:#e08a00;
}

.banner .txt p {
    font-size:22px;
    font-weight:600;
}



/*--------------------------------------------------------------------------------
//
//            section01
//
--------------------------------------------------------------------------------*/
.mainSec01{
    width:100%;
    margin-bottom:85px;
    overflow:hidden;
    padding: 0;
}

.mainSec01 .swiper{
    padding-bottom:42px;
    overflow:visible;
}

.mainSec01 .swiper .swiper-slide img {
    width:100%;
}

.mainSec01 .swiper-button-next,
.mainSec01 .swiper-button-prev{
    color:#fff;
}

.mainSec01 .swiper-button-prev,
.mainSec01 .swiper-rtl .swiper-button-next{
    left:50px;
}

.mainSec01 .swiper-button-next,
.mainSec01 .swiper-rtl .swiper-button-prev{
    right:50px;
}

.mainSec01 .swiper-horizontal>.swiper-pagination-progressbar,
.mainSec01 .swiper-pagination-progressbar.swiper-pagination-horizontal,
.mainSec01 .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.mainSec01 .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{
    width:100%;
    height:2px;
    top:auto;
    bottom:0;
}

.mainSec01 .swiper-pagination-progressbar{
    background:#ccc;
}

.mainSec01 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
    background:#000;
}

.mainSec01 ul li a{
    display:block;
    position:relative;
}

.mainSec01 ul li .textBox{
    position:absolute;
    top: 73%;
    left: 7%;
}

.mainSec01 ul li .textBox strong{
    display:block;
    margin-bottom:20px;
    font-size:40px;
    line-height:46px;
    font-weight:400;
    color:#000;
}

.mainSec01 ul li .textBox span{
    display:block;
    font-size:20px;
    line-height:29px;
    color:#000;
}

/*--------------------------------------------------------------------------------
//
//            mainSec02
//
--------------------------------------------------------------------------------*/
.mainSec02 .goodsListWrap ul li .textBox {
    background: rgba(0, 0, 0, 0.8);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: "Red Hat Display", sans-serif;
    opacity:0;
    transition: all .3s ease;
}

.mainSec02 .goodsListWrap ul li:hover .textBox {
    opacity:1;
    transition: all .3s ease;
}

.mainSec02 .goodsListWrap ul li a {
    text-align: center;
}

.mainSec02 .goodsListWrap ul li .textBox .pro_type {
    color:#fff;
    font-weight: normal;
}

.mainSec02  .goodsListWrap ul li .textBox .g_name {
    padding: 0 20px;
    text-align: center;
    margin-bottom: 15px;
    color:#fff;
    font-weight: normal;
}

.mainSec02 .goodsListWrap ul li .textBox .g_sub {
    color:#fff;
}

.mainSec02 .goodsListWrap ul li .textBox .g_price {
    color:#fff;
}

.mainSec02 .goodsListWrap ul li .textBox .g_price .c_price {
    color: rgba(255, 255, 255, 0.6);
}

.mainSec02 .goodsListWrap ul li .textBox .g_price .r_price {
    margin: 0 4px;
    font-weight:normal
}

.mainSec02 .goodsListWrap ul li a.cartBtn {
    display: block;
    position: absolute;
    top: 45px;
    right: 13px;
    width: 20px;
    padding: 10px;
    font-size: 0;
}

/*--------------------------------------------------------------------------------
//
//            mainSec03
//
--------------------------------------------------------------------------------*/
section.mainSec03 h2.secTit, section.mainSec03 h2.secTit a{
    margin-bottom:30px;
}

.mainSec03 .tabBtn{
    padding:0 0 40px;
}


.mainSec03 .bestSellTab{
    display:none;
}

.mainSec03 .bestSellTab:nth-child(1){
    display:block;
}

.mainSec03 .tabBtn li{
    margin-right:40px;
}

.mainSec03 .tabBtn li:last-child{
    margin-right:0;
}

.mainSec03 .tabBtn li a{
    display:block;
    font-size:20px;
    color:#969696;
    font-weight:500;
}

.mainSec03 .tabBtn li.active a{
    color:#000;
}

/*--------------------------------------------------------------------------------
//
//            mainSec05
//
--------------------------------------------------------------------------------*/
.mainSec05 .leftBox,
.mainSec05 .rightBox{
    width: calc(50% - 25px);
}

.mainSec05 .leftBox{
    margin-right:50px;
}

.mainSec05 .planBox{
    display: flex;
    gap: 25px;
    position:relative;
    min-height:760px;
}

.mainSec05 .box1{
}

.mainSec05 .box1 a img {
    max-width: 100%;
}

.mainSec05 .planBox .box2 {
    width: 200px;
}

.mainSec05 .goodsListWrap ul li{
    margin-bottom:15px;
}

.mainSec05 .goodsListWrap ul li:last-child{
    margin-bottom:0;
}

.mainSec05 .goodsListWrap ul li .textBox{
    padding-top:10px;
}

.mainSec05 .swiper-button-next,
.mainSec05 .swiper-button-prev{
    width:50px;
    height:50px;
}

.mainSec05 .swiper-button-next:after,
.mainSec05 .swiper-button-prev:after{
    font-size:21px;
    color:#000;
}

.mainSec05 .swiper-button-next,
.mainSec05 .swiper-rtl .swiper-button-prev{
    top:-65px;
    right:0;
}
.mainSec05 .swiper-button-prev,
.mainSec05 .swiper-rtl .swiper-button-next{
    top:-65px;
    left:auto;
    right:50px;
}



@media (max-width: 1400px) {
    .mainSec01 ul li .textBox {
        top: 76%;
    }

    .mainSec01 ul li .textBox strong {
        font-size: 32px;
        line-height: 32px;
        margin-bottom: 16px;
    }

    .mainSec01 ul li .textBox span {
        font-size: 16px;
        line-height: 1.4;
    }

    section {
        margin-bottom: 120px;
    }

    .banner {
        margin-bottom: 120px;
    }

    .mainSec05 .planBox .box2 {
        width: 120px;
    }

    .mainSec05 .planBox {
        gap: 16px;
    }

    section h2.secTit, section h2.secTit a {
        font-size: 28px;
        line-height: 1;
    }

    .mainSec03 .tabBtn li a {
        font-size: 18px;
    }

}

@media (max-width: 1280px) {
    .mainSec01 ul li .textBox {
        top: auto;
        bottom: 5%;
    }

    .mainSec01 ul li .textBox strong {
        font-size: 20px;
        line-height: 20px;
        margin-bottom: 8px;
    }

    .mainSec01 ul li .textBox span {
        font-size: 14px;
        line-height: 1.4;
    }
}














/* BASIC css end */