/* BASIC css start */
/* ==================== common ==================== */
:focus { outline: none; }
#wrap { overflow-x: hidden; }
#container { margin-bottom: 0; }
#contents_main {}

.section { margin: 200px 0; }
.section .section__head { margin-bottom: 80px; text-align: center; }
.section .section__head .title { margin-bottom: 24px; font-size: 35px; font-weight: 600; line-height: 1.25; color: #000; }
.section .section__head .desc { font-size: 25px; }


/* ==================== SECTION : hero ==================== */
.section__hero { position: relative; margin: 0 auto; }
.section__hero .hero-slider { width: 100%; overflow: hidden; }
.section__hero .hero-slide { position: relative; }
.section__hero .hero-slide__media {}
.section__hero .hero-slide__media a { display: block; }
.section__hero .hero-slide__media img { width: 100%; pointer-events: none; }
.section__hero .hero-slide__media video { width: 100%; pointer-events: none; }
.section__hero .hero-slide__content { position: absolute; left: 50%; bottom: 100px; transform: translateX(-50%); text-align: center; }
.section__hero .hero-slide__content h2 { margin-bottom: 16px; font-size: 40px; font-weight: 500; color: #fff; text-align: center; line-height: 1; }
.section__hero .hero-slide__content a { display: inline-block; margin: 0 auto; font-size: 17px; font-weight: 500; color: #fff; border-bottom: 1px solid #fff; line-height: 1; }
.section__hero .hero-slider .swiper-pagination { bottom: 48px; display: flex; align-items: center; justify-content: center; gap: 15px; }
.section__hero .hero-slider .swiper-pagination-bullet { display: block; width: 10px; height: 10px; margin: 0!important; background-color: #fff; opacity: 0.6; }
.section__hero .hero-slider .swiper-pagination-bullet-active { opacity: 1; background-color: #fff; }


/* ==================== SECTION : lineup ==================== */
.section__lineup { margin: 120px auto 200px; padding: 0 40px; }
.section__lineup .lineup__inner { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.section__lineup .lineup__item {}
.section__lineup .lineup__thumb { overflow: hidden; }
.section__lineup .lineup__thumb a { display: block; }
.section__lineup .lineup__thumb a img { width: 100%; }
.section__lineup .lineup__info { margin: 32px 0 0; text-align: center; }
.section__lineup .lineup__info .lineup__desc { margin-bottom: 12px; font-size: 20px; font-weight: 500; }
.section__lineup .lineup__info a { display: inline-block; font-size: 20px; font-weight: 500; border-bottom: 1px solid #222; line-height: 1.25; }


/* ==================== SECTION : event ==================== */
.section__event {}
.section__event .event__inner {}
/* .section__event .event_contents { display: grid; grid-template-columns: 640px 1fr; gap: 20px; } */
.section__event .event_contents { display: grid; grid-template-columns: 33% 1fr; gap: 20px; }
.section__event .event__main {}
.section__event .event__main .event-card { position: relative; }
.section__event .event__main .event-card__thumb { overflow: hidden; }
.section__event .event__main .event-card__thumb a { display: block; }
.section__event .event__main .event-card__thumb img { width: 100%; }
.section__event .event__main .event-card__info { position: absolute; left: 0; right: 0; bottom: 80px;  text-align: center; }
.section__event .event__main .event-card__info a { font-size: 25px; font-weight: 500; line-height: 1.25; border-bottom: 1px solid #fff; color: #fff; }
.section__event .event__main .event-card__desc { margin-bottom: 12px; font-size: 33px; font-weight: 600; line-height: 1.25; color: #fff; }

.section__event .event__products { min-width: 0; overflow: hidden; }
.section__event .event__products .event-product {}
.section__event .event__products .event-product__thumb { overflow: hidden; }
.section__event .event__products .event-product__thumb a { display: block; }
.section__event .event__products .event-product__thumb img { width: 100%; }
.section__event .event__products .event-product__info { margin: 30px 0; text-align: center; }
.section__event .event__products .event-product__name { font-size: 20px; font-weight: 500; }
.section__event .event__products .event-product__price { display: flex; align-items: center; justify-content: center; gap: 12px;  margin: 12px auto 0; }
.section__event .event__products .event-product__price > p { font-size: 20px; font-weight: 500; }
.section__event .event__products .event-product__text {}
.section__event .event__products .event-product__discount { color: #E30000; }
.section__event .event__products .event-product__amount {}


/* ==================== SECTION : best ==================== */
.section__best {}
.section__best .best__inner {}
.section__best .best__products { width: 100%; overflow: hidden; }
.section__best .best__products .best-product {}
.section__best .best__products .best-product__thumb { overflow: hidden; }
.section__best .best__products .best-product__thumb a { display: block; }
.section__best .best__products .best-product__thumb img { width: 100%; }


/* ==================== SECTION : brand ==================== */
.section__brand {}
.section__brand .brand__inner {}
.section__brand .brand__contents { width: 100%; overflow: hidden; }
.section__brand .brand__contents a { display: block; }
.section__brand .brand__contents img { width: 100%; }


/* ==================== SECTION : style ==================== */
.section__style { margin-bottom: 0; }
.section__style .style__inner {}
.section__style .style__contents {}
.section__style .style__contents .style-list { display: grid; grid-template-columns: repeat(5, 1fr); }
.section__style .style__contents .style__item { min-width: 0; }
.section__style .style__contents .style__item a { display: block; position: relative; overflow: hidden;}
.section__style .style__contents .style__item a img { display: block; width: 100%; height: auto; }
.section__style .style__contents .style__item a:before,
.section__style .style__contents .style__item a:after { content: ''; display: block; opacity: 0; transition: opacity 0.3s ease; }
.section__style .style__contents .style__item a:before { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.7); }
.section__style .style__contents .style__item a:after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 40px; height: 40px; background: url(/design/newcomfort/pc/img/icon_camera.svg) no-repeat center / auto 32px; }
.section__style .style__contents .style__item a:hover:before,
.section__style .style__contents .style__item a:hover:after,
.section__style .style__contents .style__item a:focus:after,
.section__style .style__contents .style__item a:focus:after { opacity: 1; }


/* ==================== SECTION : style popup ==================== */
body.popup-open { overflow: hidden; }
.style-popup { display: none; position: fixed; inset: 0; z-index: 10000; }
.style-popup.is-open { display: block; }
.style-popup__dim { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.55); }
.style-popup__panel { position: absolute; top: 50%; left: 50%; width: min(90vw, 800px); max-height: 60vh; padding: 32px; background: #fff; transform: translate(-50%, -50%); overflow-y: auto; }
.style-popup__close { all: unset; appearance: none; -webkit-appearance: none; position: absolute; top: 20px; right: 20px; width: 24px; height: 24px; font-size: 0; cursor: pointer; background: url('https://newcomfort.img11.kr/pc/_didot/img/ico_close.svg') no-repeat center / auto 24px; }

.style-popup__content { display: grid; grid-template-columns: 40% 1fr; align-items: center; gap: 20px; }
.style-popup__thumb { overflow: hidden; }
.style-popup__thumb img { width: 100%; }

.style-popup__product {}
.style-popup__product-thumb { overflow: hidden; }
.style-popup__product-thumb a { display: block; }
.style-popup__product-thumb img { display: block; margin: 0 auto; width: auto; max-height: 250px; }
.style-popup__product-info { text-align: center; }
.style-popup__product-name { margin: 12px 0 8px; font-size: 20px; font-weight: 600; line-height: 1.25; }
.style-popup__product-price { font-size: 18px; line-height: 1.25; }
.style-popup__product-link { display: inline-block; margin-top: 20px; font-size: 13px; font-weight: 600; color: #777; border-bottom: 1px solid #777; line-height: 1.25; }


/* ==================== Footer option ==================== */
#footer { margin-top: 0!important; }
/* BASIC css end */