@charset "UTF-8";
.body-home .header { border-bottom: none; }

/* __slide-------------------------------- */
.wrapper .__inner .__content-home-top .__slide { position: relative; left: 50%; transform: translateX(-50%); width: 100vw; margin-bottom: 3rem; }
.wrapper .__inner .__content-home-top .slick-initialized .slick-slide { width: 80vw; margin: 0 2.5px; }
/* dots ------*/
.wrapper .__inner .__content-home-top .slick-dots li { margin: 0 2px; }
.wrapper .__inner .__content-home-top .slick-dots li button:before { font-size: 12px; opacity: 1; color: var(--text-muted); }
.wrapper .__inner .__content-home-top .slick-dots li.slick-active button:before { opacity: 1; color: var(--primary-color); }
/* slide-button */
.wrapper .__inner .__content-home-top .slick-prev,
.wrapper .__inner .__content-home-top .slick-next { width: clamp(1.875rem, calc(0.625rem + 3.333vw), 3.33rem); height: clamp(1.875rem, calc(0.625rem + 3.333vw), 3.33rem); background-color: var(--text-main); z-index: 1; border-radius: 50px; border: 1px solid var(--white); }
.wrapper .__inner .__content-home-top .slick-prev { left: 0.5rem; }
.wrapper .__inner .__content-home-top .slick-next { right: 0.5rem; }
.wrapper .__inner .__content-home-top .slick-prev:before,
.wrapper .__inner .__content-home-top .slick-next:before { font-size: clamp(1.6rem, calc(0.4rem + 3vw), 2.8rem); opacity: 1; font-family: 'Material Symbols Outlined'; font-weight: 400; }
.wrapper .__inner .__content-home-top .slick-prev:before { content: '\e5cb'; margin-left: -1px; }
.wrapper .__inner .__content-home-top .slick-next:before { content: '\e5cc'; padding-left: 1px; }

.main.main--home section.__block:not(:last-child) { margin-bottom: 1rem; }

/* search__tabWrapper-------------- */
.search__wrapper { padding: var(--space-md); background: url(../img/common/search-wrapper-bg.png) no-repeat right bottom/contain var(--bg-light); }
.search__wrapper--title { margin-top: 0; margin-bottom: 0.86rem; text-align: center; font-weight: 600; color: var(--primary-color); font-size: clamp(1.563rem, calc(1.125rem + 1.167vw), 2.133rem); letter-spacing: 0; line-height: 1.28; }
.search__tabWrapper > .search__tab { cursor: pointer; position: relative; padding: 0.85rem; color: var(--text-muted); border: 1px solid color-mix(in srgb, var(--accent-blue), transparent 50%); background-color: var(--white); }
.search__tabWrapper > .search__tab span.material-symbols-outlined { position: absolute; font-size: 1.466rem; display: inline-block; right: 0.5rem; }
.search__tabWrapper > .search__tab .search__text { margin: 0; display: inline-block; width: 90%; letter-spacing: 0; }
div#headerBottom div.headerInner div.search__wrapper div.search__tabWrapper div.search__tab.isSelected { color: #111; }
/* button */
.searchBtn button { display: flex; align-items: center; justify-content: center; gap: 3px; padding: 0 0.86rem 0 1.33rem; cursor: pointer; width: 160px; height: 50px; color: var(--white); background-color: var(--primary-color); border: none; outline: none; appearance: none; transition: all 0.3s; }
.searchBtn button:hover { opacity: 0.9; }
.searchBtn button span.material-symbols-outlined { font-size: 1.466rem; vertical-align: middle; }
/* search__containerWrapper */
.search__containerWrapper { display: flex; position: relative; }
.search__wrapper div.search__container { width: 100%; position: absolute; background-color: var(--white); }
.search__wrapper div.search__container--purpose { left: 0; }
.search__wrapper div.search__container > ul { z-index: 2; position: absolute; top: -5px; left: 0; display: block; width: 100%; padding: 0 1.5em; box-sizing: border-box; overflow: auto; background-color: rgba(255, 255, 255, 0.95); max-height: 50vh; border-right: 1px solid color-mix(in srgb, var(--accent-blue), transparent 50%); border-bottom: 1px solid color-mix(in srgb, var(--accent-blue), transparent 50%); border-left: 1px solid color-mix(in srgb, var(--accent-blue), transparent 50%); }
.search__wrapper div.search__container > ul > li { border-bottom: 1px solid var(--border-color); }
.search__wrapper div.search__container > ul > li:last-child { border-bottom: none; }
.search__wrapper div.search__container ul li label { display: block; cursor: pointer; transition: all 0.3s ease; }
.search__wrapper div.search__container ul > li > label { padding: 0.6em 0; letter-spacing: 0; }
.search__wrapper div.search__container > ul li label:hover { color: var(--accent-blue); }
.search__wrapper div.search__container ul li label input[type="radio"] { display: none; }

/* __top--category----------------------------- */
.main.main--home .__top--category { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.6rem; }
.main.main--home .__top--category .__top--category-item { border: 1px solid var(--border-color); }
.main.main--home .__top--category .__top--category-item a { display: block; text-align: center; padding: 0.74rem 0 1rem; font-weight: 600; }
.main.main--home .__top--category .__top--category-item a img { display: block; margin: auto; max-height: 55px; }
.main.main--home .__top--category .__top--category-item a span { display: inline-block; margin-top: 4px; position: relative; }
.main.main--home .__top--category .__top--category-item a span::after { content: '\e315'; vertical-align: text-bottom; font-size: 1.33em; font-family: var(--font-icon); line-height: 1; display: inline-block; }

/* __top--truck----------------------------- */
.main.main--home .__top--truck { margin: 4rem 0; padding: var(--space-ms); background-color: var(--bg-light); }
.main.main--home .__top--truck img { margin-bottom: var(--space-sm); }
.main.main--home .__top--truck .__top--truck-item { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
.main.main--home .__top--truck .__top--truck-item li a { display: block; padding: 1rem 0; color: var(--primary-color); background-color: var(--white); border: 1px solid var(--border-color); font-weight: 600; text-align: center; letter-spacing: 0; }
.main.main--home .__top--truck .__top--truck-item li a  span { display: inline-block; position: relative; }
.main.main--home .__top--truck .__top--truck-item li a  span::after { content: '\e315'; vertical-align: text-bottom; font-size: 1.33em; font-family: var(--font-icon); line-height: 1; display: inline-block; width: 0.5em; }

/* __top--safety */
.main.main--home .__top--safety { width: 92%; margin: 5.3rem auto; max-width: 900px; }

/* __block--news ----------------------------*/
.main.main--home section.__block--news { background-color: var(--bg-light); padding: var(--space-ms); }
.main.main--home section.__block.__block--news { margin: 5.3rem 0; min-height: 90px; }
.main.main--home section.__block.__block--news .__body { flex: 1; padding: var(--space-md) clamp(1rem, calc(-0.667rem + 4.167vw), 2.667rem); /* min: 15px, max: 40px */ background-color: var(--white); }
/* li */
.main.main--home section.__block.__block--news .__body ul li { font-size: 1em; display: block; border-bottom: unset; }
/* date */
.main.main--home section.__block.__block--news .__body ul li > a span.__date, 
.main.main--home section.__block.__block--news .__body ul li > span span.__date,
.main.main--news-list section.__news ul li > a span.__date { padding-bottom: 0; color: var(--text-sub);  border-bottom: unset; }
/* news title */
.main.main--home section.__block.__block--news .__body ul li > a span.__date, 
.main.main--home section.__block.__block--news .__body ul li > a span.__title, 
.main.main--home section.__block.__block--news .__body ul li > span span.__date, 
.main.main--home section.__block.__block--news .__body ul li > span span.__title { border-bottom: unset; }
.main.main--home section.__block.__block--news .c-news-label { margin-right: 0.5em; }
.main.main--home section.__block.__block--news .__body ul li > a .__title .__subject { font-size: 1em!important; text-decoration: underline; }
.main.main--home section.__block.__block--news .__body ul li > a:hover span.__title { text-decoration: none; }

/* guide -------------------*/
.main--home .__guide--box { margin: 5.3rem 0; background-color: var(--bg-light); padding: clamp(1rem, calc(-1.333rem + 5.833vw), 3.333rem); /* min: 15px, max: 50px */ }
.main--home .__guide--box .__guide--list { display: flex; flex-wrap: wrap; gap: 1rem; margin: clamp(0.875rem, calc(0.188rem + 1.833vw), 1.563rem) 0 clamp(1rem, calc(-0.625rem + 3.333vw), 1.875rem); }
.main--home .__guide--box .__guide--list .__guide--item { width: 100%; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li { position: relative; padding: var(--space-md) 0; background-color: var(--white); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li .__feature--list-circle { display: block; border-radius: 50%; background-color: var(--bg-light); width: clamp(3.85rem, calc(0rem + 8.333vw), 6.667rem); height: clamp(3.85rem, calc(0rem + 8.333vw), 6.667rem); position: relative; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li .__feature--list-circle::before { width: clamp(1.94rem, calc(0rem + 4.167vw), 3.333rem); background-position: center; background-size: contain; background-repeat: no-repeat; position: absolute; content: ''; z-index: 1; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li.__feature--list-shopping .__feature--list-circle::before { background-image: url(../img/common/icon-shopping.svg); height: 50px; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li.__feature--list-account .__feature--list-circle::before { background-image: url(../img/common/icon-account.svg); width: clamp(2.3rem, calc(0.333rem + 4.167vw), 3.667rem); height: 43px; transform: translate(-40%,-55%); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li.__feature--list-factory .__feature--list-circle:before { background-image: url(../img/common/icon-factory.svg); height: 45px; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list .__feature--list-txt { line-height: 1.32; margin: 0; }
/* payment */
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment { background-color: var(--white); padding: var(--space-md); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li::before { content: ''; width: 2rem; height: clamp(1.64rem, calc(0.467rem + 2.333vw), 2.333rem); /* min: 21px, max: 35px */ background: no-repeat center center/contain; display: block; vertical-align: middle; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li.__payment--list-credit::before { background-image: url(../img/common/icon-credit.svg); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li.__payment--list-later::before { background-image: url(../img/common/icon-later.svg); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li.__payment--list-bank::before { background-image: url(../img/common/icon-bank.svg); }
/* orders */
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-orders { background-color: var(--white); padding: var(--space-md); }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-orders .__orders--list li { padding-left: 1em; position: relative; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-orders .__orders--list li + li { margin-top: 0.5em; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-orders .__orders--list li::before { position: absolute; content: ''; width: 5px; height: 5px; border-radius: 5px; background-color: var(--accent-blue); left: 0; top: 10px; }
.main--home .__guide--box .__guide--list .__guide--item.__guide--item-orders .__orders--list .att { font-size: 0.8666em; }



@media screen and (max-width: 1279px) {
    
    /* search__tabWrapper---------- */
    .search__wrapper { background-position: right -14vw bottom; }
    .search__tabWrapper > .search__tab { padding-left: 0.75rem; padding-right: 0.75rem; }
    .search__tabWrapper > .search__tab .search__text { font-feature-settings: 'palt'; }

    /* __top--truck --------------*/
    .main.main--home .__top--truck .__top--truck-item { gap: 5px; }
    .main.main--home .__top--truck .__top--truck-item li a { padding: 1rem 0 1rem 0; font-feature-settings: 'palt';}

}
@media screen and (max-width: 1279px) and (min-width: 600px) {
    .searchBtn button { padding: 0 0.3rem 0 0.8rem; width: 140px; }
    
}

@media screen and (max-width: 599px) {
    /* search__wrapper-------------- */
    .search__wrapper--title { margin-top: 0.5rem; }
    .search__wrapper { background-position: right -9rem bottom; }
    .search__tabWrapper > .search__tab { margin-bottom: 0.6rem; }
    .search__wrapper div.search__container { left: 1rem; width: calc(100% - 1rem *2); } 
    .search__wrapper div.search__container > ul { top: -1rem; }
    .searchBtn button { margin: auto; height: 45px; }

     /* __block--new --------------*/
    .main.main--home section.__block.__block--news .__body ul li > span span.__subject,
    .main.main--home section.__block.__block--news .__body ul li > a span.__title { font-size: 1rem; }

    /* __guide -----------------*/
    /* feature */
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li { display: flex; align-items: center; gap: 1rem; padding-left: 1rem; }
    /* __payment */
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list  { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; font-size: 0.95rem; }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li { text-align: center; line-height: 1.2; }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li::before { margin: 0 auto 0.5em; }
    /* __orders */
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-orders .__orders--list .att { display: block; }
    /* button */
    .main--home .__guide--box .button-arrow { margin-bottom: 1rem; }

}


@media screen and (min-width: 600px) {
    
    .wrapper .__inner .__content-home-top .slick-initialized .slick-slide { margin: 0 5px; }
    .wrapper .__inner .__content-home-top .slick-prev { left: calc(5vw - 25px); }
    .wrapper .__inner .__content-home-top .slick-next { right: calc(5vw - 25px); }

    /* search__tabWrapper----------- */
    .search__tabWrapper { display: flex; align-items: center; gap: 5px; }
    .search__tabWrapper > .search__tab { width: calc((100% - 5px *3) / 3); }
    div#headerBottom div.headerInner div.search__wrapper div.search__containerWrapper div.search__container { width:calc(((100% - 5px *3 ) - 140px) / 3); }
    div#headerBottom div.headerInner div.search__wrapper div.search__containerWrapper div.search__container--item { left: calc((100% - 140px) / 3); }
    div#headerBottom div.headerInner div.search__wrapper div.search__containerWrapper div.search__container--manufacturer { left: calc(((100% - 140px) / 3) * 2); }

    /* __news ---------------------*/
    .main.main--home section.__block.__block--news { display: flex; align-items: center; }
    .main.main--home section.__block.__block--news .top-h { padding: 0 4rem 0 2rem; text-align: left; }

    /* __guide ---------------------*/
    .main--home .__guide--box .__guide--list { font-size: 1.06em; }
    /* feature */
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list {  grid-template-columns: repeat(3, 1fr); display: grid; gap: 1rem; }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li { text-align: center; }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-feature .__feature--list li .__feature--list-circle { display: block; margin: 0 auto 0.86rem; }
    /* __payment */
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list { flex: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li::before { display: inline-block; margin-right: clamp(0.467rem, calc(-0.133rem + 1.5vw), 1.067rem); }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li.__payment--list-credit::before { width: clamp(2rem, calc(0.1rem + 3.667vw), 3.033rem); /* min: 23.5px, max: 45.5px */ }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li.__payment--list-later::before { width: clamp(1.3rem, calc(0.133rem + 2vw), 1.733rem); /* min: 14px, max: 26px */  }
    .main--home .__guide--box .__guide--list .__guide--item.__guide--item-payment .__payment--list li.__payment--list-bank::before { width: clamp(1.6rem, calc(0.533rem + 2.167vw), 2.267rem); /* min: 21px, max: 34px */ }

}

@media screen and (min-width: 768px) {
    .main.main--home .__top--category { grid-template-columns: repeat(4, 1fr); gap: 1rem; }
    .main.main--home .__top--truck .__top--truck-item { grid-template-columns: repeat(4, 1fr); }
}
@media screen and (min-width: 768px) {
    .body-home .footer { margin-top: 0; }
}

@media (min-width: 1024px) {
    .body-home .header::before { border-bottom: none; }
    .body-home .header::after { border-bottom: none }
   .wrapper .__inner .__content-home-top .slick-dots { bottom: -3rem; }
}

@media (min-width: 1025px) {
    .wrapper .__inner .__content-home-top .slick-next { right: calc(10vw - 25px); }
    .wrapper .__inner .__content-home-top .slick-prev { left: calc(10vw - 25px); }
}



@media screen and (min-width: 1280px) {
    /* search__tabWrapper---------------- */
    .search__tabWrapper { gap: 10px; }
    .search__tabWrapper > .search__tab { width: calc((100% - 15px *3) / 3); }
    .search__tabWrapper > .search__tab .search__text { font-size: 1.06rem; }
    div#headerBottom div.headerInner div.search__wrapper div.search__containerWrapper div.search__container { width:calc(((100% - 15px *2 ) - 160px) / 3); }
    div#headerBottom div.headerInner div.search__wrapper div.search__containerWrapper div.search__container--item { left: calc((100% - 160px) / 3); }
    div#headerBottom div.headerInner div.search__wrapper div.search__containerWrapper div.search__container--manufacturer { left: calc(((100% - 160px) / 3) * 2); }
    .searchBtn button { font-size: 1.06em; }

    /* slick-slide------------------------- */
    .wrapper .__inner .__content-home-top .slick-initialized .slick-slide { margin: 0 7.5px; }

    /* __top--category  -------------------------*/
    .main.main--home .__top--category .__top--category-item a img { max-height: 90px; }
    .main.main--home .__top--category .__top--category-item a span { font-size: 1.2rem; }

    /* __top--truck -------------------------*/
    .main.main--home .__top--truck .__top--truck-item li a span { font-size: 1.2rem; }
}