.gray7{color:#495057}
.gray9{color:#212529}

.imgbx img{width: 100%;}
.pdbox{padding:80px 0}
.contTxt{margin-top:40px;color: #212529;font-size: 20px;font-weight: 300;line-height: 34px; /* 170% */letter-spacing: -0.4px;}
.keyColor{color:#bb2649}

.aboutAll{color:#212529}
.aboutAll > *{letter-spacing: -0.6px;}
.aboutAll .container{width: 100%;max-width: 1400px;margin:0 auto}
.aboutAll .mBr{display: none;}

.aboutAll .tonseHead1,
.aboutAll .tonseHead2,
.aboutAll .tonseHead3{font-size: 40px;line-height: 52px;}

.aboutWrap1 .container{position: relative;top:-60px;}
.aboutWrap1 .cont1{background: #fff;border-radius: 30px;padding: 45px 16px;}
.aboutWrap1 .cont1 .contTxt{margin-top:24px;}
.aboutWrap1 .cont2{padding:20px 100px}
.aboutWrap1 .cont2 .cont2Ul > li{width: 100%;gap:8px;}
.aboutWrap1 .cont2 .cont2Ul > li .tonseBody4{font-weight: 300 !important;}
.aboutWrap1 .aboutWrapBg{height: 540px;width: 100%;background-size:cover;background-image: url('/main/img/about/about1_1.jpg');}

.aboutWrap2{background-image: url('/main/img/about/about2_bg.jpg');background-size:cover;}
.aboutWrap2 .container{max-width: 1149px;width: 100%;}
.aboutWrap2 ul{margin-top:60px;flex-wrap:wrap;gap:30px;}
.aboutWrap2 ul > li{border-radius:30px;width: calc(50% - 15px);}
.aboutWrap2 ul > li:nth-child(1){background-image: url('/main/img/about/about2_1.jpg');background-size:cover;height: 520px;}
.aboutWrap2 ul > li:nth-child(2){background-image: url('/main/img/about/about2_2.jpg');background-size:cover;height: 520px;}
.aboutWrap2 ul > li:nth-child(3){background-image: url('/main/img/about/about2_3.jpg');background-size:cover;height: 520px;}
.aboutWrap2 ul > li:nth-child(4){background-image: url('/main/img/about/about2_4.jpg');background-size:cover;height: 520px;}
.aboutWrap2 ul > li .liTop{border-radius:30px 30px 0 0;gap:16px;padding: 36px 36px 100px 36px;background: linear-gradient(180deg, #F9F7F4 50.48%, rgba(255, 255, 255, 0.00) 100%);}
.aboutWrap2 ul > li .liTop .contTxt{margin:0;line-height: 28px;font-size: 18px;}
.aboutWrap2 ul > li .liTop .point{width: fit-content;padding: 8px;border-radius: 10px;background: #BB2649;color: #FFF;font-size: 14px;font-weight: 700;line-height: 14px; /* 100% */letter-spacing: -0.28px;}

.aboutWrap3{position: relative;}
.aboutWrap3 .aboutWrapBg2{width: 100%;top:0;left:0;position: absolute;z-index: -1;}
.aboutWrap3 .container{gap:130px;}
.aboutWrap3 .container > div{width: 100%;}
.aboutWrap3 .container > div img{width: 100%;}

.aboutWrap5 ul{gap:30px;flex-wrap:wrap;}
.aboutWrap5 ul > li{width: calc(33.33% - 20px);position: relative;}
.aboutWrap5 ul > li:nth-child(2){background-image: url('/main/img/about/about5_1.jpg');background-size:cover;height: 360px;border-radius:30px}
.aboutWrap5 ul > li:nth-child(3){background-image: url('/main/img/about/about5_2.jpg');background-size:cover;height: 360px;border-radius:30px}
.aboutWrap5 ul > li:nth-child(4){background-image: url('/main/img/about/about5_3.jpg');background-size:cover;height: 360px;border-radius:30px}
.aboutWrap5 ul > li:nth-child(5){background-image: url('/main/img/about/about5_4.jpg');background-size:cover;height: 360px;border-radius:30px}
.aboutWrap5 ul > li:nth-child(6){background-image: url('/main/img/about/about5_5.jpg');background-size:cover;height: 360px;border-radius:30px}
.aboutWrap5 ul > li .btbox{color:#fff;height: fit-content;width: 100%;position: absolute;bottom:0;left:0;align-items: flex-end;border-radius: 0 0 30px 30px;background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(92, 71, 50, 0.70) 100%);padding: 50px 36px 36px 36px;}

.aboutWrap7{background-repeat: no-repeat;background-size:100%;background-image: url('/main/img/about/about7_bg.png');background-position: bottom;width: 100%;}
.aboutWrap7 .container{display: flex;justify-content: space-between;gap:30px}
.aboutWrap7 .leftBt{padding:100px;}
.aboutWrap7 ul{gap:20px}
.aboutWrap7 ul > li{width: 100%;max-width: 566px;}
.aboutWrap7 ul > li img{width: 100%;border-radius:30px;}

.aboutWrap8 {padding: 240px 260px 100px 260px;background: linear-gradient(180deg, rgba(255, 246, 218, 0.00) 0%, #F6DEDE 100%);}
.aboutWrap8 .cont{gap:56px;}
.aboutWrap8 .logobx{margin:0 auto}
.aboutWrap8 .logobx img{width: 100%;max-width: 300px;}

/* 히스토리 */
#secBrandStory {padding: clamp(77px, 8.04vw, 154px) 0px;background: url("/main/img/withTones/brandStroyBg.png") no-repeat;}
#secBrandStory .title {font-size: clamp(24px, 2.18vw, 42px);line-height: 56px;}
#secBrandStory .title .span {color: #BB2649;}
#secBrandStory .content {font-size: clamp(14px, 1.04vw, 20px);text-align: center;line-height: clamp(22px, 2.3vw, 34px);color: #212529;margin-top: 30px;}
#secBrandStory .brandSwiper .swiper-slide {margin-top: 50px;}
#secBrandStory .brandSwiper .swiper-slide .img {border-radius: 30px;overflow: hidden;padding-top: 30px;}
#secBrandStory .brandSwiper .swiper-slide.swiper-slide-active .img {padding-top: 0px;}
#secBrandStory .brandSwiper .swiper-slide .img img {display: block;}
#secBrandStory .brandSwiper .swiper-slide {z-index: 1;}
#secBrandStory .brandSwiper .swiper-slide .brandInfo {margin-top: 10px;padding-bottom: 20px;display: flex;flex-direction: column;gap:4px}
#secBrandStory .brandSwiper .swiper-slide .brandInfo .date {font-size: clamp(12px, 1.04vw, 20px);font-weight: 700;color: #212529;}
#secBrandStory .brandSwiper .swiper-slide .brandInfo .name {font-size: clamp(12px, 1.04vw, 20px);}
#secBrandStory .brandSwiper .swiper-slide .brandInfo .name .bar{color:#ADB5BD;padding:0 4px;}
#secBrandStory .brandStarSwiper .swiper-slide .star {position: relative;height: 24px;}
#secBrandStory .brandStarSwiper .swiper-slide svg {z-index: 9999;position: absolute;}
#secBrandStory .brandStarSwiper .swiper-slide .bgbg {z-index: 2;position: absolute;top: 7px;width: 100%;height: 1px;background-color: #ADB5BD;}



/* 반응형 */
@media (max-width:1400px){
    .aboutAll .container{padding:0 16px !important;}
}
@media (max-width:1080px){
    .pdbox{padding: 60px 0;}
    .contTxt{font-size: 16px;line-height: 27px;margin-top: 24px;}
    
    .aboutAll .tonseHead1,
    .aboutAll .tonseHead2,
    .aboutAll .tonseHead3{font-size: 28px;line-height: 37px;}
    .aboutAll .tonseHead5{font-size: 20px;}
    
    .aboutWrap1 .container{padding:0 !important;top:-40px}
    .aboutWrap1 .aboutWrapBg{height: 360px;}
    .aboutWrap1 .cont2 .cont2Ul > li .tonseBody4{font-size: 16px;}
    
    .aboutWrap2 ul{gap:15px;margin-top: 40px;}
    .aboutWrap2 ul > li{width: calc(50% - 7.5px);}
    .aboutWrap2 ul > li .liTop{gap:8px;}
    .aboutWrap2 ul > li .liTop .contTxt{font-size: 16px;line-height: 25px;}
    .aboutWrap2 ul > li:nth-child(1),
    .aboutWrap2 ul > li:nth-child(2),
    .aboutWrap2 ul > li:nth-child(3),
    .aboutWrap2 ul > li:nth-child(4){height: 420px;}
    
    .aboutWrap3 .container{gap:50px}

    .aboutWrap5 ul{gap:15px;}
    .aboutWrap5 ul > li{width: calc(33.33% - 10px);}
    .aboutWrap5 ul > li .btbox{padding: 40px 24px 24px 24px;font-size:16px;}

    .aboutWrap7 ul > li{max-width: 400px;}
    .aboutWrap7 .leftBt{font-size: 14px;padding: 35px 0;}
    
    .aboutWrap8 .cont{gap:24px}
}
@media (max-width:853px){
    .contTxt{font-size: 15px;}
    .aboutAll .mBr{display: block !important;}

    .aboutWrap1 br,
    .aboutWrap3 .contTxt br,
    .aboutWrap7 .contTxt br{display: none;}
    .aboutWrap1 .cont2{padding: 20px 16px;}
    .aboutWrap2 ul > li .liTop .contTxt{font-size: 15px;line-height: 23px;}
    .aboutWrap2 ul > li .liTop{padding: 24px 24px 50px 24px;}
    .aboutWrap5 ul > li{width: calc(50% - 10px);}
    .aboutWrap7 .container{gap:30px;flex-direction: column;}
    .aboutWrap7 ul{flex-direction: row;gap:12px}
    .aboutWrap7 ul > li{max-width: 100%;}
    .aboutWrap7 ul > li img{border-radius: 20px;}
}

@media (max-width:575px){
    .pdbox{padding: 40px 0;}
    .contTxt{font-size: 14px;line-height: 22px;margin-top: 12px;}
    .aboutAll .tonseBody4{font-size: 14px;}
    .aboutAll .tonseHead1,
    .aboutAll .tonseHead2,
    .aboutAll .tonseHead3{font-size: 22px;line-height: 30px;}
    .aboutAll .tonseHead5{font-size: 16px;line-height: 24px;}
    .aboutAll{padding-top: 61px;}
    .aboutAll .tonseHead7{font-size: 15px;}

    .aboutWrap1 .aboutWrapBg{height: 280px;}
    .aboutWrap1 .container{padding:0 !important;top:-30px}
    .aboutWrap1 .cont1 .contTxt{margin-top: 16px;}
    .aboutWrap1 .cont1{padding:28px 16px;}
    .aboutWrap1 .cont2{padding:12px 16px;}
    .aboutWrap1 .cont2 .cont2Ul{flex-wrap: wrap;gap:24px}
    .aboutWrap1 .cont2 .cont2Ul > li{width: calc(50% - 24px);gap:4px}
    .aboutWrap1 .cont2 .cont2Ul > li .tonseBody4{line-height: 22px;}

    .aboutWrap2 ul{margin-top: 24px;flex-direction: column;gap:12px;}
    .aboutWrap2 ul > li{width: 100%;}
    .aboutWrap2 ul > li .liTop{padding: 20px 20px 50px 20px;gap:4px;border-radius:25px 25px 0 0}
    .aboutWrap2 ul > li .liTop .point{margin-bottom: 4px;padding: 5px 6px;border-radius: 6px;font-size: 11px;font-weight: 700;line-height: 11px;}
    .aboutWrap2 ul > li .liTop .contTxt{font-size: 14px;line-height: 22px}
    .aboutWrap2 ul > li:nth-child(1),
    .aboutWrap2 ul > li:nth-child(2),
    .aboutWrap2 ul > li:nth-child(3),
    .aboutWrap2 ul > li:nth-child(4){height: 300px;border-radius:25px;}

    .aboutWrap3 .container{gap:12px;flex-direction: column;}
    .aboutWrap3 .container .left{order:2}
    .aboutWrap3 .container .right{order:1}
    .aboutWrap3 .container > div img{margin:0 auto;max-width: 420px;}

    .aboutWrap5 ul{flex-direction:column;gap:12px}
    .aboutWrap5 ul > li{width: 100%;}
    .aboutWrap5 ul > li:nth-child(1){margin-bottom: 12px;}
    .aboutWrap5 ul > li .btbox{padding: 40px 20px 20px 20px;font-size: 15px;}
    .aboutWrap5 ul > li:not(.tbx){height: 230px;}

    .aboutWrap7{background:none;}
    .aboutWrap7 .container{gap:24px;flex-direction: column;}
    .aboutWrap7 .leftBt{display: none;}
    .aboutWrap7 ul{gap:12px;flex-direction: column;}
    .aboutWrap7 ul > li{max-width: 100%;}
    .aboutWrap7 ul > li img{border-radius:20px}

    .aboutWrap8{padding:60px 0;}

    .pcbg{display: none;}
    .mbg{display: block !important;}
    
}