body{font-family:sans-serif;margin:0;box-sizing:border-box;background-color:#273036}ul,h1,h2,h3,h4,h5,h6,p{margin:0}li{list-style:none}li a{color:#fff;text-decoration:none}.heroSection{background:url(/images/hero-section.webp);background-size:cover;background-repeat:no-repeat;height:700px;position:relative}.heroSection:after{content:"";position:absolute;width:100%;height:60px;bottom:-30px;background-color:#273036;transform:rotate(2deg)}header{display:flex;justify-content:space-between;padding:16px 16px 0}@media (max-width: 1024px){header{flex-direction:column}}header .responsive{display:flex;justify-content:space-between}header .logo{color:#fff;position:relative;line-height:1}header .logo .large{color:red;font-size:40px}header .logo .rotateText{border:1px solid red;position:absolute;right:-44px;top:18px;padding:2px 10px;transform:rotate(90deg)}header nav{display:block;margin:auto}header nav ul{padding:0;display:flex;gap:8px;justify-content:center;align-items:center}@media (max-width: 768px){header nav .links{margin-top:16px}}header nav .links a{margin-left:20px}@media (max-width: 768px){header nav .links a{font-size:14px;margin-left:10px}}header nav .menus{background:#0F2027;background:-webkit-linear-gradient(to right,#0F2027,#203A43,#2C5364);background:linear-gradient(to right,#0F2027,#203A43,#2C5364);border-radius:50px;margin-top:16px;max-width:593px;width:100%}header nav .menus .icon-button{display:inline-flex;align-items:center;color:#fff;cursor:pointer;font-size:16px}header nav .menus li{display:flex;justify-content:center;color:#fff}header nav .menus li:first-child{padding-left:16px}@media (max-width: 680px){header nav .menus li{flex-wrap:wrap}header nav .menus li p{display:none}}header nav .menus .search{background:#f12711;background:-webkit-linear-gradient(to bottom,#f12711,#f5af19);background:linear-gradient(to bottom,#f12711,#f5af19);border-radius:50px;padding:24px;color:#fff}header nav .menus .search .search-icon{width:24px;height:24px}header .search-content{color:#fff;display:flex;justify-content:center;align-items:center;gap:10px;padding-top:16px}header .search-content .search-text{position:relative}header .search-content .search-text input{background:linear-gradient(to right,#ff7b00,#f12711);width:580px;height:72px;border:none;border-radius:50px;padding:0 32px}header .search-content .search-text input::placeholder{color:#feb179}@media (max-width: 768px){header .search-content .search-text input{width:480px}}@media (max-width: 620px){header .search-content .search-text input{width:380px}}@media (max-width: 480px){header .search-content .search-text input{width:260px}}@media (max-width: 390px){header .search-content .search-text input{width:240px}}header .search-content .search-text .hint{position:absolute;right:5%;top:40%;translate:transformY(-40%);font-size:12px}header .search-content .closeSearch{font-size:32px;rotate:45deg}header .rightIcons{display:block}@media (max-width: 1024px){header .rightIcons{display:none}}header .mobileIcons{display:none}@media (max-width: 1024px){header .mobileIcons{display:block}}.icon{width:24px;height:24px;margin:0 8px}.icon.menu{display:none}@media (max-width: 1024px){.icon.menu{display:inline-flex}}.chevron-down{width:16px;height:16px;margin:0 8px}.title{color:#fff;padding-left:10%;height:500px;display:flex;flex-direction:column;justify-content:center}.title .bullet{width:10ch;background:gray;color:#fff;font-size:10px;padding:5px;border-radius:4px;text-align:center}.title .heading{font-size:32px;padding:16px 0}.title .price{display:flex;align-items:center;gap:40px}.title .price .discount{background:orangered;color:#fff;font-size:12px;width:28px;height:12px;padding:5px 1px 5px 5px;position:relative;border-radius:2px 0 0 2px}.title .price .discount:before{content:"";position:absolute;top:0;right:-8px;width:10px;height:12px;padding:5px 0;background:orangered;transform:skew(10deg);border-radius:0 2px 2px 0}.title .price .original{font-size:32px}.contents{padding:0 10% 56px;z-index:1}.contents .heading{display:flex;justify-content:space-between;align-items:center;padding:56px 0}.contents .heading p{font-size:24px;color:#fff}.contents .heading button{background:transparent;border:1px solid gray;padding:5px 10px;border-radius:5px;color:#fff}.contents .container{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}@media (max-width: 768px){.contents .container{grid-template-columns:repeat(1,1fr)}}.contents .container .content .product{position:relative}.contents .container .content .product img{max-width:100%;max-height:100%;object-fit:cover;border-radius:10px}.contents .container .content .product .discount{background:orangered;color:#fff;font-size:12px;width:28px;height:12px;padding:5px 1px 5px 5px;position:absolute;bottom:3px;left:0;border-radius:2px 0 0 2px}.contents .container .content .product .discount:before{content:"";position:absolute;top:0;right:-8px;width:10px;height:12px;padding:5px 0;background:orangered;transform:skew(10deg);border-radius:0 2px 2px 0}.contents .container .content .description{padding-top:8px;display:flex;justify-content:space-between;align-items:center;color:#fff}.contents .container .content .description .chip{color:gray;border:1px solid gray;padding:2px;border-radius:2px;margin-right:4px}.modal-background{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;align-items:self-start;justify-content:center;z-index:2}.modal-background .modal-content{margin-top:160px;background:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:20px;border-radius:5px;box-shadow:0 2px 10px #0003;color:#fff;width:500px}.modal-background .modal-content .heading{background:#0F2027;background:-webkit-linear-gradient(to right,#0F2027,#203A43,#2C5364);background:linear-gradient(to right,#0F2027,#203A43,#2C5364);display:flex;justify-content:space-between;align-items:center;padding:8px 16px;border-radius:8px;line-height:1}.modal-background .modal-content .options{display:grid;grid-template-columns:repeat(3,1fr);padding:32px 0}@media (max-width: 480px){.modal-background .modal-content .options{grid-template-columns:repeat(2,1fr)}}.modal-background .modal-content .options .icon-button{display:flex;align-items:center;font-size:14px;padding:8px}.modal-background .modal-content .options .icon-button:hover{background:rgba(0,0,0,.2);border-radius:50px}.modal-background .modal-content .options .icon-button.gift{flex-direction:column;justify-content:center}.modal-background .modal-content .options .icon-button img{width:40px;height:40px;border-radius:50px;margin-right:8px}