/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, figure, mark ,main {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    background: transparent;
}
body {line-height: 1; -webkit-text-size-adjust: none;}
ol, ul { list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
a img {border: none;}
img {max-width: 100%;image-rendering: -webkit-optimize-contrast;}
.clean { clear:both;}
a {color: #333333; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; /* for Firefox */hlbr:expression(this.onFocus=this.blur());}
a:hover {text-decoration:none;}
a:focus{ -moz-outline-style: none;}

h1, h2, h3, h4, h5 {
	text-decoration: inherit;
	font: inherit;
	font-weight: inherit;
}

body {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	background: url(../images/main_bk_top.webp) no-repeat center top var(--all-bk);
}

* {
	box-sizing: border-box;
}

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
	width: 50px;
}


/*基本變數*/
:root {
	/*基本*/
	--white-color:#ffffff;
	--black-color:#333333;
	--gray-color:#808080;
	--all-bk:#6a0791;
	--family-basic:"Noto Sans TC",Verdana;
	--movie:all 0.3s ease;

	/*顏色*/
	--basic-red:#be1000;
	--basic-orange:#fa6a2e;
	--basic-orange2:#f96c26;
	--basic-orange3:#f24a22;
	--basic-yellow:#ffde5b;
	--date-light-green:#dbf7e8;
	--date-normal-green:#248c56;
	--date-light-yellow:#fbf6b6;
	--date-normal-yellow:#b47200;
	--date-light-blue:#d7f6ff;
	--date-normal-blue:#0072b4;
	--primary-red: #c0392b;
	--bg-green: #e8f8f5;
	--bg-yellow: #fef9e7;
	--bg-blue: #effbff;
	--bg-purple:#5a0d7b;
	--product-tab-purple:#630f87;

}


/*PC
-----------------------------------------------------------------*/


/*通用框架*/
.container {
	width:100%;
	margin: auto;
	font-family: var(--family-basic);
}

.block-center {
	width: 100%;
	clear: both;
	max-width: 1200px;
	margin: 0 auto;
}

.active-space {
	background:url(../images/main_bk_normal.webp) no-repeat center top var(--all-bk);
}

.set-big-title-pc {
	width: 100%;
	text-align: center;
	line-height: 0px;
	padding: 0 20px;
}

.set-big-title-pc img {
	display: inline-block;
}

.set-big-title-885 ,.set-big-title-600 ,.set-big-title-455 {
	display: none;
	line-height: 0px;
	padding: 0 20px;
}



/*主視覺*/
.block-main {
	width: 100%;
	clear: both;
	padding: 70px 0;
	text-align: center;
	min-height: 720px;
}

.main-ipad ,.main-phone {
	display: none;
}

.main-title-space {
	width: 100%;
	display: inline-block;
	position: relative;
}

.main-title-words {
	position: relative;
	z-index: 0;
	margin: 20px 0 0 0;
	width: 100%;
	text-align: center;
}

.main-title-words img {
	display: inline-block;
}

.main-title-icon {
	position: absolute;
	top: -30px;
	width: 100%;
	z-index: 1;
	text-align: center;
}

.main-title-icon img {
	display: inline-block;
}

.main-title-sec {
	width: 100%;
	position: relative;
	top: -45px;
	text-align: center;
	z-index: 2;
}

.main-title-sec img {
	display: inline-block;
}

/*導覽列*/
.block-menu {
	width: 100%;
	text-align: center;
	position: sticky;
	top: 40px;
	z-index: 4;
}

.block-menu:has(.active) {
	background: var(--all-bk);
}

#mainNav {
	width: 100%;
	max-width: 1018px;
	margin: 0 auto;
	position: relative;
	padding: 10px 0;
	display: flex;
	gap: 20px;
	justify-content: center;
}

.nav-link {
	text-indent: -9999px;
	width: 185px;
	height: 56px;
	transition: var(--movie);
}

#mainNav a[href="#date"] {
	background:url(../images/menu1-b.webp) no-repeat center;
}

#mainNav a[href="#date"]:hover ,#mainNav a.active[href="#date"] {
	background:url(../images/menu1-a.webp) no-repeat center;
}

#mainNav a[href="#code"] {
	background:url(../images/menu2-b.webp) no-repeat center;
}

#mainNav a[href="#code"]:hover ,#mainNav a.active[href="#code"] {
	background:url(../images/menu2-a.webp) no-repeat center;
}

#mainNav a[href="#product"] {
	background:url(../images/menu3-b.webp) no-repeat center;
}

#mainNav a[href="#product"]:hover ,#mainNav a.active[href="#product"] {
	background:url(../images/menu3-a.webp) no-repeat center;
}



/*鎖定日期*/
.block-date {
	width: 100%;
	clear: both;
	padding: 60px 0 30px 0;
}

.block-date > h2 {
	text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
	width: 50px;
}

.block-date .block-center {
	line-height: 0;
}

/*鎖定日期內容*/
.date-main-space {

	border: 2px solid var(--white-color);
	padding: 20px;
	border-radius: 20px;
	background: #FFD792;
	background: linear-gradient(49deg, rgba(255, 215, 146, 1) 0%, rgba(255, 196, 93, 1) 100%);
	display: flex;
	gap: 20px;

	.infor {
		flex:5;
		display: flex;
        flex-wrap: wrap;
		gap: 20px;
		font-family: var(--family-basic);
	}

	.infor-box {
		width: 100%;
		border-radius: 20px;
		background: var(--white-color);
		display: inline-flex;
		overflow: hidden;
	}

	.infor-special {
		display: inline-flex;
		text-align: left;
		padding: 10px 20px;
		gap: 20px;
		align-content: flex-start;
        align-items: center;
		width: 100%;
		align-items: center;
	}

	.infor-icon {
		text-align: center;
		display: inline-flex;
		border-radius: 20px;
		overflow: hidden;
		justify-content: center;
        align-items: center;
	}

	.hotel .infor-icon {
		background: var(--date-light-green);
	}

	.coupon .infor-icon {
		background: var(--date-light-yellow);
	}

	.tkt .infor-icon {
		background: var(--date-light-blue);
	}

	.infor-good {
		width: 100%;
		text-align: left;
	}

	.infor-good span {
		font-size: 20px;
		line-height: 28px;
		margin: 0 0 18px 0;
		font-weight: 700;
	}

	.hotel .infor-good span {
		color: var(--date-normal-green);
	}

	.coupon .infor-good span {
		color: var(--date-normal-yellow);
	}

	.tkt .infor-good span {
		color: var(--date-normal-blue);
	}

	.infor-good h2 {
		font-weight: 800;
		color: var(--black-color);
		font-size: 28px;
		line-height: 35px;
	}

	.infor-good h2 strong {
		font-size: 40px;
		line-height: 45px;
		display: inline-block;
		margin: 0 2px;
		color: var(--basic-red);
	}

	.infor-good p {
		font-size: 15px;
		margin: 5px 0 0 0;
		line-height: 20px;
		color: var(--gray-color);
		font-weight: 400;
	}

	.infor-line {
		width: 30px;
		display: inline-block;
	}

	.hotel .infor-line {
		background: var(--date-light-green);
	}

	.coupon .infor-line {
		background: var(--date-light-yellow);
	}

	.tkt .infor-line {
		background: var(--date-light-blue);
	}

	.calendar-all {
		flex: 4;
		background: var(--white-color);
		border-radius: 20px;
	}

	.calendar-inside {
		display: flex;
		width: 100%;
 		justify-content: center;
	}

	.calendar-title {
		text-align: center;
		width: 100%;
		background: var(--basic-orange);
		color: var(--white-color);
		font-size: 25px;
		line-height: 32px;
		font-weight: 600;
		border-radius: 20px 20px 0 0;
        padding: 10px 0;
	}

	.calendar-table {
		display: grid;
		/* 七欄均分 */
		grid-template-columns: repeat(7, 1fr); 
		width: 100%;
		max-width: 600px;
		gap: 10px;
		text-align: center;
		padding: 5px;
	}

	/* 星期與日期的基礎設定 */
	.day-name, .day {
		font-size: 20px;
		line-height: 1.5; /* 即 30px */
		padding: 15px 5px;
		border-radius: 8px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	/* 週末顏色 */
	.weekend {
		color: var(--primary-red);
	}

	/* 優惠標籤樣式 */
	.label {
		font-size: 14px;
		line-height: 1.2;
		color: var(--primary-red);
	}

	.offer-green {
		background-color: var(--bg-green);
	}
	.offer-green .num {
		color: var(--primary-red); font-weight: bold;
	}

	.offer-yellow {
		background-color: var(--bg-yellow);
	}
	.offer-yellow .num {
		color: var(--primary-red); font-weight: bold;
	}

	.offer-blue {
		background-color: var(--bg-blue);
	}
	.offer-blue .num {
		color: var(--primary-red); font-weight: bold;
	}

}

/*領取優惠*/
.block-code {
	width: 100%;
	clear: both;
	padding: 30px 0 60px 0;
	line-height: 0;
}

/*領取優惠內容*/
.code-main-space {
	width: 100%;
	border: 2px solid var(--basic-orange2);
    padding: 10px;
    border-radius: 20px;
    background: #FFB477;
	background: linear-gradient(360deg, rgba(255, 180, 119, 1) 1%, rgba(255, 137, 42, 1) 100%);
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
}

.code-lucky-box {
	width: calc((100% - 20px) / 2);
	display: inline-flex;
	border-radius: 20px;
	overflow: hidden;
	background: #FCDDA8;
	background: linear-gradient(360deg, rgba(252, 221, 168, 1) 1%, rgba(255, 251, 245, 1) 100%);
}

.code-lucky-box:hover {
	background: #FCDDA8;
	background: linear-gradient(180deg, rgba(252, 221, 168, 1) 1%, rgba(255, 251, 245, 1) 100%);
}

.code-lucky-box.code-gray {
	width: calc((100% - 20px) / 2);
	display: inline-flex;
	border-radius: 20px;
	overflow: hidden;
	background: #DEDEDE;
	background: linear-gradient(0deg, rgba(222, 222, 222, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.code-lucky-box.code-gray:hover {
	background: #DEDEDE;
	background: linear-gradient(0deg, rgba(222, 222, 222, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.lucky-pa {
	display: inline-flex;
	border-right: 1px dashed #ffc25b;
	padding: 0 10px 5px 10px;
	color: var(--basic-orange3);
	font-family: var(--family-basic);
	gap: 5px;
	align-items: center;
    max-width: 145px;
    width: 100%;
    justify-content: center;
}

.code-gray .lucky-pa {
	border-right: 1px dashed #cccccc;
	color: var(--primary-red);
}

.lucky-pa strong {
	font-weight: 800;
    font-size: 70px;
    line-height: 70px;
    display: inline-block;
    letter-spacing: -3px;
}

.lucky-pa strong i {
	font-size: 30px;
	line-height: 20px;
	font-style: normal;
}

.lucky-pa span {
	display: inline-flex;
	font-weight: 500;
	width: 30px;
	font-style: normal;
	align-items: flex-end;
    align-content: flex-end;
	flex-wrap: wrap;
	padding: 25px 0 0 0;
}

.lucky-pa span b ,.lucky-pa span i {
	width: 100%;
	display: inline-block;
	font-size: 15px;
	line-height: 20px;
	font-style: normal;
}

.lucky-infor {
	padding: 10px 0 10px 10px;
    text-align: left;
    font-family: var(--family-basic);
    flex: 3;
	display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
	gap: 5px;
}

.lucky-infor-title {
	font-size: 28px;
	color: var(--basic-red);
	font-weight: 800;
	line-height: 34px;
}

.lucky-infor-text {
	font-weight: 500;
	width: 100%;
	font-size: 14px;
	line-height: 20px;
}

.lucky-infor-text strong {
	font-weight: 700;
}

.lucky-infor-limit {
	width: 100%;
	font-size: 15px;
	line-height: 22px;
	color: var(--basic-orange3);
	font-weight: 500;
}

.code-gray .lucky-infor-limit {
	color: var(--primary-red);
}

.code-gray .lucky-infor-limit::before {
	width: 20px;
	height: 20px;
	content: '';
	background: url(../images/code_time_icon.webp) no-repeat center;
	display: inline-block;
	margin: 0 4px -4px 0;
}

.lucky-but {
	display: inline-flex;
    background: url(../images/code_take_but_bk.webp) no-repeat top right;
    width: 170px;
    flex: 2;
    align-items: center;
    justify-content: flex-end;
	padding: 0 16px 0 0;
}

.lucky-but span {
	display: inline-block;
	width: 100px;
	height: 100px;
	background: url(../images/code_take_but-a.webp) no-repeat center;
}

.code-lucky-box:hover .lucky-but span {
	background: url(../images/code_take_but-b.webp) no-repeat center;
}

.code-gray .lucky-but {
	display: inline-flex;
    background: url(../images/code_take_but_bk_nolink.webp) no-repeat top right;
    width: 170px;
    flex: 2;
    align-items: center;
    justify-content: flex-end;
	padding: 0 12px 0 0;
}

.code-gray .lucky-but span {
	display: inline-block;
	width: 100px;
	height: 26px;
	background: url(../images/code_take_nolink.webp) no-repeat center;
}

.code-lucky-box.code-gray:hover .lucky-but span {
	background: url(../images/code_take_nolink.webp) no-repeat center;
}

.code-notice-space {
	width: 100%;
	border-radius: 20px;
	background: var(--bg-purple);
	padding: 20px;
	display: inline-block;
	margin: 20px 0 0 0;
	font-family: var(--family-basic);
	color: var(--white-color);
}

.code-notice-big-title {
	text-align: center;
	font-size: 30px;
	line-height: 36px;
	margin: 0 0 25px 0;
	font-weight: 800;
}

.code-step-space {
	width: 100%;
	display: inline-flex;
	gap: 30px;
	justify-content: center;
	border-bottom: 1px dashed #7d00b3;
	padding: 0 0 25px 0;
	margin: 0 0 25px 0;
}

.code-step-box {
	display: inline-flex;
	gap: 10px;
	align-items: center;
}

.code-step-num {
	width: 42px;
	height: 42px;
	border-radius: 100px;
	background: var(--basic-yellow);
	display: inline-flex;
	font-size: 27px;
	font-style: italic;
	font-weight: 800;
	line-height: 42px;
	color: var(--bg-purple);
	align-items: center;
    justify-content: center;
}

.code-step-name {
	text-align: center;
	font-size: 20px;
	line-height: 28px;
	font-weight: 500;
}

.code-step-name strong {
	font-weight: 700;
}

.code-step-name a ,.product-more a {
	color: var(--basic-yellow);
	display: inline-block;
}

.code-step-name a:hover ,.product-more a:hover {
	color: var(--date-light-yellow);
}

.code-step-name a::after ,.product-more a::after {
	content: '';
	width:20px;
	height: 20px;
	background: url(../images/icon_arrow.webp) no-repeat center;
	display: inline-block;
	margin: 0 0 -3px 4px;
}

.code-notice-area {
	width: 100%;
	text-align: left;
	font-family: var(--family-basic);
}

.code-notice-small-title {
	font-size: 20px;
	font-weight: 600;
	line-height: 26px;
	margin: 0 0 10px 0;
	font-weight: 500;
}

.code-notice-list {
	width: 100%;
}

.code-notice-list li {
	margin: 0 0 5px 20px;
	list-style: decimal;
	line-height: 20px;
	font-size: 15px;
	font-weight: 300;
}

.code-notice-list a {
	text-decoration: underline;
	text-underline-offset: 0.2em;
	color: var(--white-color);
}

.code-notice-list a:hover {
	color: var(--basic-yellow);
}

/*本月熱銷推薦*/
.block-product {
	width: 100%;
	background: url(../images/product_bk.webp) no-repeat center top #7512a0;
	padding: 60px 0 120px 0;
}

section.block-product {
	scroll-margin-top: 80px;
}

.product-big-title {
	padding: 0 5px 30px 5px;
	width: 100%;
	text-align: center;
}

.product-big-title img {
	display: inline-block;
}

.infor-tab-top {
	display: flex;
	gap: 10px;
	margin-bottom: 15px;
	justify-content: center;
}

.infor-tab-but {
	cursor: pointer;
	padding: 10px 40px;
	background: var(--product-tab-purple);
	border-radius: 100px;
	text-align: center;
	color: var(--basic-yellow);
	font-size: 25px;
	line-height: 30px;
	font-weight: 600;
	font-family: var(--family-basic);
	transition: var(--movie);
}

.infor-tab-but:hover ,.infor-tab-but.active {
	background: #FFF5CE;
	background: linear-gradient(180deg, rgba(255, 245, 206, 1) 1%, rgba(255, 234, 135, 1) 100%);
	color: var(--product-tab-purple);
}

.infor-tab-content {
	display: none;
}

.infor-tab-content.active {
	display: block;
}

.product-infor-text {
	width: 100%;
	max-width: 940px;
	margin: 0 auto;
	font-size: 15px;
	line-height: 24px;
	color: var(--white-color);
	font-family: var(--family-basic);
	font-weight: 400;
	text-align: center;
	padding: 0 5px 30px 5px;
}

.product-space {
	width: 100%;
	text-align: center;
	font-family: var(--family-basic);
	display: inline-flex;
	gap: 20px;
	flex-wrap: wrap;
	justify-content: center;
}

.product-box {
	border-radius: 20px;
	display: inline-flex;
    width: calc((100% - 60px) / 4);
    transition: var(--movie);
    flex-wrap: wrap;
    flex-direction: column;
}

.product-box:hover {
	/* translateY 是 Y 軸位移，負數代表往上 */
	transform: translateY(-5px); 
	/* 搭配陰影讓浮動感更真實 */
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
	.product-pic img {
		opacity: .9;
	}
}

.product-pic {
	width: 100%;
	position: relative;
	display: inline-block;
	flex: 1;
	line-height: 0;
}

.product-pic img {
	border-radius: 20px 20px 0 0;
	display: inline-block;
}

.product-pic span {
	display: inline-block;
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 106px;
	height: 39px;
	padding: 3px 0 0 0px;
    font-size: 24px;
    line-height: 30px;
    text-align: left;
	background: url(../images/product_area_bk.webp) no-repeat center left;
	z-index: 3;
}

.product-pic span:empty {
	display: none;
}

.product-pic span b {
	font-weight: 600;
	width: 80px;
	display: inline-block;
	text-align: center;
}

.product-inside {
	padding: 15px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    flex: 5;
    align-content: space-between;
	background: var(--white-color);
	border-radius: 0 0 20px 20px;
}

.product-name {
	width: 100%;
	text-align: left;
	color: var(--black-color);
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
	display: inline-block;
}

.product-price {
	color: var(--black-color);
	text-align: right;
	width: 100%;
	font-size: 15px;
	line-height: 20px;
	font-weight: 500;
	display: inline-block;
}

.product-price strong {
	color: var(--basic-red);
	font-size: 24px;
	line-height: 30px;
	font-weight: 800;
	display: inline-block;
	margin: 0 2px;
}

.product-more {
	text-align: right;
	width: 100%;
	margin: 20px 0 0 0;
}

.product-more a {
	font-size: 20px;
	line-height: 28px;
	font-weight: 600;
}



/*中間調度區
-----------------------------------------------------------------*/
@media screen and (max-width: 1600px) {
	html,
    body {
        width: 100%;
        min-height: 100%;
	}

	
}

@media screen and (max-width: 1200px) {
	.block-main {
		padding: 0;
		min-height: auto;
	}

	.main-ipad {
		display: inline-block;
		text-align: center;
		line-height: 0;
	}

	body {
		background: var(--all-bk);
	}

	.lucky-but {
		background: var(--basic-orange3);
		width: auto;
		border-left: 2px solid #ffe072;
		padding: 0;
        align-items: center;
        justify-content: center;
		padding: 5px;
		flex: 1;
	}

	.code-gray .lucky-but {
		background: #efebe7;
		width: auto;
		border-left: 2px solid var(--white-color);
		padding: 0;
        align-items: center;
        justify-content: center;
		padding: 5px;
		flex: 1;
	}

	.product-box {
		width: calc((100% - 40px) / 3 );
	}

	.product-space ,.product-more ,.block-date .block-center {
		padding: 0 5px;
	}

	.block-code {
		padding: 30px 5px 60px 5px;
	}

	.product-more {
		text-align: center;
	}

	/*消失*/
	.block-main .block-center ,.date-main-space .infor-icon {
		display: none;
	}

}

@media screen and (max-width:900px) {
	.set-big-title-885 {
		width: 100%;
		text-align: center;
		display: inline-block;
	}

	.set-big-title-885 img {
		display: inline-block;
	}

	.set-big-title-pc {
		display: none;
	}

	.date-main-space {
		align-items: flex-start;
		flex-wrap: wrap;
    	flex-direction: column;
		padding: 10px;
        gap: 10px;
	}

	.date-main-space .infor {
		flex: unset;
		flex-wrap: nowrap;
		width: 100%;
	}

	.date-main-space .calendar-all {
		width: 100%;
		flex: unset;
	}

	.date-main-space .calendar-table {
		max-width: unset;
	}

	.code-main-space {
		gap: 10px;
	}

	.lucky-pa {
		max-width: 120px;
	}

	.lucky-but ,.code-gray .lucky-but {
		display: none;
	}

	.lucky-infor-title {
		font-size: 28px;
		line-height: 34px;
	}

	.lucky-pa strong {
		font-size: 60px;
	}

	.code-step-name {
		text-align: left;
	}

	.code-step-space {
		flex-wrap: wrap;
		gap: 10px;
	}

	.code-step-box {
		width: 40%;
	}

	.date-main-space .day-name,.date-main-space .day {
		padding: 5px;
	}

}


/*平板
-----------------------------------------------------------------*/

@media screen and (max-width: 768px) {
	html {
		scroll-behavior: smooth;
	}

	.set-big-title-600 {
		width: 100%;
		text-align: center;
		display: inline-block;
	}

	.set-big-title-600 img {
		display: inline-block;
	}

	.product-box {
		width: calc((100% - 20px) / 2 );
	}

	.date-main-space .infor-good h2 {
		font-size: 25px;
        line-height: 30px;
	}

	.date-main-space .infor-line {
		width: 14px;
	}

	.date-main-space .infor {
		gap: 10px;
	}

	.code-lucky-box ,.date-main-space .infor-box ,.date-main-space .calendar-all ,.code-gray.code-lucky-box {
		border-radius: 10px;
	}

	.date-main-space .calendar-title {
        border-radius: 10px 10px 0 0;
	}

	/*消失*/
	.block-menu ,.set-big-title-885 ,.date-main-space .infor-good p {
		display: none;
	}
}


/*中間調度區
-----------------------------------------------------------------*/

@media screen and (max-width:600px) {
	.main-phone {
		display: inline-block;
		text-align: center;
		line-height: 0;
	}

	.code-lucky-box ,.code-gray.code-lucky-box {
		width: 100%;
	}

	.lucky-pa {
		flex: 2;
    	max-width: 130px;
    	width: 100%;
		justify-content: center;
	}

	.lucky-but ,.code-gray .lucky-but {
		display: inline-flex;
	}

	.code-notice-space {
		padding: 10px;
	}

	.code-step-box {
		width: calc((100% - 20px) / 2);
		gap: 5px;
	}

	.code-step-name {
		font-size: 18px;
    	line-height: 24px;
	}
	
	.code-notice-big-title {
		margin: 0 0 10px 0;
		font-size: 25px;
        line-height: 28px;
	}

	.block-product {
		padding: 40px 0 140px 0;
	}

	.product-more {
		text-align: center;
	}

	.product-more a {
		text-align: center;
		display: inline-block;
		width: 100%;
		border-radius: 20px;
		border: 1px solid var(--basic-yellow);
		padding: 15px 20px;
	}

	.product-more a:hover {
		border: 1px solid var(--date-light-yellow);
	}

	/*消失*/
	.main-ipad ,.block-date ,.product-more a::after {
		display: none;
	}
}


/*手機
-----------------------------------------------------------------*/

@media (max-width: 480px) {
	.set-big-title-455 {
		width: 100%;
		text-align: center;
		display: inline-block;
	}

	.set-big-title-455 img {
		display: inline-block;
	}

	.product-box {
		width:100%;
	}

	.code-step-num {
		width: 30px;
    	height: 40px;
		font-size: 20px;
    	line-height: 40px;
	}

	.product-infor-text {
		text-align: left;
	}

	section.block-product {
		scroll-margin-top: 0px;
	}

	/*消失*/
	.set-big-title-600 ,.lucky-but ,.code-step-name a::after ,.code-gray .lucky-but {
		display: none;
	}

}


@media (max-width: 380px) {
	.code-step-box {
        width: 100%;
        max-width: 226px;
    }
}