@charset "utf-8";

/** font **/
@import url(Noto+Sans+TC.css);

*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{width:100%; height:auto;font-size:10px;}
body{background:#ffffff; margin:0; padding:0; width:100%; height:auto; font-size: 1.7rem;line-height: 1.8;font-family:"Arial", "Noto Sans TC", system-ui;word-break: break-word;letter-spacing: 1px; overflow-y: scroll;color: #555555;}
a,a:hover{text-decoration:none;transition: all 0.5s ease 0s;cursor: pointer;}
img{border:0; vertical-align:middle; max-width:100%;}
input{vertical-align:middle;border-radius: 0; }
input:focus, select:focus, textarea:focus, button:focus{outline:0;}
/** 取消ios按鈕樣式 **/
input[type="button"], input[type="submit"], input[type="reset"], button[type="button"], button[type="submit"], button[type="reset"], a[type="button"], a[type="submit"], a[type="reset"], textarea{border-radius: 0; -webkit-appearance: none;-moz-appearance: none;appearance: none;}
table{border-collapse:inherit;}
.warpper{}
@media screen and (max-width:1024px){
    body{font-size:4vw;}
}

/** 表單預設文字顏色設定 **/
::-webkit-input-placeholder{color:#999999;}
::-moz-placeholder{color:#999999;}
:-ms-input-placeholder{color:#999999;}
input:-moz-placeholder{color:#999999;}
#field2::-webkit-input-placeholder{color:#999999;}
#field3::-webkit-input-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-webkit-input-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
#field2::-moz-placeholder{color:#999999;}
#field3::-moz-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-moz-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}

/** 觀看名單 **/
.float-list{display: block;position: fixed;bottom:16%;right: 0;z-index: 10000; filter: drop-shadow(0px 10px 2px rgba(0, 0, 0, .2));}
.float-list a{display: block;}
.list-p{display: block;}
.list-m{display: none;}
@keyframes float-list
{
0% {bottom:16%;}
50%{bottom:18%;}
100%{bottom:16%;}
}
@-moz-keyframes float-list /* Firefox */
{
0% {bottom:16%;}
50%{bottom:18%;}
100%{bottom:16%;}
}
@-webkit-keyframes float-list /* Safari 和 Chrome */
{
0% {bottom:16%;}
50%{bottom:18%;}
100%{bottom:16%;}
}
@-o-keyframes float-list /* Opera */
{
0% {bottom:16%;}
50%{bottom:18%;}
100%{bottom:16%;}
}
.float-list {
animation: float-list 2s linear infinite;
-moz-animation: float-list 2s linear infinite;	/* Firefox */
-webkit-animation: float-list 2s linear infinite;	/* Safari 和 Chrome */
-o-animation: float-list 2s linear infinite;	/* Opera */
}
@media screen and (max-width:1024px){
    .float-list{bottom: 0;width: 100%;background: #f39800;filter: drop-shadow(0px 4px 5px rgba(0, 0, 0, 0));}
    .float-list:hover{background: #3b55aa;}
    .list-p{display: none;}
    .list-m{display: block;padding: 2vw 3vw;text-align: center;}
    .list-m .list-m-btn{color: #ffffff;font-size: 5vw;letter-spacing: 2vw;font-weight: 600;}
    .list-m img{position: absolute;bottom: 2vw;right: 3vw;max-width: 17vw;filter: drop-shadow(0px 4px 5px rgba(0, 0, 0, .22));}
    @keyframes float-list
    {
    0% {bottom:0%;}
    50%{bottom:0%;}
    100%{bottom:0%;}
    }
    @-moz-keyframes float-list /* Firefox */
    {
    0% {bottom:0%;}
    50%{bottom:0%;}
    100%{bottom:0%;}
    }
    @-webkit-keyframes float-list /* Safari 和 Chrome */
    {
    0% {bottom:0%;}
    50%{bottom:0%;}
    100%{bottom:0%;}
    }
    @-o-keyframes float-list /* Opera */
    {
    0% {bottom:0%;}
    50%{bottom:0%;}
    100%{bottom:0%;}
    }
}

/** 暗窗名單 **/
.list {position: fixed;left: 0;top: 0;z-index:99999;width: 100%;height: 100vh;line-height: 1.8;-webkit-box-sizing: border-box;box-sizing: border-box;opacity: 0;visibility: hidden;pointer-events: none;transition: all .5s;}
.list .b-closed {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;background-color: rgba(0, 0, 0, .8);opacity: 0;transition: all .5s;}
.list .list-info {position: absolute;left: 50%;top: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);width: 500px;max-width: 90%;opacity: 0;background-color: #fff;transition: all .5s;box-shadow: 0 0 0 20px rgba(255,255,255,.5);border: 1px #f39800 solid; padding: 20px; overflow: hidden;}
.list .list-content {max-height: 85vh;overflow-y: auto;}
.list img {display: block;max-width: 100%;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.list .closed {position: absolute;right:15px;top:15px;z-index: 1;width:50px;height:50px;display: flex;align-items: center;justify-content: center;padding: 10px;}
.list.show {opacity: 1;visibility: visible;pointer-events: auto;}
.list.show .b-closed, .list.show .list-info {opacity: 1;}
@media screen and (max-width:1024px){
    .list .list-info {width: 94vw;max-width: calc(96% - 6vw);padding: 3vw;box-shadow: 0 0 0 3vw rgba(255,255,255,.5);}
    .list .closed {right:1vw;top:1vw;width:11vw;height:11vw;}
}

/** 上版 **/
header{padding: 25px 15px;border-bottom: 1px #cccccc solid;}
.header{max-width: 1280px;margin: 0 auto;}
.header .logo{width: 270px;margin:0 auto;}
.header .logo a{display: block;}
@media screen and (max-width:1024px){
    header{padding: 2.5vw 15px;}
	.header .logo{width: 63vw;}
}

/** banner **/
.banner-main{}
.banner{}
.banner img{width: 100%;}
.banner .banner-c{display: block;}
.banner .banner-m{display: none;}
@media screen and (max-width:1024px){
	.banner .banner-c{display:none;}
    .banner .banner-m{display: block;}
}

/** 內容 **/
main{}
.main{}
.i-title-main{margin: 0 0 10px 0;line-height: 1.4;}
.i-title-main .i-title{padding:40px 0 0 0;margin: 0;font-weight: 500;font-size: 3.8rem;color: #222222;background: url("../images/title_bg.svg")no-repeat center top;background-size: 74px;text-align: center;letter-spacing: 0.8rem;text-shadow: -1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff;}
@media screen and (max-width:1024px){
	.i-title-main .i-title{padding:10.8vw 0 0 0;font-size:8.6vw;letter-spacing: .5vw;background: url("../images/title_bg.svg")no-repeat center top;background-size: 19vw;}
}

/** 首頁活動資訊 **/
.i-activity-main{padding: 4.5% 15px;position: relative;background: url("../images/decorate001.png")no-repeat center top;}
.i-activity-main:after{content: "";display: block;width:800px; height: 440px;background: url("../images/decorate002.png")no-repeat center center;position: absolute;bottom: -6%;left:-6%;z-index: 1;}
.i-activity{max-width: 1170px; margin: 0 auto;position: relative;z-index: 2;}
.i-activity-content{background: rgba(243,152,0,.1);padding: 20px;position: relative;}
.i-activity-content:after{content: "";display: block;width: 393px;height: 129px;background: url("../images/decorate003.png")no-repeat top center;position: absolute;bottom: -53px;left: calc(50% - 196.5px);}
.i-activity-content>ul{list-style: none;padding:20px;margin: 0;background: rgba(255,255,255,.8);border: 1px #f39800 solid;}
.i-activity-content>ul>li{padding:30px 0;margin: 0;display: flex;border-bottom: 1px #dddddd solid;}
.i-activity-content>ul>li:last-of-type{border-bottom: 0;}
.i-activity-content>ul>li .i-activity-title-main{width: 160px;display: flex;align-items: center;height: 100%;margin: 0 40px 0 0;}
.i-activity-content>ul>li .i-activity-title-main .i-activity-title-icon{width: 40px;position:relative;z-index: 1;margin: 0 25px 0 0;}
.i-activity-content>ul>li .i-activity-title-main .i-activity-title-icon:after{content: "";display: block;width: 30px; height: 30px; background: rgba(243,152,0,.1);position: absolute;top: -.8rem;right: -.8rem;border-radius: 60px;z-index: -1;}
.i-activity-content>ul>li .i-activity-title-main .i-activity-title{flex: 1;font-size: 2.2rem;font-weight: 500;color: #f39800;line-height: 1.4;}
.i-activity-content>ul>li .i-activity-info{flex: 1;padding: 6px 0;color: #666666;}
.i-activity-content>ul>li .i-activity-info>ol{list-style: cjk-ideographic;padding: 0;margin: 0 0 0 4rem;}
.i-activity-content>ul>li .i-activity-info>ul{list-style:square;padding: 0;margin: 0 0 0 2rem;}
.i-activity-content>ul>li .i-activity-info>ol>li{padding: 0;margin: 0;}
.i-activity-content>ul>li .i-activity-info>ol>li>ol{padding: 0;margin: 0 0 0 2.8rem;}
.i-activity-content>ul>li .i-activity-info .i-activity-download{display: flex;margin: 0 0 10px 0;}
.i-activity-content>ul>li .i-activity-info .i-activity-download .i-activity-download-title{color: #ffffff;background: #3b55aa;border-radius: 5px;text-align: center;width: 93px;height: 100%;padding: 3px 10px;margin:0 10px 10px 0;}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul{flex: 1; list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li{padding: 0;margin:3px 10px 6px 10px;width: calc(100%/2 - 20px);}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li a{display: flex;color: #666666;}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li a:hover{color: #3b55aa;}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li .i-activity-download-icon{width: 24px;margin: 0 10px 0 0;filter:drop-shadow(0px 2px 2px rgba(0,0,0,.3));}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li .i-activity-download-dep{flex: 1;font-size: 1.6rem;color: #666666;padding: 5px 0;}
.i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li:hover .i-activity-download-dep{color: #3b55aa;}
.privacy-btn{font-size: 2rem;text-align: center;display: flex;align-items: center;justify-content: center;margin: calc(3% + 53px) 0 0 0;}
.privacy-btn i{width: 34px;margin: 0 10px 0 0;height: 34px;display: flex;align-items: center;justify-content: center;}
.privacy-btn i img{width: 34px;}
.privacy-btn a{display: flex;align-items: center;justify-content: center;color: #ffffff;padding: 11.6px 18px;border: 5px #167063 solid;border-radius: 3px;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#167063+0,2b9384+100 */
background: linear-gradient(to bottom,  #167063 0%,#2b9384 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
.privacy-btn a:hover{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2b9384+0,167063+100 */
background: linear-gradient(to bottom,  #2b9384 0%,#167063 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
@media screen and (max-width:1420px){
    .i-activity:after{top: -2%;right: -15px;}
}
@media screen and (max-width:1024px){
    .i-activity-main{padding: 7% 15px ;}
    .i-activity-main:after{display: none;}
    .i-activity-content{padding: 3vw;}
    .i-activity-content:after{width: 38.38vw;height: 12.599vw;bottom: -4.19vw;left: calc(50% - 19.19vw);background: url("../images/decorate003.png")no-repeat top center;background-size: 38.38vw;}
    .i-activity-content>ul{padding:3vw;;}
	.i-activity-content>ul>li{padding:5vw 0;display: block;}
    .i-activity-content>ul>li .i-activity-title-main{width:100%;margin: 0 0 2.5vw 0;}
    .i-activity-content>ul>li .i-activity-title-main .i-activity-title-icon{width: 9.5vw;margin: 0 4vw 0 0;}
    .i-activity-content>ul>li .i-activity-title-main .i-activity-title-icon:after{width: 7vw; height: 7vw; top: -2vw;right: -2vw;}
    .i-activity-content>ul>li .i-activity-title-main .i-activity-title{font-size: 5.3vw;}
    .i-activity-content>ul>li .i-activity-title-main .i-activity-title br{display: none;}
    .i-activity-content>ul>li .i-activity-info{width: 100%; padding: 0;}
    .i-activity-content>ul>li .i-activity-info>ol{margin: 0 0 0 9vw;}
    .i-activity-content>ul>li .i-activity-info>ul{margin: 0 0 0 5vw;}
    .i-activity-content>ul>li .i-activity-info>ol>li>ol{margin: 0 0 0 6vw;}
    .i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li{margin:3px 0px 3px 0px;width: calc(100%/1 - 0px);}
    .i-activity-content>ul>li .i-activity-info .i-activity-download .i-activity-download-title{width:9vw;margin:0 3vw 0 0;height: auto;display: flex;align-items: center;}
    .i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li .i-activity-download-icon{width: 5.8vw;margin: 0 2vw 0 0;}
    .i-activity-content>ul>li .i-activity-info .i-activity-download>ul>li .i-activity-download-dep{font-size: 3.8vw;padding: 1vw 0;}
    .privacy-btn{font-size: 4.8vw;margin: calc(3% + 4.19vw) 0 0 0;}
    .privacy-btn i{width: 8.321vw;margin: 0 2vw 0 0;height: 8.321vw;}
    .privacy-btn i img{width: 8.321vw;}
}

/** 線上報名 **/
.i-registration-main{padding: 4.5% 15px;background: #eef2ff;}
.i-registration{max-width: 1280px; margin: 0 auto;}
@media screen and (max-width:1024px){
    .i-registration-main{padding: 7% 15px;}
}

/** 內頁 **/
.content-body{max-width: 1280px;margin: 0 auto;padding: 4.5% 15px;}
.page-main{color: #222222;}
.font001{font-size: 2rem;font-weight: 500;margin: 25px 0 10px 0;color: #f39800;}
.font001:first-of-type{margin: 0 0 10px 0;color: #f39800;}
@media screen and (max-width:1024px){
    .content-body{padding:7% 15px;}
    .font001{font-size: 4.8vw;margin: 5vw 0 2vw 0;}
}

/** 隱私權 **/
.privacy{border: 1px #3b55aa solid;box-shadow: 0 0 0 15px rgba(59,85,170,.1); padding: 30px;margin: 40px 15px 0 15px; }
.privacy>ol{list-style: cjk-ideographic;padding: 0;margin: 0 0 0 4rem;}
.privacy>ul{list-style:square;padding: 0;margin: 0 0 0 2rem;}
@media screen and (max-width:1024px){
    .privacy{box-shadow: 0 0 0 3vw rgba(59,85,170,.1); padding: 4vw;margin: 7vw 2.8vw 0 2.8vw; }
    .privacy>ol{margin: 0 0 0 9vw;}
    .privacy>ul{margin: 0 0 0 5vw;}
}

/** 表單欄位 **/
.form-box{}
.form-note{background: #181d61;padding: 15px; border-radius: 10px;font-size: 2.2rem;text-align: center;color: #ffffff;margin: 0 0 25px 0;}
.note{color: #f70d0d;text-align: center;margin: 20px 0 0 0;}
.form-notice{background: rgba(255,240,215,.7);padding: 20px;border-bottom: 1px #cccccc dashed;border-top: 1px #cccccc dashed;color: #666666;margin: 35px 0;}
.form-notice-title{color: #f70d0d;margin: 0 0 5px 0;}
.form-notice>ol{list-style: cjk-ideographic;padding: 0;margin: 0 0 0 4rem;}
.form-notice>ul{list-style:square;padding: 0;margin: 0 0 0 2rem;}
.form-notice>ol>li{padding: 0;margin: 0;}
.form-block-mian{display: flex;flex-wrap: wrap;border-bottom: 1px #cccccc solid;margin: 0 0 20px 0;}
.form-block{flex: 1;padding: 12px 20px 12px 0;border-right: 1px #cccccc solid;}
.form-block:nth-child(even){border-right: 0;padding: 12px 0 12px 20px;}
.form-block-title{font-size: 2rem; color: #222222;font-weight: 500;display: table;border-bottom: 3px #3b55aa solid;margin:0 10px 10px 10px;}
.form-block:nth-child(even) .form-block-title{border-bottom: 3px #f39800 solid;}
.star{color: #f70d0d;font-size: 1.5rem;padding: 0 ;}
.form-box label{width: calc(100%/2);display:flex;flex-wrap: wrap; align-items: center;}
.form-box input[type="radio"]{margin: 0 10px 0 0;}
.form-box input[type="date"]{display: block;}
.form-box input, .form-box img{vertical-align:middle;}
.opinion-main{display:flex; flex-wrap:wrap;width: 100%;}
.opinion{flex: 1;width: 100%; display:flex; flex-wrap:wrap; margin:6px 10px;padding:0; overflow:hidden;}
.opinion2{width: 100%; margin:0px 0px 0px 22px;padding:0; overflow:hidden;}
.opinion-left01{width: 100%; padding:4px 0;font-family:"Arial", "Noto Sans TC", system-ui;color:#666666;}
.opinion-left02{width: 100%; padding:4px 0;font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;}
.input-main-style01{background: #ffffff; flex:1; width:100%; border:1px #cccccc solid;margin:0; padding:4px 15px;font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;  min-height:42px;font-size:1.7rem;display: flex;flex-wrap: wrap;align-items: flex-start;}
.input-main-style02{background: #ffffff;flex:1; width:100%;border:1px #cccccc solid; margin:0; padding:4px 15px;font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;  min-height:42px;font-size:1.7rem;}
.input-main-style03{background: #ffffff; width:100%; border:1px #cccccc solid;margin:5px 0 0 0; padding:4px 15px; font-family:"Arial", "Noto Sans TC", system-ui;color:#222222;  min-height:42px;font-size:1.7rem;}
.input-main-style04{background: none; flex:1; width:100%; border:0;margin:0; padding:4px 15px 4px 0; font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;  min-height:42px;font-size:1.7rem;}
.input-main-style04 label{width:100%;}
.input-main-style04 input{margin: 0 10px;}
.input-main-style05{background: #ffffff; flex:1; width:100%; border:1px #cccccc solid;margin:0; padding:4px 15px;font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;  min-height:42px;font-size:1.7rem;display: flex;flex-wrap: wrap;align-items: flex-start;}
.input-main-style06{background: #ffffff; width:110px; border:1px #cccccc solid;margin:0; padding:4px 15px;font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;  min-height:42px;font-size:1.7rem;display: flex;flex-wrap: wrap;}
.input-main-select{background:none; flex:1; width:100%; border:0; margin:0; padding:0; font-family:"Arial", "Noto Sans TC", system-ui; color:#222222; display:flex; flex-wrap:wrap;}
.input-main-select select{flex: 1; margin:0; font-family:"Arial", "Noto Sans TC", system-ui; border:1px #cccccc solid; color:#222222;  min-height:42px;appearance:none;-moz-appearance:none;-webkit-appearance:none;background:#f3f3f3 url("../images/select-icon.svg")no-repeat right 10px center;background-size: 10px;padding: 4px 35px 4px 15px;font-size:1.7rem;}
.select-style{background:#8a6e0c;  color:#f3f3f3; line-height:20px; padding:5px 10px; border:0;}
.input-style01{background:#f4f8fb; flex:1; width:100%; border:0; margin:0; padding:5px 15px; font-family:"Arial", "Noto Sans TC", system-ui; color:#222222;  min-height:42px;}
input{accent-color: #181d61;}
input:disabled{background-color:#fff; color:#2d7fb9; cursor:no-drop;}
.btn.openlink{margin:3px 0; padding:0 10px; text-align:center;  line-height:1.5; font-weight:bold; background-color:#2d7fb9; color:#fff; border-radius:5px;}
.btn.openlink:hover{background-color:#ffbe00;}
img.code{width:100px; height:42px; margin:0; vertical-align:middle; display:inline-block;}
.pay-main{padding:0;font-size: 1.7rem; color: #333333;border-radius:0;margin: 15px 0 ;}
.input-main-style01:focus, .input-main-style02:focus, .input-main-style03:focus, .input-main-select select:focus{border: 1px #181d61 solid;}
@media screen and (max-width:1024px){
    .form-note{padding: 3vw;font-size: 5.3vw;}
    .form-notice{padding: 3vw;margin: 4vw 0;}
    .form-notice>ol{margin: 0 0 0 9vw;}
    .form-notice>ul{margin: 0 0 0 5vw;}
    .form-block-mian{display:block;margin: 0 0 4vw 0;}
    .form-block{flex:initial;padding: 0 0 3vw 0;border-right: 0;}
    .form-block:nth-child(even){border-right: 0;padding: 0 0 3vw 0;}
    .form-block-title{font-size: 4.8vw;margin:0 0 3vw 0;border-bottom: 0.8vw #3b55aa solid;}
    .form-block:nth-child(even) .form-block-title{border-bottom: 0.8vw #f39800 solid;}
    .star{font-size:3.2vw;}
    .opinion-main{display:block;}
	.opinion{display:block;flex: initial;margin: 6px 0;}
    .opinion2{margin:0px 0px 0px 5vw;}
    .opinion-main{display:flex; flex-wrap:wrap;width: 100%;}
	.opinion-left01{width:100%;}
	.input-main-style01{font-size:4vw;padding:1vw 2vw;min-height:10.148vw;}
    .input-main-style02{font-size:4vw;padding:1vw 2vw;min-height:10.148vw;}
    .input-main-style03{font-size:4vw;padding:1vw 2vw;min-height:10.148vw;}
    .input-main-style04{font-size:4vw;padding:1vw 2vw 1vw 0;min-height:10.148vw;}
    .input-main-style05{font-size:4vw;display: block;padding:1vw 2vw;min-height:10.148vw;}
    .input-main-style05 label{width:100%;}
    .input-main-style06{font-size:4vw;display: block;padding:1vw 2vw;min-height:10.148vw;width: 24.158vw;}
    .input-main-select select{font-size:4vw;min-height:10.148vw;}
    .input-style01{min-height:10.148vw;}
    .pay-main{font-size: 4vw;}
}

/** 按鈕 **/
.cart-btn{padding:0; text-align:center; margin-top:40px; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;font-size: 1.8rem;}
.cart-btn i{width: 27px;margin: 0 10px 0 0;height: 27px;display: flex;align-items: center;justify-content: center;}
.cart-btn i img{width: 27px;}
a.btn-mail{display: flex;align-items: center;justify-content: center;color: #ffffff;padding: 5.8px 20px;margin: 0 5px ; border: 4px #643b24 solid;border-radius: 3px;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#643b24+0,845941+100 */
background: linear-gradient(to bottom,  #643b24 0%,#845941 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
a.btn-mail:hover{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#845941+0,643b24+100 */
background: linear-gradient(to bottom,  #845941 0%,#643b24 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
a.btn-send{display: flex;align-items: center;justify-content: center;color: #ffffff;padding: 5.8px 20px;margin: 0 5px ;border: 4px #dc4854 solid;border-radius: 3px;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#dc4854+0,f07a84+100 */
background: linear-gradient(to bottom,  #dc4854 0%,#f07a84 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
a.btn-send:hover{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f07a84+0,dc4854+100 */
background: linear-gradient(to bottom,  #f07a84 0%,#dc4854 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
@media screen and (max-width:1024px){
    .cart-btn{font-size: 4.2vw;margin-top:6vw;}
    .cart-btn i{width: 6.8vw; height: 6.8vw; margin: 0 2vw 0 0;}
    .cart-btn i img{width: 6.8vw;}
	a.btn-mail{ width:calc(50% - 1vw);padding: 2vw 3vw;margin: 0 1vw 0 0;}
	a.btn-send{width:calc(50% - 1vw);padding: 2vw 3vw;margin: 0 0 0 1vw;}
}

/** 送出訊息 **/
.jump-window-box{max-width:500px;background: #ffffff; margin:0 auto; border:1px #ccc solid; padding:20px; border-radius:5px;}

/** 頁次 **/
.page{font-size: 1.5rem; color:#555555; text-align:center; clear:both; margin:40px 0 0 0;}
.page a{background:#555555; color:#ffffff; padding:4px 15px;margin: 10px 0;display: inline-block;}
.page a:hover{background:#3f9bb2;}
.page br{display:none;}
@media screen and (max-width:640px){
	.page br{display:block;}
}

/** 下版 **/
footer{background: #f9f9f9; border-top: 1px #cccccc solid;padding: 2.5% 15px;}
.footer{max-width:1280px; margin:0 auto;position: relative;display: flex;align-items: center;}
.footer .f-logo{width: 270px;}
.footer .f-content{flex: 1; color: #222222;line-height: 2;}
.footer .f-content>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.footer .f-content>ul>li{width: auto;margin: 0 0 0 6%;}
.footer .f-content a{display: inline-block;color: #222222;}
.footer .f-content a:hover{color: #e95550;}
.footer .copyright{font-size: 1.2rem;color: #cccccc; position: absolute;bottom: 0;right: 0;text-align: right;letter-spacing: 0;text-transform: uppercase;line-height: 1.4;}
.footer .copyright span{display: block;}
.footer .copyright span a{display:block;color: #cccccc;}
.footer .copyright span a:hover{color: #e95550;}
@media screen and (max-width:1024px){
    footer{padding:7% 15px 18% 15px;}
    .footer{display: block;}
    .footer .f-logo{width: 63vw;margin: 0 auto 4vw auto;}
    .footer .f-content>ul>li{width: 100%; margin:0;}
    .footer .copyright{font-size:2.9vw;position: inherit;bottom: inherit;right: inherit;text-align: center;margin: 1vw 0 0 0;}
}

/** 抽獎頁面 **/
select {appearance:none;-moz-appearance:none;-webkit-appearance:none;background:#ffffff url(../images/form-select.svg)no-repeat right 10px center;background-size: 10px;}
select::-ms-expand { display: none; }
.lottery-main{padding: 15px 15px;background:url("../images/lottery_bg02.png")no-repeat right top,url("../images/lottery_bg03.png")no-repeat left bottom, url("../images/lottery_bg.jpg")no-repeat center center;background-size: cover;height: 100vh;background-attachment: fixed; display: flex;align-items: center;position: relative;}
.lottery-main .logo-lottery{width: 180px;margin:0 auto;position: fixed;top: 10px;left: 10px;}
.lottery-main .logo-lottery a{display: block;}
.lottery{max-width: 1170px; margin: 0 auto;width: 100%; background: rgba(255,255,255,.5);padding: 20px;max-height:calc(100vh - 30px);}
.lottery .lottery-content{background: #ffffff;padding:0; border: 1px #f39800 solid;}
.awards{display: flex;align-items: center;margin: 0;background:rgba(243,152,0,.1);padding:15px 20px;}
.awards .awards-brand{width: 100px;background: #ffffff; margin: 0 20px 0 0;border: 1px #dddddd solid;border-radius: 100px; overflow: hidden;padding: 10px;}
.awards .awards-choose{flex: 1;}
.awards .awards-choose .awards-choose-project{font-size: 24px;color: #666666;}
.awards .awards-choose .awards-choose-project select{font-size: 24px;color: #666666;padding: 8px 30px 8px 0;border:0;border-bottom: 1px #666666 solid;width: 100%;background:url(../images/form-select.svg)no-repeat right 10px center;background-size: 10px;}
.awards .awards-choose .awards-choose-note{font-size: 17px;color: #f39800;margin: 5px 0 0 0;}
.awards .awards-choose .awards-choose-note select{font-size: 17px;color: #f39800;border: 0;background: none; background-color: transparent;padding: 5px 0;pointer-events: none;width: 100%;}
.awards-content{display: flex;padding:15px 20px;max-height:calc(100vh - 202.45px);overflow-y: auto;}
.awards-content .awards-photo{width: 360px;margin: 0 25px 0 0;border-right: 1px #666666 solid;padding: 0 25px 0 0;}
.awards-content .awards-lottery-main{flex: 1;}
.awards-content .awards-lottery-main .awards-lottery{display: flex;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-num{flex: 2;margin: 0 25px 0 0 ;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-num>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;justify-content: center;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-num>ul>li{width: calc(100%/2 - 10px);padding:15px;margin: 5px;box-shadow: 0 0 15px 0 rgba(0,0,0,.2) inset;border-radius: 10px;font-size: 100px;text-align: center;font-weight: 700;line-height: 1;max-width: 130px;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-btn{flex: 1; font-size: 24px;color: #ffffff;font-weight: 500;text-align: center;display: flex;flex-wrap: wrap;align-content: space-around;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-btn a{display: block;width: 100%; background: #ea5350;color: #ffffff;padding: 8px 20px; border-radius: 100px;margin: 5px 0;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-btn a:nth-child(2){background: #666666;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-btn a:hover{background: #1f51a2;}
.awards-content .awards-lottery-main .awards-lottery .awards-lottery-btn a:nth-child(2):hover{background: #222222;}
.awards-content .awards-lottery-main .awards-list{margin: 15px 0 0 0;}
.awards-content .awards-lottery-main .awards-list .awards-list-title{font-size: 26px;font-weight: 700;text-align: center;background: #eef2ff;padding:3px 15px;margin: 0 0 3px 0;}
.awards-content .awards-lottery-main .awards-list>ul{list-style: none;padding: 0;margin: 0;height: 221.97px;overflow-y: auto;display: flex;flex-wrap: wrap;}
.awards-content .awards-lottery-main .awards-list>ul>li{width: 100%;padding: 0;margin: 0;display: flex;align-items: center; font-size: 22px;font-weight: 400;text-align: center;border-bottom: 1px #dddddd dashed;}
.awards-content .awards-lottery-main .awards-list>ul>li:last-of-type{border-bottom: 0;}
.awards-content .awards-lottery-main .awards-list>ul>li .awards-list-num{width: 80px;padding:2px 10px;}
.awards-content .awards-lottery-main .awards-list>ul>li .awards-list-name{flex: 1;padding:2px 10px;}
::-webkit-scrollbar-track {background-color: #e4dbcb;}
::-webkit-scrollbar {width: 6px;background-color: black;}
::-webkit-scrollbar-thumb {background-color: #f39800;}

/** 得獎總名單 **/
.winning{max-height:calc(100vh - 72.45px);overflow-y: auto;}
.winning>ul{list-style: none;padding: 0;margin: 0;}
.winning>ul>li{margin: 0;background:rgba(243,152,0,.1);padding:15px 20px;border-bottom: 1px #dddddd solid;}
.winning>ul>li:last-of-type{border-bottom:0;}
.winning>ul>li .winning-content{width: 100%; display: flex;align-items: center;}
.winning>ul>li .winning-content .winning-brand{width: 80px;background: #ffffff; margin: 0 20px 0 0;border: 1px #dddddd solid;border-radius: 100px; overflow: hidden;padding: 10px;}
.winning>ul>li .winning-content .winning-project-main{flex: 1;}
.winning>ul>li .winning-content .winning-project-main .winning-project{font-size: 22px;color: #666666;font-weight: 500;}
.winning>ul>li .winning-content .winning-project-main .winning-project-note{font-size: 17px;color: #f39800;margin: 0;}
.winning>ul>li .winning-winner{width: 100%;margin: 10px 0 0 0;background:#ffffff;}
.winning>ul>li .winning-winner>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;justify-content:center;}
.winning>ul>li .winning-winner>ul>li{padding:5px 10px;margin: 0; width: calc(100%/5);text-align: center;font-size: 22px;font-weight: 400;border-right: 1px #dddddd solid;}
.winning>ul>li .winning-winner>ul>li:nth-child(5n){border-right:0;}
.winning>ul>li .winning-winner>ul>li:last-of-type{border-right:0;}