* {margin: 0; padding: 0;/* box-sizing: border-box; */}
body{width: 100%; height: 100%; font-family: '微軟正黑體', 'MS UI Gothic',Arial, Helvetica, sans-serif; font-size: 12px; }
a,a:hover,a:active,a:visited {display: inline-block; color: #005bac; text-decoration: none;}
table{width: 100%; border-collapse: collapse; border-spacing: 0;}
table,tr,th,td{margin: 0; padding: 0;}
img{margin: 0; padding: 0; display: block;}

.main{width: 100%; max-width: 1920px; margin: 0 auto; overflow: hidden; color:#333333; padding-top: 80px; font-size: 12px; background: #1F0C19;}
.section{width: 100%; max-width: 1920px; margin: 0 auto;}

/* kv */
.kv_container{width: 100%; margin: 0 auto; background: url("../images/kv_bg.png") center top no-repeat; background-size: cover;}
.kv{width: 100%; max-width: 1440px; height: 715px; margin: 0 auto; position: relative;}
.kv .title{width: 38%; margin: 0 auto; padding-top: 13%; margin-left: 5%; position: relative;}
.kv .title .kv_tit{
    animation: bounce-bottom 1s;
}
.kv .bling{width: 3%; position: absolute; left: 3%; top: 48%; animation: bounce-bottom 1s;}
.kv .girl{width: 13%; position: absolute; left: 48%; top: 32%;}
.kv .boy{width: 16%; position: absolute; left: 60%; top: 15%;}
.kv .boy2{width: 15%; position: absolute; left: 77%; top: 25%; z-index: 8;}
.kv .drink{width: 28%; position: absolute; right: 18%; top: 47%; z-index: 10;}
.kv .money{width: 2%; position: absolute; right: 22%; top: 31%;}
.kv .money2{width: 2%; position: absolute; right: 43%; top: 26%;}
.mobOnly{display: none;}
/* content */
.content_container{ 
    width: 100%;
    margin: 0 auto;
    background-color: #1F0C19;
    background-image: url("../images/bg_meterial1.png"), url("../images/bg_meterial2.png");
    background-repeat: no-repeat,no-repeat;
    background-position: 1% 2%, 99% 50%;
    background-size: 500px,500px;
}
.content{width: 100%; max-width: 1200px; margin: 0 auto; font-size: 18px; line-height: 1.8; color: #333333; text-align: center;}
/* event */
.event{width: 86%; margin: 4% auto; padding: 1% 9% 5%; background: #ffffff; border-radius: 20px;}
.event_part{margin: 5% 0;}
/* .event_tit{} */
.event_tit img{width: 150px; margin: 0 auto; padding: 3% 0;}
.event_date{font-size: 24px;}
.event_txt{text-align: left;}
.btn_location img{width: 180px; margin-top: 8%;}
.pinktt{color: #e94c96; font-weight: bold;}
.logo_all{margin-top: 6%;}
.logo_all img{width: 100%; margin: 0 auto;}
/* action */
.action{display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;padding:3% 0 3%;}
.action-item{-webkit-flex:0 1 270px;flex:0 1 270px;max-width:270px;}
.action-item a{display: block;}
.action-item+.action-item{margin-left:25px;}
.btn{position:relative;display:block;border-radius:45px;cursor:pointer;}
.btn::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;display:block;border-radius:45px;-webkit-transform:translateY(6px);transform:translateY(6px);}
.btn img{position:relative;width:100%;z-index:1;transition:.2s;}
.btn.pink::after{background-color:#ba1563;}
.btn.blue::after{background-color:#005bab;}
.btn:hover img{-webkit-transform:translateY(6px);transform:translateY(6px);}
/* notice */
.notice_container{background: #F4F2F1;}
.notice{width: 100%; max-width: 1600px; margin: 0 auto; padding: 2% 5% 5%; font-size: 15px; line-height: 2; color: #333333;}
.notice_tit{font-size: 20px; font-weight: bold; text-align: center;}
.notice_all{padding: 2%;}
.notice_all a{color: #e94c96; font-weight: bold; text-decoration: underline;}
.notice_all ul{margin: 0; padding-left: 18px; list-style-type: cjk-ideographic;}
/* .notice_all ul>li{} */
.notice_all ul>li>ol{list-style-type: decimal; padding-left: 18px;}
.notice_all ul>li>ol>li>ul{list-style-type: disc; padding-left:22px;}
/* .notice_all ul>li>ol>li>ul>li{} */
.notice_all ul>li>ol>li>ol{list-style-type: none; padding-left: 18px;}
.notice_all ul>li>ol>li>ol>li{position: relative; counter-increment:section;}
.notice_all ul>li>ol>li>ol>li::before{content:"(" counter(section,decimal) ")";position:absolute;top:0;left:-5px;-webkit-transform:translateX(-100%);transform:translateX(-100%)}
.notice_all ul>li>ol>li>ol>li>ul{list-style-type: circle;}
#contTab{display: none;}
.content-more{display: none;
}
#contTab:checked ~ #cont{
    max-height: 180px;
    overflow: hidden;
}
#contTab:checked ~  .content-more{
    display: block;
    position: relative;
    padding-top: 20px;
    padding-bottom: 30px;
    text-align: center;
}
#contTab:checked ~  .content-more .gradient{
    background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(254,239,212,0)),to(#F4F2F1));
    background-image: -webkit-linear-gradient(top,rgba(254,239,212,0),#F4F2F1);
    background-image: linear-gradient(-180deg,rgba(254,239,212,0),#F4F2F1);
    height: 90px;
    position: absolute;
    left: 0;
    top: -80px;
    width: 100%;
}
#contTab:checked ~  .content-more .readmore{
    display: inline-block;
    background: #FB7519;
    color: #ffffff;
    width: 175px;
    height: 42px;
    border-radius: 42px;
    line-height: 42px;
    font-size: 16px;
    cursor: pointer;
    opacity: 0.6;
	transition: 0.3s;
}
#contTab:checked ~  .content-more .readmore:hover{opacity: 1}
@media screen and (max-width: 1440px) {
/* kv */
.kv{width: 100%; height: 0; padding-bottom: 49.652777778%;}
}
@media screen and (max-width: 1024px) {
.main{padding-top: 76px;}
}
@media screen and (max-width: 960px) {
/* content */
.content{width: 100%; max-width: 960px;}
}
@media screen and (max-width:767px) {
.main{padding-top: 58px;}
/* kv */
.kv{width: 100%; height: 0; padding-bottom: 139.125%; margin: 0 auto; background: url("../images/kv_bg_m.png") center top no-repeat; background-size: 100% auto;}
.kv .title{width: 78%; margin: 0 auto; padding-top: 14%; position: relative;}
.kv .bling{width: 5%; position: absolute; left: 10%; top: 24%; animation: bounce-bottom 1s;}
.kv .payji{width: 29%; position: absolute; left: 5%; top: 69%; z-index: 11;}
.kv .girl{width: 23%; position: absolute; left: 16%; top: 48%;}
.kv .boy{width: 28%; position: absolute; left: 36%; top: 43%;}
.kv .boy2{width: 26%; position: absolute; left: 62%; top: 43%; z-index: 8;}
.kv .drink{width: 58%; position: absolute; right: 21%; top: 60%; z-index: 10;}
.kv .money{display: none;}
.kv .money2{display: none;}
.webOnly{display: none;}
.mobOnly{display: block;}
/* content */
.content_container{background:none;}
/* event */
.event_part{margin: 7% 0;}
.event_tit img{padding: 5% 0;}
.event_date{font-size: 20px;}
.event_txt{text-align: justify;}
/* action */
.action{display:block;}
.action-item{max-width:300px;margin:auto;}
.action-item+.action-item{margin-top:30px;margin-left:auto;}
/* notice */
.notice_all ul{font-size: 14px; padding-left: 28px}
#contTab:checked ~ #cont{
    max-height: 48vw;
    overflow: hidden;
}

#contTab:checked ~  .content-more .readmore{
	width: 65vw;
	height: 8vw;
    border-radius: 4vw;
    line-height: 8vw;
    font-size: 1em;
}
@media screen and (max-width:450px) {
/* event */
.event_part{margin: 10% 0;}
.event_tit img{width: 120px;}
.event_date{font-size: 18px;}
.event_txt{font-size: 16px;}
/* action */
.action-item{max-width:220px;margin:auto;}
.action-item+.action-item{margin-top:30px;margin-left:auto;}
.btn::after{-webkit-transform:translateY(4px);transform:translateY(4px);}
.btn:hover img{-webkit-transform:none;transform:none;}
/* notice */
.notice{padding: 2% 6% 8%;}
.notice_tit{font-size: 18px;}
}
}

/* animation */
@keyframes shout{
  0%,5%,15%,25%,100% {transform:scale(1);}
  10%,20% {transform:scale(1.2);}
}