footer{position: relative;z-index:99;}
img.kv_pp {animation: bounceInDown 1s;animation-delay: .5s;animation-fill-mode: backwards;}

.hand_left{display: block; width: 310px; height: 445px; position: fixed;left: -70px;top:260px; z-index: 1;}
.hand_right{display: block; width: 310px; height: 445px;position: fixed;right: -50px;top:280px; z-index: 1;}
.event_container{display: block;width: 100%; background-size:contain;background-position: top center;position: relative;color: #2b2b2b;background-color:#283a2a;padding-top: 100px;}
.event_container img{width: 100%;}
.event_logo{display: block;width: 131px; height:121px;  position:absolute; left: 10px; top:30px;}
.event_page_visual a{display: block; max-width:1050px; height:560px; margin:  0 auto;margin-bottom: 50px;background-position:50px ;position: relative; z-index:1;left:40px;}
.desc_content{display: block; max-width: 1200px; margin: 0 auto;position: relative; top: -200px;}
.desc_content section{display: block; width: 100%; padding:50px 80px; box-sizing: border-box; border-radius:50px;background-color: #f5e4c8;}
section h2{display: block; width:290px; height:92px;margin:auto; margin-bottom:50px;text-align: center;}
.event_method h2{margin-top:150px;}
.event_method p{text-align: center;font-weight:600;font-size:24px;}
.event_method ul {display: flex;justify-content: space-between;margin-top: 50px;flex-wrap: wrap;}
.event_method ul li {width:30%; margin-top: 10px;background-color: #fff; border-radius: 20px;border:2px solid #212121;position: relative;}
.event_method ul li:after{display: block; content: ""; width:0px; height:0px; border-style: solid; border-width:18px; border-color: transparent transparent transparent #000;position: absolute;right:-36px;top: 50%;}
.event_method ul li:nth-child(4):after{display: none;}
.event_method ul li:nth-child(4){margin-top:50px;width:100vw;}
    .event_method ul li div {
        display: block;
        background-color: #212121;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
        border-top-left-radius: 17px;
        border-top-right-radius: 17px;
    }
.event_method ul li span{display:block; text-align: center;font-weight: 600;color: #da5e3a;}
.event_method h3{font-size: 20px; color: #fff;font-weight: 600;}
.event_method ul li p{text-align: center;font-weight: 500;font-size: 18px;padding: 15px;}
.event_method ul li p i{color: #44cf13;}

.desc_content section.event_prize{background-color: #ca5331;}

.prize em{display:block;max-width:700px;height:54px; line-height:54px; background-color: #fff; border:1px solid #2b2b2b;box-sizing: border-box; border-radius: 10px;margin: 0 auto;overflow: hidden;font-weight: 500;box-shadow: 5px 5px 0px #ccb0a5;margin-bottom:50px;}
.prize em:before{display: inline-block; content: "填寫禮"; background-color: #2b2b2b; padding: 0 10px;color: #fff;margin-right: 10px;}
.prize{display: block; }
.prize_list{display: flex;    flex-wrap: wrap;    justify-content:space-between;    margin-bottom: 80px;}
.prize_list div{width:17%;    margin:15px;    text-align: center;}
.prize_list div a {color: #fff;}
.prize_list div p{font-size: 16px;font-weight: 400;}
.prize_list strong{display: block;}
.prize_list div img{border-radius: 15px;}

.announce p{font-size: 26px;font-weight: 600;color: #f4e3c7;text-align: center;}
.announce a{display: block; width:250px; height:45px;line-height:45px; text-align: center;background:#f4e3c7;margin: 0 auto;border-radius: 50px;font-weight: 600;margin-top: 50px;color:#ca5331;}
.announce a:hover{background-color:#2b2b2b;color:#f4e3c7; }

.desc_content section.notice_desc{background-color:#2b2b2b;}
.notice_desc ul { list-style-type: decimal;font-size: 16px;margin-left: 20px;}
.notice_desc ul li{ color: #fff;list-style-position:outside;margin-bottom: 10px;}



.desc_content section.sponser{position: relative;background-color: #fff; }
.sponser ul li {display:inline-block; width: 150px;margin: 15px;}
.sponser span a{display: inline-block; width: 25px; height: 25px;}
.btn_arrow{position: absolute;top:30%;}
.btn_arrow.left{left: 0;z-index:99;}
.btn_arrow.right{right: 0;z-index:99;}

.inner_logo{display: block; width:100px; height:70px;position: absolute;background-image:url(/images/event/2025/guess/inner_logo.png);top: 20px;left: 20px;}

.bottom_page_container{display: block; max-width: 1200px; margin: 0 auto;padding:50px 20px;box-sizing:border-box;color: #fff;}
.slide_window{display: block; max-width: 1000px;margin: 0 auto;position: relative;}
.bottom_page_container .show_up_img{position: relative;}

.bottom_page_container .show_up_designer{display: flex;max-width: 1000px;margin: auto;margin-top: 40px; }

.slide_arrow {display: block; width:50px;height: 50px;position:absolute;z-index: 10;background-image: url(/images/event/2025/guess/arrow-pre.svg); top: 0;  right: 0;  bottom: 0;  left:-107%;  margin: auto; z-index: 10;background-size:contain;background-repeat: no-repeat;background-position: center;}
.slide_arrow_next{display: block; width: 50px;height:50px;position:absolute;z-index: 10;background-image: url(/images/event/2025/guess/arrow-next.svg); top: 0;  right:-107%; 
  bottom: 0;  left:0;  margin: auto; z-index: 10;background-size:contain;background-repeat: no-repeat;background-position: center;}

.question_area{text-align: center;}
.question_area p{font-size: 30px; font-weight:600;margin-top: 40px;margin-bottom:20px;}

.function_box{display:flex; font-size: 1.25em; font-weight: 500;margin: 0 auto;margin-top: 30px;text-align: center;justify-content: center;flex-wrap: wrap;flex-direction:row;}
.function_box a{margin:20px;}
.function_box div{margin:20px;}

.btn {display:inline-block; width:150px; height: 45px; text-align: center;border-radius: 50px; margin: 0 auto;line-height: 45px;box-sizing: border-box;margin: 0 20px;}
.orange{color: #fff;background-color: #ca5331;width: 200px;}
.orange:hover , .skin_tone:hover , .white:hover{background-color: #000;color: #fff;}
.skin_tone{color: #ca5331;background-color: #f5e4c8;}
.skin_tone.end{color: #fff;background-color: #454242;}
.skin_tone i{display:inline-block;width:20px; height:20px; border-radius: 100%;text-align: center;background-color: #ca5331;color: #fff;line-height: 20px;margin-left: 10px;font-size: 16px;}
.white{background-color: #fff; color: #000;}

.share_box{display:block; width:400px;margin: 0 auto;border:1px solid #fff; height:90px;border-radius: 50px;margin-top: 0;}
.share_box div{display: flex;justify-content: center;flex-wrap:wrap;}
.share_box strong{display: block;text-align: center;width: 200px;background-color:#283a2a;margin: 0 auto;position: relative; top: -13px;font-weight: 500;color:white;}
.share_box a{display: block; width: 50px; height: 50px;background-color: #fff;border-radius: 100%;padding:10px; box-sizing: border-box;margin: 0 15px;}

/*------radio樣式------*/
.radio {display: inline-block;position: relative;margin-right:15px;margin-top: 5px;font-size: 20px;}
.radio input[type=radio] {  position: absolute;  opacity: 0;}
.radio input[type=radio] + .radio-label:before { content: "";background:#283a2a;border-radius: 100%;  border: 1px solid #fff;  display: inline-block;  width:15px;  height:15px;  position: relative;  top:0px;  margin-right:5px;  cursor: pointer;  text-align: center;  transition: all 250ms ease;}
.radio input[type=radio]:checked + .radio-label:before {  background-color: #17002e;  box-shadow: inset 0 0 0 4px #f4f4f4;}
.radio input[type=radio]:focus + .radio-label:before {  outline: none;  border-color: #3197ee;}
.radio input[type=radio]:disabled + .radio-label:before {  box-shadow: inset 0 0 0 4px #f4f4f4;  border-color: #b4b4b4;  background: #b4b4b4;}

.landing_page_container{padding-bottom: 100px;}
.count_heart{display: block; max-width: 550px;height:750px; padding:100px 20px 20px 20px;; box-sizing: border-box;margin: 0 auto;background-color:#283a2a;margin-top: 50px;text-align: center;border-top-left-radius:300px; border-top-right-radius:300px;border-bottom-left-radius:300px; border-bottom-right-radius:300px; border:8px solid #ca5331; }
.count_heart em{display: block;font-size: 1.37em; font-weight:600;margin-top:30px;color: #fff;}
.count_heart i {display: block;font-size:3.75em;font-weight: 600;color:#cfa989;}
.count_heart span{display: block;line-height: 2em;}
.count_heart p{display: block; border-bottom: 1px solid  #604935;padding-bottom: 30px;color: #838b95;}
.count_heart a{position: relative;}
.function_box .btn_like{display: inline-block;position: relative;top:-2px;right: 0; width: 180px;box-shadow: none;}


@media (min-width:320px) and (max-width:1024px) { 
    .event_container{padding:50px 30px 0 30px;overflow: hidden; box-sizing: border-box;}
    .event_page_visual a{ max-width:850px; box-sizing: border-box;}
    .hand_left , .hand_right{display: none;}
    .event_page_visual a{height: auto;}    
    .desc_content{top: -200px;}    
    .prize_list{justify-content:space-between;}
    .prize_list div{margin:20px 0;  width:45%;}	
    
}

@media (min-width:320px) and (max-width:820px) {   
    .desc_content{top: -220px;}
    .event_page_visual a{left: 35px;}
    .event_method ul {justify-content: center;}
    .event_method ul li{width:100%;margin-bottom: 30px;}
    .event_method ul li:after{border-color: #000 transparent transparent transparent;  left:50%;
    top:100%;}
    .sponser li:nth-child(4){display:none;}
    .btn_start{margin:0 auto; }
}

@media (min-width:320px) and (max-width:640px) {
    .event_logo{display: none;}
     .desc_content{top: -200px;}
    .event_page_visual a{left:18px;}
    .sponser li:nth-child(3){display:none;}
}

@media (min-width:320px) and (max-width:460px) {    
     .desc_content section{padding:40px 20px;}
	.event_method h2{margin-top: 80px;}
     .desc_content{top: -160px;}
    .prize_list{justify-content: center;}
     .prize_list div{width:100%;}
     .sponser li:nth-child(2){display:none;}
	.question_area p{font-size: 24px;}
	.slide_arrow{left: -115%;}
	.slide_arrow_next{right: -115%;}
	.function_box a{width: 100%;margin: 20px 0;}
    .function_box div{width: 100%;margin: 20px 0;}
	.function_box{flex-direction:column-reverse;}
	.share_box{margin-top: 15%;width:100%;box-sizing: border-box;height: auto;} 
	.share_box a{margin: 0 15px 15px 15px;}	
}

@media (min-width:320px) and (max-width:417px) {
     .desc_content{top:-150px;}
    .event_container img{width: 100%;}
    section h2{margin-bottom:0px;}
    section h2 {width:70%;}
   .event_page_visual a{margin-top:0;left: 15px; }
}
