body {
	background-image: url(../i/bg.jpg);
	background-repeat: repeat-x;
}
.footer_01 {
	font-size: 12px;
	text-align: center;
	padding: 5px;
	color: #333;
	background-image: url(../i/02.jpg);
	background-repeat: repeat-x;
	height: 45px;
}

/* 
商品按鈕
 **/
.color_btn_red a{background-image: url(../i/34-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_red a:hover{background-image: url(../i/34-2.jpg);}
.color_btn_red .in{background-image: url(../i/34-2.jpg);}

.color_btn_orange a{background-image: url(../i/35-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_orange a:hover{background-image: url(../i/35-2.jpg);}
.color_btn_orange .in{background-image: url(../i/35-2.jpg);}

.color_btn_yellow a{background-image: url(../i/36-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_yellow a:hover{background-image: url(../i/36-2.jpg);}
.color_btn_yellow .in{background-image: url(../i/36-2.jpg);}

.color_btn_green a{background-image: url(../i/37-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_green a:hover{background-image: url(../i/37-2.jpg);}
.color_btn_green .in{background-image: url(../i/37-2.jpg);}

.color_btn_blue a{background-image: url(../i/38-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_blue a:hover{background-image: url(../i/38-2.jpg);}
.color_btn_blue .in{background-image: url(../i/38-2.jpg);}

.color_btn_indigo a{background-image: url(../i/39-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_indigo a:hover{background-image: url(../i/39-2.jpg);}
.color_btn_indigo .in{background-image: url(../i/39-2.jpg);}

.color_btn_purple a{background-image: url(../i/40-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_purple a:hover{background-image: url(../i/40-2.jpg);}
.color_btn_purple .in{background-image: url(../i/40-2.jpg);}

.color_btn_gray a{background-image: url(../i/41-1.jpg);background-repeat: no-repeat;height: 43px;width: 43px;display: block;}
.color_btn_gray a:hover{background-image: url(../i/41-2.jpg);}
.color_btn_gray .in{background-image: url(../i/41-2.jpg);}

/* 
商品背景
 **/
#product_area {
	height: 233px;
	width: 822px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#product_area .red_bg{
	background-image: url(../i/product_red_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .red_bg{
	background-image: url(../i/product_red_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .orange_bg{
	background-image: url(../i/product_orange_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .yellow_bg{
	background-image: url(../i/product_yellow_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .green_bg{
	background-image: url(../i/product_green_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .blue_bg{
	background-image: url(../i/product_blue_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .indigo_bg{
	background-image: url(../i/product_indigo_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .purple_bg{
	background-image: url(../i/product_purple_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}
#product_area .gray_bg{
	background-image: url(../i/product_gray_bg.jpg);
	background-repeat: no-repeat;
	height: 233px;
	width: 822px;
}

/*
測驗 上卦
 **/
.up_red {background-image: url(../i/up_red_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_red a {background-image: url(../i/up_red_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_red a:hover {	background-image: url(../i/up_red_2.jpg);}

.up_orange {background-image: url(../i/up_orange_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_orange a {background-image: url(../i/up_orange_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_orange a:hover {	background-image: url(../i/up_orange_2.jpg);}

.up_yellow {background-image: url(../i/up_yellow_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_yellow a {background-image: url(../i/up_yellow_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_yellow a:hover {	background-image: url(../i/up_yellow_2.jpg);}

.up_green {background-image: url(../i/up_green_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_green a {background-image: url(../i/up_green_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_green a:hover {	background-image: url(../i/up_green_2.jpg);}

.up_blue {background-image: url(../i/up_blue_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_blue a {background-image: url(../i/up_blue_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_blue a:hover {	background-image: url(../i/up_blue_2.jpg);}

.up_indigo {background-image: url(../i/up_indigo_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_indigo a {background-image: url(../i/up_indigo_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_indigo a:hover {	background-image: url(../i/up_indigo_2.jpg);}

.up_purple {background-image: url(../i/up_purple_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_purple a {background-image: url(../i/up_purple_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_purple a:hover {	background-image: url(../i/up_purple_2.jpg);}

.up_gray {background-image: url(../i/up_gray_2.jpg); background-repeat: no-repeat; background-position: center center;}
.up_gray a {background-image: url(../i/up_gray_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.up_gray a:hover {	background-image: url(../i/up_gray_2.jpg);}

/* 
測驗 下卦
 **/
.bottom_red {background-image: url(../i/bottom_red_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_red a {background-image: url(../i/bottom_red_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_red a:hover {	background-image: url(../i/bottom_red_2.jpg);}

.bottom_orange {background-image: url(../i/bottom_orange_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_orange a {background-image: url(../i/bottom_orange_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_orange a:hover {	background-image: url(../i/bottom_orange_2.jpg);}

.bottom_yellow {background-image: url(../i/bottom_yellow_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_yellow a {background-image: url(../i/bottom_yellow_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_yellow a:hover {	background-image: url(../i/bottom_yellow_2.jpg);}

.bottom_green {background-image: url(../i/bottom_green_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_green a {background-image: url(../i/bottom_green_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_green a:hover {	background-image: url(../i/bottom_green_2.jpg);}

.bottom_blue {background-image: url(../i/bottom_blue_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_blue a {background-image: url(../i/bottom_blue_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_blue a:hover {	background-image: url(../i/bottom_blue_2.jpg);}

.bottom_indigo {background-image: url(../i/bottom_indigo_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_indigo a {background-image: url(../i/bottom_indigo_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_indigo a:hover {	background-image: url(../i/bottom_indigo_2.jpg);}

.bottom_purple {background-image: url(../i/bottom_purple_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_purple a {background-image: url(../i/bottom_purple_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_purple a:hover {	background-image: url(../i/bottom_purple_2.jpg);}

.bottom_gray {background-image: url(../i/bottom_gray_2.jpg); background-repeat: no-repeat; background-position: center center;}
.bottom_gray a {background-image: url(../i/bottom_gray_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.bottom_gray a:hover {	background-image: url(../i/bottom_gray_2.jpg);}

/* 
測驗 輔助色
 **/
.other_red {background-image: url(../i/other_red_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_red a {background-image: url(../i/other_red_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_red a:hover {	background-image: url(../i/other_red_2.jpg);}

.other_orange {background-image: url(../i/other_orange_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_orange a {background-image: url(../i/other_orange_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_orange a:hover {	background-image: url(../i/other_orange_2.jpg);}

.other_yellow {background-image: url(../i/other_yellow_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_yellow a {background-image: url(../i/other_yellow_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_yellow a:hover {	background-image: url(../i/other_yellow_2.jpg);}

.other_green {background-image: url(../i/other_green_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_green a {background-image: url(../i/other_green_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_green a:hover {	background-image: url(../i/other_green_2.jpg);}

.other_blue {background-image: url(../i/other_blue_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_blue a {background-image: url(../i/other_blue_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_blue a:hover {	background-image: url(../i/other_blue_2.jpg);}

.other_indigo {background-image: url(../i/other_indigo_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_indigo a {background-image: url(../i/other_indigo_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_indigo a:hover {	background-image: url(../i/other_indigo_2.jpg);}

.other_purple {background-image: url(../i/other_purple_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_purple a {background-image: url(../i/other_purple_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_purple a:hover {	background-image: url(../i/other_purple_2.jpg);}

.other_gray {background-image: url(../i/other_gray_2.jpg); background-repeat: no-repeat; background-position: center center;}
.other_gray a {background-image: url(../i/other_gray_2.jpg); background-repeat: no-repeat; display: block; height: 263px; width: 300px;}
.other_gray a:hover {	background-image: url(../i/other_gray_2.jpg);}