@charset "utf-8";

html, body{scroll-behavior:smooth;}
body{color:#000; text-align:justify; min-width:1200px;}
a{color:inherit;text-decoration: none;}
a:hover{color:inherit;}
img{max-width:100%; height:auto;}
.details{width:1200px;}
/* CSS Document */

/* banner */
.banner {padding: 38px 0 95px;background: #fff url(../images/black-friday-2024/bg1.jpg) no-repeat center top/100% auto;}
.banner h1 {text-align: center;margin-bottom: 30px;}
.banner h1>span {display: none;}
.banner-container{background-color:#fffcee;border-radius:15px;margin-top:30px;padding-bottom:30px;position:relative;box-shadow:rgba(0,0,0,0.1) 0px 20px 25px -5px,rgba(0,0,0,0.04) 0px 10px 10px -5px;}
.banner-title{position:relative;padding:10px;}
.banner-title h2{font-size:35px;font-weight:700;line-height:1.4;color:#000000;text-align: center;}
.banner-title h2 span{color:#ff9a4f;}
.switch-system{position:absolute;right:25px;top:50%;transform:translateY(-50%);}
.switch-flex{display:flex;justify-content:center;align-items:center;gap:15px;}
.switch-wrapper{display:inline-block;height:17px;margin:0;position:relative;width:33px;}
.switch-wrapper input{height:0;opacity:0;width:0;}
.switch-slider{border:1px solid #b5b5b5;border-radius:34px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.4s;}
input:checked+.switch-slider:before{left:calc(100% - 13px);}
.switch-slider:before{background-color:#3b97ff;border-radius:50%;bottom:2px;content:"";height:11px;left:2px;position:absolute;transition:.4s;width:11px;}
.system-item{display:flex;justify-content:center;align-items:center;gap:10px;color:#8b8b8b;font-weight:700;font-size:15px;}
.system-item img{filter:grayscale(100);}
.system-item.active{color:#3b97ff;}
.system-item.active img{filter:none;}
.banner-bar{background-color:#23242c;width:calc(100% + 20px);transform:translateX(-10px);margin-bottom:20px;}
.banner-bar-flex{display:flex;justify-content:center;align-items:center;min-height:40px;gap:15px;font-size:17px;color:#ffffff;line-height:1.4;}
.banner-bar-flex span{color:#ffff00;}
.banner-feature{padding:0 25px;}
.banner-feature-list{display:flex;justify-content:center;align-items:center;border-bottom:2px solid #ffc837;}
.banner-feature-item{padding:10px 40px 5px;display:flex;gap:15px;justify-content:center;align-items:center;border:2px solid transparent;transform:translateY(2px);cursor:pointer;}
.banner-feature-item.active{border-color:#ffc837;border-bottom-color:#ffffff;border-top-left-radius:10px;border-top-right-radius:10px;background-color:#ffffff;}
.detail-item-pic {width: 515px;flex-shrink: 0;}
.feature-item-title{font-size:19px;color:#333333;text-align:left;}
.feature-item-title span{color:#fa0707;}
.banner-feature-detail{background-color:#ffffff;padding:30px 15px;border-bottom-left-radius:10px;border-bottom-right-radius:10px;}
.banner-detail-item{display:none;}
.banner-detail-item.active{display:flex;justify-content:space-between;align-items:center;gap:45px;}
.detail-item-container{text-align:left;}
.detail-item-list li{position:relative;padding-left:20px;margin-bottom:10px;font-size:17px;color:#333333;}
.detail-item-list li::before{content:'';border-top: 5px solid transparent;border-left: 8px solid #ffb321;border-bottom: 5px solid transparent;position:absolute;left:0px;top:8px;}
.detail-item-list li span{background-color:#23242c;color:#ffffff;display:inline-block;padding:2px 5px;border-radius:3px;}
.detail-item-title{font-size:19px;color:#333333;margin-bottom:20px;}
.detail-item-title span{color:#fa2c2c;}
.banner-function{padding:25px 50px 15px;}
.banner-function-list{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;}
.banner-function-item{width:50%;box-sizing: border-box;position:relative;padding-left:25px;padding-right:10px;text-align:left;margin-bottom:20px;font-size:15px;}
.banner-function-item::before{content:'';display:block;width:19px;height:18px;background:url("../images/black-friday-2024/icon-check.png") no-repeat center;position:absolute;left:0;top:3px;}
.banner-purchase-flex{display:flex;justify-content:center;align-items:center;}
.anni-offer-select{background-color:#fff;display:flex;justify-content:center;align-items:center;border-top-left-radius:8px;border-bottom-left-radius:8px;position:relative;z-index:0;border:1px solid #fbbe59;border-right:0;gap:10px;width:380px;height:52px;cursor:pointer;}
.anni-offer-select-x{display:flex;}
.anni-offer-select-x > button{border:0 none;background-color:initial;font-size:19px;cursor:pointer;}
.anni-offer-select::before{content:'';display:block;background-image:url("../images/black-friday-2024/icon-checked.png");width:26px;height:26px;}
.anni-offer-select::after{content:'';display:block;background-image:url("../images/black-friday-2024/arrow-b.png");width:15px;height:10px;}
.anni-offer-option{position:absolute;left:0;right:0;background-color:#fff;top:50%;z-index:-1;padding:30px 5px 5px;border-radius:5px;display:none;}
.anni-offer-option li button{border:0 none;background-color:initial;font-size:17px;line-height:2.3;width:100%;cursor:pointer;}
.anni-offer-option li button:hover{background-color:#eee;}
.anni-offer-option li + li button{border-top:1px solid #eee;}
.anni-offer-price-x{position:relative;padding-left:10px;}
.anni-offer-price-x::before{content:'';position:absolute;top:-2px;bottom:-3px;left:0;width:1px;background-color:#cecece;transform:rotate(25deg);}
.anni-offer-price del{font-size:17px;color:#7b7b7b;}
.anni-offer-price b{font-size:27px;color:#fa7c44;}
.banner-buy-button a{display:inline-block;background-color:#fa7c43;color:#ffffff;font-size:21px;font-weight:700;padding:15px 20px;border-top-right-radius:5px;border-bottom-right-radius:5px;}
.banner-purchase-more{font-size:15px;color:#64625e;padding-top:25px;text-align: center;}
.banner-purchase-more>img {margin-left: 15px;}

/* product */ 
.product {padding: 56px 0 50px;background: #fdfbf1 url(../images/black-friday-2024/bg2.jpg) no-repeat center top/100% auto;}
.product h2 {font-size: 32px;color: #fff;font-weight: 600;text-align: center;line-height: 1;margin-bottom: 50px;}
.product-cards {display: flex;justify-content: center;flex-wrap: wrap;gap: 14px;color: #333;}
.product-card {width: 593px;background-color: #fff;border-radius: 25px;}
.product-lists {padding: 36px 36px 28px;display: flex;justify-content: center;flex-wrap: wrap;gap: 71px;}
.product-item {width: 225px;position: relative;}
.product-item:first-child::before,.product-item:first-child::after {content: "";width: 28px;height: 4px;background-color: #ffba42;border-radius: 2px;position: absolute;top: 50%;right: -44px;}
.product-item:first-child::after {transform: rotate(90deg);}
.product-title {font-size: 19px;line-height: 1.3;font-weight: 600;display: flex;align-items: center;gap: 14px;}
.product-title>span>i {font-style: normal;}
.product-tag {display: inline-block;font-size: 15px;color: #fff;line-height: 21px;padding: 0 15px;background-color: #8fc31f;margin: 15px 0 12px;}
.product-intro {font-size: 15px;line-height: 1.5;text-align: left;}
.product-price {font-size: 28px;color: #acacac;line-height: 1;font-weight: 600;margin: 12px 0;text-decoration: line-through;}
.product-spec {font-size: 15px;color: #2b2b2b;line-height: 1;}
.product-spec>i {font-style: normal;}
.product-bundle {min-height: 208px;border: 2px solid #ffd966;border-radius: 0 0 25px 25px;box-sizing: border-box;background-color: #fdfbf1;padding: 24px 10px 20px;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;gap: 28px;}
.bundle-price-button {min-width: 220px;}
.bundle-price {font-size: 15px;color: #ff6600;line-height: 1;margin-bottom: 12px;display: flex;justify-content: center;align-items: center;gap: 6px;}
.bundle-price>b {font-size: 35px;line-height: 1;color: #ff400b;}
.bundle-buttons {display: flex;justify-content: center;}
.bundle-buttons>a {width: 100%;box-sizing: border-box;padding: 0 10px;font-size: 23px;color: #fff;font-weight: 600;line-height: 50px;display: flex;justify-content: center;align-items: center;gap: 16px;background-color: #ff9333;border-radius: 10px;box-shadow: 0 0 15px 0 #ff9333;}

/* lottery */
.lottery {padding: 43px 0 76px;background: #fdfbf1 url(../images/black-friday-2024/arrow.jpg) no-repeat center 810px;text-align: center;color: #2b2b2b;}
.lottery h2 {display: flex;justify-content: center;align-items: center;font-size: 35px;color: #000;line-height: 1;font-weight: 600;gap: 6px;}
.input-wrap {display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;gap: 20px;padding: 22px 0 30px;}
.input-wrap p {font-size: 21px;line-height: 1.1;}
.input-email {display: flex;flex-wrap: wrap;}
.input-email>input {width: 180px;height: 38px;box-sizing: border-box;border: 1px solid #ffd39a;border-right: none;outline: none;border-radius: 5px 0 0 5px;padding: 0 5px 0 42px;background: #fff url(../images/black-friday-2024/email.png) no-repeat 10px center;font-size: 15px;color: #000;}
.input-email>input::-webkit-input-placeholder {color: #6a6969;}
.input-email>button {min-width: 115px;padding: 0 5px;border: none;outline: none;font-size: 17px;color: #000;line-height: 38px;background-color: #ffbe00;border-radius: 0 5px 5px 0;cursor: pointer;}
.cards {display: flex;justify-content: space-between;flex-wrap: wrap;gap: 18px;perspective: 9000px;}
.card {width: 387px;height: 210px;border-radius: 20px;position: relative;cursor: pointer;transform-style: preserve-3d;transition: all 0.6s;}
.card.active {transform: rotateY(180deg);}
.card-before {position: absolute;bottom: 0;left: 0;border-radius: 20px;overflow: hidden;backface-visibility: hidden;}
.card-before>b {width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;font-size: 37px;color: #fff;line-height: 1.1;position: absolute;top: 0;left: 0;}
.card-before>span {visibility: hidden;opacity: 0;transition: all 0.2s;width: 200px;box-sizing: border-box;padding: 5px 8px;background-color: #fff;border: 1px dashed #000;border-radius: 4px;font-size: 15px;color: #333;line-height: 1.3;position: absolute;bottom: 10px;left: 50%;margin-left: -101px;}
.cards:not(.unban) .card-before:hover>span {visibility: visible;opacity: 1;}
.card-before>span::before {content: "";width: 30px;height: 30px;background: url(../images/black-friday-2024/deny.png);position: absolute;left: -15px;top: -5px;}
.cards-content {display: none;}
.card-after {backface-visibility: hidden;transform: rotateY(180deg);width: 100%;height: 100%;padding: 10px 35px;box-sizing: border-box;border: 1px solid #000;border-radius: 20px;background-color: #fff;display: flex;flex-direction: column;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;}
.card-title {font-size: 21px;line-height: 1.2;}
.card-title>b {color: #ff400b;}
.card-intro {font-size: 15px;line-height: 1.5;margin: 12px 0 14px;text-align: left;}
.card-intro>a {color: #006cff;text-decoration: underline;}
.card-buttons {display: flex;justify-content: center;}
.card-button {line-height: 38px;padding: 0 22px;background-color: #ed7d31;border-radius: 5px;font-size: 17px;color: #fff;box-shadow: 0 0 10px 0 #ed7d31;}
.card-button:hover {color: #fff;}
.card-empy {position: absolute;bottom: 0;left: 6px;}
.chances-left {font-size: 19px;color: #ff400b;line-height: 1;padding-top: 35px;}
.download-intro {display: flex;justify-content: center;align-items: center;gap: 15px;font-size: 21px;line-height: 1;margin-bottom: 56px;}
.product-box {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;gap: 35px;}
.box-right {width: 600px;text-align: left;}
.box-title {font-size: 30px;line-height: 1;font-weight: 600;}
.box-title>b {color: #ff9e2c;}
.box-title+h4 {font-size: 23px;color: #179bfd;line-height: 1.1;padding: 18px 0 24px;}
.box-intro {font-size: 17px;line-height: 1.6;margin-bottom: 24px;}
.box-buttons {display: flex;flex-wrap: wrap;gap: 17px;}
.box-button {min-width: 228px;height: 48px;box-sizing: border-box;padding: 0 10px;border-radius: 4px;display: flex;justify-content: center;align-items: center;gap: 15px;font-size: 20px;color: #fff;background-color: #179bfd;}
.box-button:hover {color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);}
.box-button:last-child {background-color: #ff9407;}

.faq {padding: 70px 0;background-color: #ffffff;}
.faq h2 {font-size: 35px;color: #000;line-height: 1;font-weight: 600;text-align: center;padding-bottom: 30px;}
.qes_one{border-bottom: 1px solid #e6e6e6;padding: 18px 0 8px;text-align: left;}
.qes_one .t{font-size: 19px;cursor: pointer; padding-bottom: 10px;padding-right: 30px;position: relative;}
.qes_one .t:after{position: absolute;right: 0;top: 3px; content: "";display: inline-block;width: 19px;height: 19px;color:#77b5fb;background: linear-gradient(currentColor, currentColor) no-repeat center / 100% 3px, linear-gradient(currentColor, currentColor) no-repeat center / 3px 100%}
.qes_one .qes_ans{color: #737480;display: none;}
.qes_one.focus .t:after{background: linear-gradient(currentColor, currentColor) no-repeat center / 100% 3px;}
.qes_one.focus .qes_ans{display: block;}
.qes_one a { color: #2691fc; }

.aside-box {width: 152px;border: 1px solid #ff9333;border-radius: 5px;background-color: #fdfbf1;position: fixed;bottom: 100px;left: 10px;text-align: center;cursor: pointer;}
.aside-box>img {margin-top: -35px;}
.aside-box>b {display: block;font-size: 17px;line-height: 1.1;color: #fff;margin: -35px 0 10px;position:relative;z-index:0;}
.aside-box>b>span {position:absolute;-webkit-text-stroke:.22em #000;left:0;right:0;top: 0;z-index:-1;}

@media (max-width:979px){
	.aside-box {display: none;}
	body{min-width:100%;}
	.details{width:98%; margin:0 1%;}
	/* CSS Document */

	.switch-system{position:static;transform:translateY(0);}
	.banner-detail-item.active {justify-content: center;}
	.banner-feature {padding: 0 5px;}
	.banner-feature-item{padding:10px 10px 5px;}
	.detail-item-pic {width: 100%;text-align: center;}
	.feature-item-title{font-size:15px;}
	.banner-detail-item{flex-wrap:wrap;}
	.detail-item-list li{font-size:15px;}
	.banner-function {padding: 20px 10px 5px;}
	.banner-function-item{font-size:13px;}
	.banner-title h2{font-size:23px;}
	.banner-bar {width: 100%;transform: none;}
	.banner-bar-flex{font-size:15px;}

	.input-wrap,.cards {justify-content: center;}
}

@media (max-width:767px){
	.banner-feature-list {border-bottom: none;align-items: stretch;}
	.banner-feature-item {flex-direction: column;}
	.banner-feature-item.active {padding: 5px;border: none;box-shadow: inset 0 0 0 2px #ffc837;border-radius: 6px;}

	.product-item:first-child::before, .product-item:first-child::after {display: none;}
	.product-lists {gap: 30px;}
	.product-item {width: 100%;}

	.product h2,.lottery h2,.card-before>b,.box-title,.faq h2 {font-size: 25px;}

}

@media (max-width:479px){
	.banner {padding: 20px 0 50px;}

	.detail-item-pic img{width:100%;max-width:100%;}
	.banner-function{padding:30px 15px;}
	.banner-purchase-flex{flex-wrap:wrap;gap:15px;}
	.anni-offer-select{max-width:330px;width:100%;border-radius:5px;box-sizing:border-box;border:1px solid #fbbe59;}
	.banner-buy-button a{font-size:17px;border-radius:5px;}

}