﻿.common__container{width:100%;position:relative;padding:0 15px;margin:0 auto}@media(min-width: 768px){.common__container{max-width:750px}}@media(min-width: 992px){.common__container{max-width:990px}}@media(min-width: 1300px){.common__container{max-width:1280px}}.fade-enter-active{transition:opacity .3s}.fade-leave-active{transition:opacity .3s}.fade-enter-to,.fade-leave-from{opacity:1}.fade-leave-to,.fade-enter-from{opacity:0}.fadeVideo-enter-active{animation:fadeIn .5s}.fadeVideo-leave-active{animation:fadeOut .3s}.drop-enter-active{animation:dropDown 1s}.drop-leave-active{animation:collapse 1s}.filterEffect-enter-active{animation:fadeIn 1s}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}@keyframes dropDown{from{opacity:0;max-height:0}to{opacity:1;max-height:500px}}@keyframes collapse{from{opacity:1;max-height:500px}to{opacity:0;max-height:0}}:root{--MSIBodyFont: -apple-system, BlinkMacSystemFont, "Segoe UI","Microsoft JhengHei","Noto Sans TC", "微軟正黑體", "Meiryo UI", Helvetica, Arial, sans-serif;--body-font-size: var(--text-md);--title-xl: 24px;--title-lg: 22px;--title-md: 20px;--title-sm: 18px;--title-xs: 16px;--text-xl: 20px;--text-lg: 18px;--text-md: 17px;--text-sm: 16px;--text-xs: 15px;--note-lg: 16px;--note-xl: 14px;--note-md: 13px;--note-sm: 12px;--link--xl: 20px;--link-lg: 18px;--link-md: 17px;--link-sm: 16px;--line-xs: 14px;--line-height-xl: 2;--line-height-lg: 1.8;--line-height-md: 1.5;--line-height-xs: 1.3;--line-height-list: 1.8;--line-height-article: 1.8}@media(min-width: 992px){:root{--title-xl: 36px;--title-lg: 26px}}@media(min-width: 1930px){:root{--title-md: 22px;--title-sm: 20px;--title-xs: 17px;--text-lg: 19px;--text-md: 18px;--text-sm: 17px;--text-xs: 16px;--note-lg: 17px;--note-xl: 15px;--note-md: 14px;--note-sm: 13px;--link-lg: 19px;--link-md: 18px;--link-sm: 17px;--line-xs: 16px}}html:lang(ja-JP) body,html:lang(JP) body{--MSIBodyFont: -apple-system, BlinkMacSystemFont, "Segoe UI", "Meiryo UI", Arial, sans-serif}html:lang(zh-TW) body,html:lang(zh-CN) body,html:lang(ja-JP) body,html:lang(JP) body,html:lang(ko-KR) body{--title-sm: 17px;--text-md: 16px}@media(min-width: 1930px){html:lang(zh-TW) body,html:lang(zh-CN) body,html:lang(ja-JP) body,html:lang(JP) body,html:lang(ko-KR) body{--title-sm: 18px;--text-md: 17px}}.contentCreation{font-family:"Century Gothic","cwTeXHei","Microsoft JhengHei"}.contentCreation .contentIntroduce{background:#e0dde0;padding-top:67px}@media(min-width: 996px){.contentCreation .contentIntroduce{ackground:linear-gradient(45deg, #eeeeee, #e0dde0, #b7c1c7, #e0dde0)}}.contentCreation .contentIntroduce__img{padding-top:40px}@media(min-width: 1300px){.contentCreation .contentIntroduce__img{padding-top:0}}.contentCreation .contentIntroduce__img img{width:100%;vertical-align:middle}.contentCreation .contentIntroduce__text{text-align:center}@media(min-width: 1300px){.contentCreation .contentIntroduce__text{width:55%;text-align:left;position:absolute;top:0;left:0}}.contentCreation .contentIntroduce__text-title h2{font-size:var(--title-xl);padding-bottom:20px;color:#000;font-weight:bold}.contentCreation .contentIntroduce__text-title h3{font-size:var(--title-lg);color:#000;padding-bottom:20px}.contentCreation .contentIntroduce__text-describe{font-size:var(--text-lg);color:#000}.contentCreation .contentRecommended{margin:0 auto;padding:80px 0 0;width:100%;position:relative;background-size:cover;background-repeat:no-repeat;background-image:linear-gradient(#87cae5 80%, #c3e0eb 100%)}@media(min-width: 768px){.contentCreation .contentRecommended{padding:100px 0;background-position:center;background-image:url("https://storage-asset.msi.com/event/2024/NB/creator-award-2024/images/creator-bg-2024.jpg")}}.contentCreation .contentRecommended__container{padding:0;margin:0 auto}@media(min-width: 768px){.contentCreation .contentRecommended__container{padding:0 15px}}@media(min-width: 996px){.contentCreation .contentRecommended__container{max-width:990px}}@media(min-width: 1300px){.contentCreation .contentRecommended__container{max-width:1280px}}.contentCreation .contentRecommended__bg{position:absolute;line-height:0;width:45%}.contentCreation .contentRecommended__bg--top{right:0}.contentCreation .contentRecommended__bg--bottom{bottom:0}.contentCreation .contentRecommended__bg img{width:100%}.contentCreation .contentRecommended :root{--MSIBodyFont: -apple-system, BlinkMacSystemFont, "Segoe UI","Microsoft JhengHei","Noto Sans TC", "微軟正黑體", "Meiryo UI", Helvetica, Arial, sans-serif;--body-font-size: var(--text-md);--title-xl: 24px;--title-lg: 22px;--title-md: 20px;--title-sm: 18px;--title-xs: 16px;--text-xl: 20px;--text-lg: 18px;--text-md: 17px;--text-sm: 16px;--text-xs: 15px;--note-lg: 16px;--note-xl: 14px;--note-md: 13px;--note-sm: 12px;--link--xl: 20px;--link-lg: 18px;--link-md: 17px;--link-sm: 16px;--line-xs: 14px;--line-height-xl: 2;--line-height-lg: 1.8;--line-height-md: 1.5;--line-height-xs: 1.3;--line-height-list: 1.8;--line-height-article: 1.8}@media(min-width: 992px){.contentCreation .contentRecommended :root{--title-xl: 36px;--title-lg: 26px}}@media(min-width: 1930px){.contentCreation .contentRecommended :root{--title-md: 22px;--title-sm: 20px;--title-xs: 17px;--text-lg: 19px;--text-md: 18px;--text-sm: 17px;--text-xs: 16px;--note-lg: 17px;--note-xl: 15px;--note-md: 14px;--note-sm: 13px;--link-lg: 19px;--link-md: 18px;--link-sm: 17px;--line-xs: 16px}}.contentCreation .contentRecommended html:lang(ja-JP) body,.contentCreation .contentRecommended html:lang(JP) body{--MSIBodyFont: -apple-system, BlinkMacSystemFont, "Segoe UI", "Meiryo UI", Arial, sans-serif}.contentCreation .contentRecommended html:lang(zh-TW) body,.contentCreation .contentRecommended html:lang(zh-CN) body,.contentCreation .contentRecommended html:lang(ja-JP) body,.contentCreation .contentRecommended html:lang(JP) body,.contentCreation .contentRecommended html:lang(ko-KR) body{--title-sm: 17px;--text-md: 16px}@media(min-width: 1930px){.contentCreation .contentRecommended html:lang(zh-TW) body,.contentCreation .contentRecommended html:lang(zh-CN) body,.contentCreation .contentRecommended html:lang(ja-JP) body,.contentCreation .contentRecommended html:lang(JP) body,.contentCreation .contentRecommended html:lang(ko-KR) body{--title-sm: 18px;--text-md: 17px}}.contentCreation .contentRecommended .creatorsAward__container .link,.contentCreation .contentRecommended .creatorsSwipe__head .link{display:inline-block;border:#000 1px solid;color:var(--color-block);padding:10px 20px;margin-top:15px;border-radius:5px;transition:background-color .3s;font-size:var(--link-sm)}.contentCreation .contentRecommended .creatorsAward__container .link:hover,.contentCreation .contentRecommended .creatorsSwipe__head .link:hover{color:#fff;background-color:#515151}.contentCreation .contentRecommended .creatorsSwipe{position:relative;width:90%;margin:0 auto}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsSwipe{display:flex}}.contentCreation .contentRecommended .creatorsSwipe img{width:100%;vertical-align:middle;object-fit:unset;border-radius:10px}.contentCreation .contentRecommended .creatorsSwipe__head{text-align:center;margin-bottom:40px}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsSwipe__head{flex:1 0 0}}@media(min-width: 1300px){.contentCreation .contentRecommended .creatorsSwipe__head{flex:0 0 35%}}.contentCreation .contentRecommended .creatorsSwipe__head .title{font-size:var(--title-xl);font-weight:bold;color:var(--color-white)}.contentCreation .contentRecommended .creatorsSwipe__head .describe{width:80%;font-size:var(--text-lg);margin:20px auto 10px;color:var(--color-white)}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsSwipe .swiper-container{margin-left:30px;flex:1 0 0}}@media(min-width: 1300px){.contentCreation .contentRecommended .creatorsSwipe .swiper-container{flex:0 0 65%}}.contentCreation .contentRecommended .creatorsSwipe__creator figure{text-align:initial}.contentCreation .contentRecommended .creatorsSwipe__creator figure figcaption{color:var(--color-white);font-size:var(--title-lg)}.contentCreation .contentRecommended .creatorsSwipe__creator figure figcaption span{display:block;font-size:var(--note-xl);color:var(--color-white);padding:15px 0 0px}.contentCreation .contentRecommended .creatorsSwipe .swiper-pagination{position:static;margin-top:40px}.contentCreation .contentRecommended .creatorsSwipe .swiper-pagination .swiper-pagination-bullet-active{background-color:#9a8555}.contentCreation .contentRecommended .creatorsAward{overflow:hidden;color:#000}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsAward__imgBox{display:none}}.contentCreation .contentRecommended .creatorsAward__imgBox img{width:100%;vertical-align:middle}.contentCreation .contentRecommended .creatorsAward__imgBox .imageItem{margin:0 auto;display:block}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsAward__imgBox .imageItem{width:100%}}.contentCreation .contentRecommended .creatorsAward__container{max-width:70%;margin:0 auto;text-align:center}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsAward__container{margin:0;padding:0;text-align:left;max-width:500px}}.contentCreation .contentRecommended .creatorsAward__container .titleBox{margin-top:50px}.contentCreation .contentRecommended .creatorsAward__container .titleBox .imgBox{width:100px;margin:0 auto}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsAward__container .titleBox .imgBox{margin:unset}}.contentCreation .contentRecommended .creatorsAward__container .titleBox .imgBox img{width:100%;vertical-align:middle}.contentCreation .contentRecommended .creatorsAward__container .titleBox .content{margin-top:30px}@media(min-width: 768px){.contentCreation .contentRecommended .creatorsAward__container .titleBox .content{flex:1 0 0;align-self:flex-end;margin-top:0}}.contentCreation .contentRecommended .creatorsAward__container .titleBox .content__title{color:var(--color-block);font-weight:bold;font-size:var(--title-xl);margin:20px 0}.contentCreation .contentRecommended .creatorsAward__container .titleBox .content__describe{font-size:var(--title-lg);color:var(--color-block)}.contentCreation .contentRecommended .creatorsAward__container .describe{margin:15px 0 30px;color:var(--color-block);font-size:var(--text-lg)}.contentCreation .contentCreatorAward{margin:15% auto}.contentCreation .contentCreatorAward a{transition:background-color .3s}.contentCreation .contentCreatorAward a:hover{background-color:#515151}@media screen and (max-width: 960px){.contentCreation .contentCreatorAward{padding-top:5vh}}.contentCreation .contentCreatorAward__textbox{max-width:1000px}@media screen and (max-width: 960px){.contentCreation .contentCreatorAward__textbox{text-align:center;padding-bottom:135px}}.contentCreation .contentCreatorAward__textbox figure{display:inline-block;line-height:0}.contentCreation .contentCreatorAward__textbox figure img{width:6rem}.contentCreation .contentCreatorAward__textbox h2{color:#9a8555;font-size:32px;padding-bottom:10px;margin-top:20px;margin-bottom:10px;font-family:inherit;font-weight:500;line-height:1.1}@media screen and (max-width: 960px){.contentCreation .contentCreatorAward__textbox h2{font-size:26px}}.contentCreation .contentCreatorAward__textbox p{color:#fff;padding:15px 0 20px;line-height:1.6;margin:0 0 10px}@media screen and (max-width: 1920px){.contentCreation .contentCreatorAward__textbox p{font-size:18px}}@media screen and (max-width: 960px){.contentCreation .contentCreatorAward__textbox-btn{text-align:center}}.contentCreation .contentCreatorAward__textbox-btn a{color:#fff;border:#999 1px solid;display:inline-block;padding:10px 20px;border-radius:5px;-webkit-transition:1s all ease;-o-transition:1s all ease;transition:1s all ease;font-size:18px;text-decoration:none}.contentCreation .contentCreatorAward__imgbox a{text-decoration:none}.contentCreation .contentCreatorAward__imgbox a img{width:100%;border:0;vertical-align:middle}@media screen and (max-width: 960px){.contentCreation .contentCreatorAward__imgbox-imglg{display:none}}.contentCreation .contentCreatorAward__imgbox-imgxs{display:none}@media screen and (max-width: 960px){.contentCreation .contentCreatorAward__imgbox-imgxs{display:block}}
