@charset "UTF-8";
/**
 * 
 * @authors Mina
 */

@import url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/css/animate.css');
@import url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/css/aos.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@500;700;900&family=Noto+Serif+TC&display=swap');


body {
	border: medium none;
	margin: 0;
	padding: 0;
	outline: none;
	background: #fff;
	color: #000;
	height: auto;
	overflow: hidden;
	position: relative;
	width: 100%;
	min-width: 800px;
	max-width: 1920px;
	margin: 0 auto;
	font-family: Arial;
}

body.zh {
	font-family: 'Microsoft Yahei';
}

ul,
li,
button,
p {
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
}

.in {
	position: relative;
	height: 100%;
	max-width: 1200px;
	margin: 0 auto;
}


/* Top Menu ------------------------------------------------- */

#top_sp {
	display: none;
}

#top_menu {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_bg.jpg') top center no-repeat;
	height: 58px;
	z-index: 11;
	user-select: none;
	position: fixed;
	top: 0;
	width: 100%;
	min-width: 800px;
	margin: 0 auto;
	left: 0;
	right: 0;
}

#top_menu .top_menu_btn {
	font-weight: bold;
	color: #fff;
	position: relative;
	left: 3%;
	display: inline;
	font-size: 19px;
	font-weight: 500;
}

.zh #top_menu .top_menu_btn {
	letter-spacing: 0.5px;
	font-weight: bold;
}

.en #top_menu .top_menu_btn {
	font-size: 18px;
}

.th #top_menu .top_menu_btn {
	font-size: 20px;
}

#top_menu .top_menu_btn li {
	line-height: 55px;
	cursor: pointer;
	position: relative;
	display: inline-block;
	transition: .2s;
}

.zh #top_menu .top_menu_btn li {
	margin: 0px 2.8%;
}

.en #top_menu .top_menu_btn li {
	margin: 0px 2.2%;
}

.th #top_menu .top_menu_btn li {
	margin: 0px 3.2%;
}

.fr #top_menu .top_menu_btn li {
	margin: 0px 2.6%;
}

.es #top_menu .top_menu_btn li {
	margin: 0px 2.6%;
}

.pt #top_menu .top_menu_btn li {
	margin: 0px 1.5%;
}

#top_menu .top_menu_btn li:hover {
	color: #ffff00;
}

#top_menu .top_menu_right {
	border-left: 2px #ffff01 solid;
	top: 46%;
	transform: translate(0, -50%);
	position: relative;
	right: 3%;
	height: 34px;
	display: inline;
	float: right;
	width: 17%;
}

#top_menu .top_menu_right li {
	display: inline-block;
	height: 34px;
	width: 34px;
	cursor: pointer;
	position: relative;
}

#top_menu .top_menu_right li.fb {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_icon.svg') left bottom no-repeat;
	background-size: 200%;
	margin-left: 25%;
	margin-right: 17%;
}


/* S1 ------------------------------------------------------- */

#s1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/main_bg.jpg') top center no-repeat;
	height: 812px;
	position: relative;
	overflow: hidden;
	background-position-y: -58px;
	margin-top: 58px;
}

#s1 .mid {
	position: absolute;
	margin: 0 auto;
	left: -51.5%;
	right: 0;
	z-index: 1;
}

#s1 .logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/logo.png') bottom center no-repeat;
	background-size: contain;
	max-width: 383px;
	min-width: 284px;
	width: 27vw;
	height: 203px;
	margin: 0 auto;
	margin-top: 150px;
}

.en #s1 .logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/logo_en.png') bottom center no-repeat;
	background-size: contain;
}

.th #s1 .logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/logo_th.png') bottom center no-repeat;
	background-size: contain;
}

#s1 .title0 {
	max-width: 524px;
	min-width: 403px;
	width: 37vw;
	height: 62px;
	margin: 0 auto;
	margin-top: 20px;
}

.main #s1 .title0 {
	background-size: contain;
}

.zh #s1 .title0 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title0_zh.svg') bottom center no-repeat;
}

.en #s1 .title0 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title0_en.svg') bottom center no-repeat;
}

.th #s1 .title0 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title0_th.svg') bottom center no-repeat;
}

.fr #s1 .title0 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title0_fr.svg') bottom center no-repeat;
}

.es #s1 .title0 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title0_es.svg') bottom center no-repeat;
}

.pt #s1 .title0 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title0_pt.svg') bottom center no-repeat;
}

#s1 .title1 {
	max-width: 348px;
	min-width: 272px;
	width: 25vw;
	height: 30px;
	margin: 0 auto;
	margin-top: -1px;
	animation-delay: .6s;
	opacity: 0;
}

.main #s1 .title1 {
	background-size: contain;
}

.en #s1 .title1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title1_en.svg') top center no-repeat;
}

.th #s1 .title1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title1_th.svg') top center no-repeat;
}

.fr #s1 .title1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title1_fr.svg') top center no-repeat;
}

.es #s1 .title1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title1_es.svg') top center no-repeat;
}

.pt #s1 .title1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/title1_pt.svg') top center no-repeat;
}

.s1_title_ani {
	animation: s1_title_ani .8s forwards;
}

@keyframes s1_title_ani {
	from {
		background-position: 0 -30px;
		opacity: 1;
	}

	to {
		background-position: 0 0px;
		opacity: 1;
	}
}

#s1 .scroll_effect {
	width: 37px;
	height: 232px;
	margin: 0 auto;
	position: relative;
	margin-top: 31px;
	animation-delay: 1s;
	opacity: 0;
}

.scroll_fade {
	animation: fadeIn 2s forwards;
}

#s1 .scroll_effect:before {
	content: ' ';
	background: #434343;
	width: 2px;
	position: absolute;
	height: 100%;
	left: 0;
	right: 0;
	margin: 0 auto;
	box-shadow: 0 0 2px #fff;
}

#s1 .scroll_pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/scroll.png') top center no-repeat;
	width: 39px;
	height: 55px;
	position: absolute;
	left: -8px;
	top: 10%;
	animation: scroll_ani 3s infinite;
	animation-delay: 1s;
}

.fr #s1 .scroll_pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/scroll_fr.png') top center no-repeat;
	height: 76px;
}

.es #s1 .scroll_pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/scroll_es.png') top center no-repeat;
	height: 97px;
}

.pt #s1 .scroll_pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/scroll_pt.png') top center no-repeat;
	height: 71px;
}

@keyframes scroll_ani {
	from {
		opacity: 0;
		top: 10%;
	}

	5% {
		opacity: 1;
		top: 10%;
	}

	80% {
		opacity: 1;
		top: 67%;
	}

	to {
		opacity: 0;
		top: 72%;
	}
}

#s1 .pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/pic.png') center center no-repeat;
	background-size: contain;
	width: 80vw;
	max-width: 1126px;
	min-width: 1016px;
	height: 990px;
	top: -49px;
	position: absolute;
	right: -41.5%;
	margin: 0 auto;
	left: 0;
}


/* S2 ------------------------------------------------------- */

#s2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video_bg.png') top center no-repeat;
	height: 509px;
	position: relative;
	overflow: hidden;
	margin-top: -67px;
	z-index: 1;
}

#s2 .videos {
	position: relative;
	text-align: center;
	margin-top: 82px;
	z-index: 1;
}

#s2 .videos li {
	width: 407px;
	height: 236px;
	display: inline-block;
	position: relative;
	border: white 1px solid;
	box-shadow: 0 0 0 2px #fff,
		2px 5px 6px 2px #000;
}

#s2 .video1 {
	margin-right: 3%;
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video1.jpg') top center no-repeat;
	background-size: contain;
}

.en #s2 .video1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video1_en.jpg') top center no-repeat;
	background-size: contain;
}

.th #s2 .video1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video1_th.jpg') top center no-repeat;
	background-size: contain;
}

#s2 .video2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video2.jpg') top center no-repeat;
	background-size: contain;
}

#s2 .video1 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video_title1.png') top center no-repeat;
}

#s2 .video2 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video_title2.png') top center no-repeat;
}

#s2 .videos .title {
	width: 278px;
	height: 47px;
	margin-top: -18px;
	margin-left: -20px;
	color: #fff;
	font-family: Arial;
	font-weight: 700;
	font-size: 15.5px;
	line-height: 33px;
	user-select: none;
}

#s2 .video_play {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/video_play.svg') center center no-repeat;
	width: 71px;
	height: 71px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	cursor: pointer;
	transition: .3s;
}

#s2 .video_play:hover {
	width: 78px;
	height: 78px;
}

#s2 .apps {
	text-align: center;
	margin-top: 30px;
}

#s2 .apps li {
	cursor: pointer;
	display: inline-block;
}

#s2 .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google.svg') top center no-repeat;
	width: 187px;
	height: 55px;
	margin-right: 1%;
}

.fr #s2 .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google_fr.svg') top center no-repeat;
}

.es #s2 .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google_es.svg') top center no-repeat;
}

.pt #s2 .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google_pt.svg') top center no-repeat;
}

#s2 .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios.svg') top center no-repeat;
	width: 166px;
	height: 55px;
	margin-right: 1%;
}

.fr #s2 .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios_fr.svg') top center no-repeat;
	width: 173px;
}

.es #s2 .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios_es.svg') top center no-repeat;
	width: 196px;
}

.pt #s2 .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios_pt.svg') top center no-repeat;
	width: 164px;
}

#s2 .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk.jpg') top center no-repeat;
	width: 278px;
	height: 59px;
}

.fr #s2 .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk_fr.jpg') top center no-repeat;
}

.es #s2 .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk_es.jpg') top center no-repeat;
}

.pt #s2 .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk_pt.jpg') top center no-repeat;
}

#s2 .arrow_move {
	display: none;
}


/* S3 ------------------------------------------------------- */

#s3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_bg.jpg') top center no-repeat;
	height: 981px;
	position: relative;
	overflow: hidden;
	margin-top: -90px;
}

#s3 .pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic.png') center center no-repeat;
	background-size: contain;
	max-width: 670px;
	min-width: 620px;
	width: 47vw;
	height: 1002px;
	position: absolute;
	margin: 0 auto;
	right: 52%;
	margin-top: 80px;
}

#s3 .mid {
	position: absolute;
	margin: 0 auto;
	left: 27.5%;
	right: 0;
	width: 632px;
}

#s3 .title {
	width: 406px;
	height: 135px;
	position: relative;
	margin-top: 125px;
	margin-left: 225px;
}

.zh #s3 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_title_zh.png') center center no-repeat;
}

.en #s3 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_title_en.png') center center no-repeat;
}

.th #s3 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_title_th.png') center center no-repeat;
}

.fr #s3 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_title_fr.png') center center no-repeat;
}

.es #s3 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_title_es.png') center center no-repeat;
}

.pt #s3 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_title_pt.png') center center no-repeat;
}

.main #s3 .title {
	background-size: contain;
}

#s3 .txt {
	margin-top: 44px;
	position: relative;
}

.zh #s3 .txt li {
	margin-bottom: 26px;
}

.en #s3 .txt li,
.es #s3 .txt li {
	margin-bottom: 11px;
}

.th #s3 .txt li,
.fr #s3 .txt li,
.pt #s3 .txt li {
	margin-bottom: 13px;
}

.main #s3 .txt li {
	background-size: contain;
}

/*zh*/
.zh #s3 .txt1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt1_zh.png') top left no-repeat;
	height: 53px;
}

.zh #s3 .txt2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt2_zh.png') top left no-repeat;
	height: 76px;
}

.zh #s3 .txt3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt3_zh.png') top left no-repeat;
	height: 77px;
}

.zh #s3 .txt4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt4_zh.png') top left no-repeat;
	height: 53px;
}

/*en*/
.en #s3 .txt1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt1_en.png') top left no-repeat;
	height: 69px;
}

.en #s3 .txt2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt2_en.png') top left no-repeat;
	height: 68px;
}

.en #s3 .txt3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt3_en.png') top left no-repeat;
	height: 108px;
}

.en #s3 .txt4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt4_en.png') top left no-repeat;
	height: 89px;
}

/*th*/
.th #s3 .txt1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt1_th.png') top left no-repeat;
	height: 81px;
}

.th #s3 .txt2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt2_th.png') top left no-repeat;
	height: 79px;
}

.th #s3 .txt3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt3_th.png') top left no-repeat;
	height: 82px;
}

.th #s3 .txt4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt4_th.png') top left no-repeat;
	height: 84px;
}

/*fr*/
.fr #s3 .txt1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt1_fr.png') top left no-repeat;
	height: 69px;
}

.fr #s3 .txt2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt2_fr.png') top left no-repeat;
	height: 67px;
}

.fr #s3 .txt3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt3_fr.png') top left no-repeat;
	height: 108px;
}

.fr #s3 .txt4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt4_fr.png') top left no-repeat;
	height: 89px;
}

/*es*/
.es #s3 .txt1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt1_es.png') top left no-repeat;
	height: 69px;
}

.es #s3 .txt2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt2_es.png') top left no-repeat;
	height: 69px;
}

.es #s3 .txt3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt3_es.png') top left no-repeat;
	height: 108px;
}

.es #s3 .txt4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt4_es.png') top left no-repeat;
	height: 89px;
}

/*pt*/
.pt #s3 .txt1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt1_pt.png') top left no-repeat;
	height: 69px;
}

.pt #s3 .txt2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt2_pt.png') top left no-repeat;
	height: 88px;
}

.pt #s3 .txt3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt3_pt.png') top left no-repeat;
	height: 89px;
}

.pt #s3 .txt4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_txt4_pt.png') top left no-repeat;
	height: 69px;
}

#s3 .photo {
	text-align: center;
}

#s3 .photo li {
	width: 174px;
	height: 126px;
	border: 2px solid #fff;
	display: inline-block;
	background: #000;
	margin: 0 14px;
	position: relative;
	cursor: pointer;
	transition: .5s;
}

#s3 .photo .photo1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic1.jpg') center center no-repeat;
	background-size: contain;
}

#s3 .photo .photo2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic2.jpg') center center no-repeat;
	background-size: contain;
}

#s3 .photo .photo3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic3.jpg') center center no-repeat;
	background-size: contain;
}

.photo_big_ani {
	animation: photo_big_ani 1s forwards;
	filter: brightness(1) !important;
}

@keyframes photo_big_ani {
	from {
		background-size: 100%;
	}

	to {
		background-size: 110%;
	}
}

#s3 .more {
	position: absolute;
	width: 28px;
	height: 25px;
	right: -2px;
	bottom: -2px;
	overflow: hidden;
}

#s3 .more:before {
	content: ' ';
	width: 100%;
	height: 190%;
	background: #fff100;
	position: absolute;
	top: 1px;
	left: 6px;
	transform: rotate(49deg);
}

#s3 .more_pic {
	position: absolute;
	width: 10px;
	height: 10px;
	overflow: hidden;
	top: 49%;
	left: 49%;
}

#s3 .more_pic:before {
	position: absolute;
	content: ' ';
	width: 100%;
	height: 2px;
	background: #000;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

#s3 .more_pic:after {
	position: absolute;
	content: ' ';
	width: 2px;
	height: 100%;
	background: #000;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}


/* S4 ------------------------------------------------------- */

#s4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_bg.png') top center no-repeat;
	background-size: cover;
	height: 1355px;
	position: relative;
	overflow: hidden;
	margin-top: -116px;
	z-index: 1;
}

#s4.team1height {
	height: 1355px;
}

#s4 .page2 {
	height: 100%;
}

.zh #s4 .team_logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_team_list_zh.svg') no-repeat;
}

.th #s4 .team_logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_team_list_th.svg') no-repeat;
}

.main #s4 .team_logo {
	width: 215px;
	height: 158px;
	position: absolute;
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_team_list_en.svg') no-repeat;
	background-size: 223.5%;
	margin-top: 255px;
	left: 4.6%;
	z-index: 1;
}

#s4 .team_logo.team1 {
	background-position: -4px -5px;
}

.en #s4 .team_logo.team1 {
	background-position: -4px -40px;
}

#s4 .chara_bg {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_team_bg.svg') center center no-repeat;
	max-width: 1770px;
	width: 92.2%;
	padding-top: 22.09%;
	position: absolute;
	left: 50%;
	top: 33.5%;
	background-size: 100%;
}

[data-aos="chara_bg_ani"] {
	opacity: 0;
	transform: translate(-50%, 0) scale(1.1);
}

[data-aos="chara_bg_ani"].aos-animate {
	opacity: 1;
	transform: translate(-50%, 0) scale(1);
}

#s4 .chara_bg.team1 {
	background-position-y: 33.6%;
}

#s4 .chara_list {
	position: absolute;
	width: 100%;
	left: 50%;
	top: 33.5%;
	transform: translate(-50%, 0);
	text-align: center;
	z-index: 1;
}

#s4 .chara_list .charas {
	display: inline-block;
	width: 272px;
	height: 612px;
	margin: 0 .4%;
	cursor: pointer;
}

#s4 .chara_list li .pic {
	width: 100%;
	height: 100%;
	transition: .5s;
}

#s4 .chara_list li .pic:hover {
	transform: scale(1.05);
}

#s4 .chara_list.team1 .chara1 .pic,
#s4 .page3_sp .pic.chara1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pic1.png') top center no-repeat;
	background-size: contain;
}

#s4 .chara_list.team1 .chara2 .pic,
#s4 .page3_sp .pic.chara2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pic2.png') top center no-repeat;
	background-size: contain;
}

#s4 .chara_list.team1 .chara3 .pic,
#s4 .page3_sp .pic.chara3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pic3.png') top center no-repeat;
	background-size: contain;
}

#s4 .chara_list.team1 .chara4 .pic,
#s4 .page3_sp .pic.chara4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pic4.png') top center no-repeat;
	background-size: contain;
}

#s4 .chara_list.team1 .chara5 .pic,
#s4 .page3_sp .pic.chara5 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pic5.png') top center no-repeat;
	background-size: contain;
}

#s4 .chara_list .box_bg {
	position: relative;
	width: 100%;
	height: 100%;
}

#s4 .chara_list li .box {
	display: none;
	width: 699px;
	height: 486px;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 10;
	overflow: hidden;
	user-select: none;
	cursor: default;
	pointer-events: auto;
}

.box_ani {
	animation: box_ani .3s forwards;
}

@keyframes box_ani {
	from {
		width: 0
	}

	to {
		width: 699px;
	}
}

#s4 .chara_list.team1 .box {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pop1.svg') top left no-repeat;
	background-size: cover;
}

.pic_unfocus {
	filter: brightness(0.5);
}

#s4 .chara_list li .pic.pic_focus {
	z-index: 11;
	position: absolute;
	filter: brightness(1);
}

#s4 .chara_list .close {
	width: 45px;
	height: 45px;
	background: #333;
	position: absolute;
	right: 0;
	top: 0;
	pointer-events: auto;
	cursor: pointer;
}

#s4 .chara_list .close div {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pop_close.svg') center center no-repeat;
	background-size: contain;
	width: 65%;
	height: 65%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: .2s;
}

#s4 .chara_list .close .close_ani {
	width: 65%;
	height: 65%;
	transform: rotate(10deg) translate(-50%, -50%);
	transform-origin: left;
}

#s4 .chara_list.team1 .chara1 .pic.pic_focus {
	transform: translate(128%, -9%) scale(1.217);
}

#s4 .chara_list.team1 .chara2 .pic.pic_focus {
	transform: translate(23%, -9%) scale(1.217);
}

#s4 .chara_list.team1 .chara3 .pic.pic_focus {
	transform: translate(-83%, -9%) scale(1.217);
}

#s4 .chara_list.team1 .chara4 .pic.pic_focus {
	transform: translate(-189%, -9%) scale(1.217);
}

#s4 .chara_list.team1 .chara5 .pic.pic_focus {
	transform: translate(-295%, -9%) scale(1.217);
}

#s4 .chara_list .mid {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pop_in_en.svg') center center no-repeat;
	width: 435px;
	height: 380px;
	position: absolute;
	margin-top: 36px;
	left: 29.5%;
	opacity: 0;
}

.zh #s4 .chara_list .mid,
.th #s4 .chara_list .mid {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_pop_in.svg') center center no-repeat;
}

.chara_mid_ani {
	animation: fadeIn .3s forwards;
}

#s4 .mid div {
	position: absolute;
	text-align: center;
}

#s4 .mid .job {
	font-family: Arial;
	font-weight: 700;
	font-size: 62px;
	width: 25%;
	left: 13.5%;
	letter-spacing: -4px;
	top: 0.8%;
	transform: scaleX(0.8);
}

.zh #s4 .mid .job {
	font-family: 'Noto Sans SC', 'Microsoft Yahei', sans-serif;
	font-weight: 900;
	top: -3%;
	transform: scaleX(0.85);
}

#s4 .mid .name {
	font-family: Arial;
	font-weight: 900;
	width: 96%;
	top: 0.5%;
	left: 21.5%;
	transform: scaleX(0.6);
	font-size: 46px;
}

.zh #s4 .mid .name {
	font-size: 55px;
	font-family: 'Noto Sans SC', 'Microsoft Yahei', sans-serif;
	width: 68%;
	top: -1.5%;
	left: 35.5%;
	transform: scaleX(0.85);
}

.en #s4 .mid .name {
	text-transform: uppercase;
}

.en #s4 .chara2 .mid .name {
	font-size: 45px;
}

.en #s4 .chara3 .mid .name {
	font-size: 32px;
	top: 3.5%;
}

.en #s4 .chara4 .mid .name {
	font-size: 42px;
	top: 1.5%;
}

.th #s4 .mid .name {
	font-size: 46px;
	top: 2%;
	font-weight: 500;
	width: 66%;
	left: 36.5%;
	transform: scaleX(0.88);
}

.th #s4 .chara2 .mid .name {
	font-size: 44px;
}

.th #s4 .chara3 .mid .name {
	font-size: 40px;
	top: 3%;
}

.th #s4 .chara4 .mid .name {
	font-size: 41px;
	top: 3%;
}

.fr #s4 .mid .name,
.es #s4 .mid .name,
.pt #s4 .mid .name {
	transform: scaleX(0.8);
	font-size: 44px;
	letter-spacing: -2px;
	width: 72%;
	left: 33.5%;
}

.fr #s4 .chara2 .mid .name,
.fr #s4 .chara4 .mid .name,
.es #s4 .chara2 .mid .name,
.es #s4 .chara4 .mid .name,
.pt #s4 .chara2 .mid .name,
.pt #s4 .chara4 .mid .name {
	font-size: 40px;
	top: 1.5%;
}

.fr #s4 .chara3 .mid .name,
.es #s4 .chara3 .mid .name,
.pt #s4 .chara3 .mid .name {
	font-size: 40px;
	top: 1.5%;
	transform: scaleX(0.6);
	width: 96%;
	left: 21.5%;
}

.fr #s4 .chara5 .mid .name,
.es #s4 .chara5 .mid .name,
.pt #s4 .chara5 .mid .name {
	font-size: 42px;
	top: 1.5%;
}

#s4 .mid .en {
	font-size: 13px;
	font-family: 'Noto Serif TC', sans-serif;
	width: 36%;
	top: 22%;
	left: 59%;
	text-transform: uppercase;
}

#s4 .mid .title {
	top: 29.5%;
	width: 100%;
	left: 0;
	font-family: Arial;
	font-size: 40px;
	font-weight: 900;
	transform: scaleX(0.8);
}

.zh #s4 .mid .title {
	font-size: 40px;
	font-family: 'Noto Sans SC', 'Microsoft Yahei', sans-serif;
	width: 70%;
	left: 15%;
	transform: scaleX(1);
}

.en #s4 .mid .title {
	text-transform: uppercase;
}

.th #s4 .mid .title {
	font-size: 36px;
	font-weight: 500;
	top: 33%;
	transform: scaleX(1);
}

.fr #s4 .mid .title,
.es #s4 .mid .title,
.pt #s4 .mid .title {
	font-size: 36px;
	top: 30.5%;
	letter-spacing: -2px;
}

#s4 .mid .txt {
	text-align: left;
	width: 100%;
	top: 51.5%;
	box-sizing: border-box;
	font-size: 14px;
	letter-spacing: -0.2px;
	line-height: 20px;
}

.zh #s4 .mid .txt {
	font-weight: bold;
	line-height: 25px;
}

.en #s4 .chara2 .mid .txt {
	padding-left: 8px;
}

.th #s4 .mid .txt {
	font-size: 15px;
	line-height: 22px;
	font-weight: 500;
	top: 50%;
}

.th #s4 .chara2 .mid .txt {
	padding-left: 10px;
}

#s4 .mid .line1 {
	left: 6.5%;
	width: 41.5%;
	top: 72%;
	position: absolute;
	height: 25%;
}

.fr #s4 .mid .line1,
.es #s4 .mid .line1,
.pt #s4 .mid .line1 {
	top: 71.5%;
}

#s4 .mid .line2 {
	left: 52.5%;
	width: 41.5%;
	top: 72%;
	position: absolute;
	height: 16%;
}

#s4 .mid ul li {
	width: 100%;
	height: auto;
	display: block;
	margin: auto;
	margin-bottom: 4.5%;
	min-width: auto;
}

.th #s4 .mid .line1 li {
	margin-bottom: 5%;
}

.th #s4 .mid .line2 li {
	margin-bottom: 5%;
}

#s4 .mid .before {
	color: #fff;
	display: inline-block;
	width: 41%;
	position: relative;
	left: 0;
	line-height: 26px;
	font-weight: 500;
	font-size: 14px;
	font-family: Arial;
}

.zh #s4 .mid .before {
	font-family: 'Noto Sans SC', 'Microsoft Yahei', sans-serif;
}

.th #s4 .mid .before {
	font-size: 15px;
}

#s4 .mid .after {
	font-weight: 500;
	display: inline-block;
	width: 55.5%;
	left: -2%;
	position: relative;
	font-size: 14px;
	font-family: Arial;
}

.zh #s4 .mid .after {
	font-family: 'Noto Sans SC', 'Microsoft Yahei', sans-serif;
}

.th #s4 .mid .line1 li:nth-child(1) .after {
	font-size: 14px;
}

.fr #s4 .mid .line1 li:nth-child(1) .after,
.pt #s4 .mid .line1 li:nth-child(1) .after,
.pt #s4 .chara5 .mid .line1 li:nth-child(3) .after {
	font-size: 13px;
	line-height: 12px;
	top: 4px;
	left: -1%;
}

.es #s4 .mid .line1 li:nth-child(1) .after {
	font-size: 12px;
	line-height: 12px;
	top: 4px;
	left: -1%;
}

.pt #s4 .mid .line2 li:nth-child(1) .before {
	font-size: 13px;
}

.pt #s4 .chara5 .mid .line1 li:nth-child(3) .after {
	margin-top: -4px;
}

#s4 .page3_sp {
	display: none;
}


/* S5 ------------------------------------------------------- */

#s5 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_bg.jpg') top center no-repeat;
	background-size: cover;
	height: 1215px;
	position: relative;
	overflow: hidden;
	margin-top: -114px;
}

#s5 .pic {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_pic.png') center center no-repeat;
	width: 772px;
	height: 1168px;
	position: absolute;
	left: 0;
	right: -60%;
	margin: 0 auto;
	margin-top: -16px;
}

#s5 .title {
	width: 500px;
	height: 164px;
	position: absolute;
	margin: 0 auto;
	left: -32vw;
	right: 0;
	margin-top: 166px;
}

.zh #s5 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_title_zh.png') center center no-repeat;
}

.en #s5 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_title_en.png') center center no-repeat;
}

.th #s5 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_title_th.png') center center no-repeat;
}

.fr #s5 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_title_fr.png') center center no-repeat;
}

.es #s5 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_title_es.png') center center no-repeat;
}

.pt #s5 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_title_pt.png') center center no-repeat;
}

.main #s5 .title {
	background-size: contain;
}

#s5 .swiper_box {
	position: relative;
	margin: 0 auto;
	margin-top: 414px;
	width: 100%;
}

#s5 .swiper-container {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/feature_in.svg') center center no-repeat;
	width: 861px;
	height: 484px;
	padding: 13px 18px;
}

/*zh*/
.zh #s5 .swiper1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/1_zh.jpg');
	background-size: contain;
}

.zh #s5 .swiper2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/2_zh.jpg');
	background-size: contain;
}

.zh #s5 .swiper3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/3_zh.jpg');
	background-size: contain;
}

.zh #s5 .swiper4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/4_zh.jpg');
	background-size: contain;
}

.zh #s5 .swiper5 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/5_zh.jpg');
	background-size: contain;
}

/*en*/
.en #s5 .swiper1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/1_en.jpg');
	background-size: contain;
}

.en #s5 .swiper2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/2_en.jpg');
	background-size: contain;
}

.en #s5 .swiper3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/3_en.jpg');
	background-size: contain;
}

.en #s5 .swiper4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/4_en.jpg');
	background-size: contain;
}

.en #s5 .swiper5 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/5_en.jpg');
	background-size: contain;
}

/*fr es pt*/
.fr #s5 .swiper1,
.es #s5 .swiper1,
.pt #s5 .swiper1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/1.jpg');
	background-size: contain;
}

.fr #s5 .swiper2,
.es #s5 .swiper2,
.pt #s5 .swiper2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/2.jpg');
	background-size: contain;
}

.fr #s5 .swiper3,
.es #s5 .swiper3,
.pt #s5 .swiper3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/3.jpg');
	background-size: contain;
}

.fr #s5 .swiper4,
.es #s5 .swiper4,
.pt #s5 .swiper4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/4.jpg');
	background-size: contain;
}

.fr #s5 .swiper5,
.es #s5 .swiper5,
.pt #s5 .swiper5 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/5.jpg');
	background-size: contain;
}

/*th*/
.th #s5 .swiper1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/1_th.jpg');
	background-size: contain;
}

.th #s5 .swiper2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/2_th.jpg');
	background-size: contain;
}

.th #s5 .swiper3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/3_th.jpg');
	background-size: contain;
}

.th #s5 .swiper4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/4_th.jpg');
	background-size: contain;
}

.th #s5 .swiper5 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/swiper/5_th.jpg');
	background-size: contain;
}

#s5 .swiper-button-prev,
#s5 .swiper-button-next {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/chara_arrow.svg') center center no-repeat;
	background-size: contain;
	width: 73px;
	height: 95px;
	left: -1050px;
	right: 0;
	margin: 0 auto;
	margin-top: -102px;
	transition: .3s;
}

#s5 .swiper-button-prev:focus,
#s5 .swiper-button-next:focus {
	outline: 0;
}

#s5 .swiper-button-prev:hover {
	left: -1055px;
}

#s5 .swiper-button-next:hover {
	left: 1055px;
}

#s5 .swiper-button-next {
	transform: scaleX(-1);
	left: 1050px;
}

#s5 .dot_bg {
	width: 800px;
	height: 21px;
	position: relative;
	margin: 0 auto;
	margin-top: 52px;
}

#s5 .dot_bg:before,
#s5 .dot_bg:after {
	content: ' ';
	width: 309px;
	height: 1px;
	background: #000;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
}

#s5 .dot_bg:after {
	right: 0;
	left: auto;
}

#s5 .swiper-pagination {
	margin: 0 auto;
	position: absolute;
	right: 0;
	left: 0;
}

#s5 .swiper-pagination-bullet {
	background: #000;
	width: 8px;
	height: 8px;
	border: 2px solid #000;
	border-radius: 0;
	opacity: 1;
	margin: 0 5px;
}

#s5 .swiper-pagination-bullet-active {
	background: #fff100;
}


/* S6 ------------------------------------------------------- */

#s6 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_bg.png') top center no-repeat;
	background-size: cover;
	height: 1166px;
	position: relative;
	overflow: hidden;
	margin-top: -134px;
}

#s6 .title {
	width: 458px;
	height: 151px;
	position: relative;
	margin: 0 auto;
	margin-top: 204px;
	left: 9%;
}

.zh #s6 .title,
.zh #news_main .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_zh.png') center center no-repeat;
}

.en #s6 .title,
#news_main .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_en.png') center center no-repeat;
}

.th #s6 .title,
.th #news_main .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_th.png') center center no-repeat;
}

.fr #s6 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_fr.png') center center no-repeat;
}

.es #s6 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_es.png') center center no-repeat;
}

.pt #s6 .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_pt.png') center center no-repeat;
}

.main #s6 .title,
.news_main .title {
	background-size: contain !important;
}

#s6 .box {
	position: relative;
	width: 1052px;
	height: 428px;
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_bg.png') bottom center no-repeat;
	margin: 0 auto;
	margin-top: 136px;
}

#s6 .box .more {
	position: absolute;
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_more.png') top center no-repeat;
	width: 164px;
	height: 48px;
	right: 6px;
	cursor: pointer;
	transition: .3s;
}

.th #s6 .box .more {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_more_th.png') top center no-repeat;
}

#s6 .box .more:hover {
	right: 2px;
}

#s6 .swiper_box {
	position: absolute;
	width: 515px;
	left: 8px;
	top: 54px;
}

#s6 .swiper-container3 {
	width: 478px;
	height: 290px;
	overflow: hidden;
	margin: 0 auto;
	background-color: #f7f7f7;
}

#s6 .swiper-slide img {
	width: 100%;
}

#s6 .swiper1 {
	/* background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news/swiper1.png');
			background-size: cover; */
}

#s6 .swiper2 {
	/* background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news/swiper2.png');
			background-size: cover; */
}

#s6 .swiper3 {
	/* background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news/swiper3.png');
			background-size: cover; */
}

#s6 .swiper4 {
	/* background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news/swiper4.png');
			background-size: cover; */
}

#s6 .swiper5 {
	/* background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news/swiper5.png');
			background-size: cover; */
}

#s6 .dot_bg {
	position: relative;
	top: 3px;
}

#s6 .swiper-pagination3 {
	display: block;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet {
	position: relative;
	width: 101px;
	height: 65px;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	color: #3f3f3f;
	opacity: 1;
	background-color: #f0f0f0;
	border-radius: 0;
	margin-right: 2px;
	transition: 0.3s;
}

.th #s6 .swiper-pagination3 .swiper-pagination-bullet {
	font-size: 17px;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet-active {
	background: #fff;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet-active:after {
	content: '';
	position: absolute;
	background: #fff100;
	width: 100%;
	height: 4px;
	bottom: 1px;
	left: 0;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet:nth-child(1).swiper-pagination-bullet-active:after {
	content: none;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet:nth-child(1) {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_swiperdot.png') bottom left no-repeat;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet:nth-child(1).swiper-pagination-bullet-active {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_swiperdot_a.png') bottom left no-repeat;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet:nth-last-child(1) {
	margin-right: 0;
}

#s6 .swiper-pagination3 .swiper-pagination-bullet span {
	position: absolute;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	word-break: break-all;
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	width: 88px;
	height: 48px;
}

#s6 .list_box {
	position: absolute;
	right: 36px;
	top: 54px;
	width: 464px;
}

#s6 .list_box .tabs {
	height: 35px;
	position: relative;
}

#s6 .list_box .tabs li,
#news_main .list_box .tabs li {
	float: left;
	width: 87px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	background-color: #f0f0f0;
	margin-right: 7px;
	cursor: pointer;
	color: #3f3f3f;
	transition: .4s;
	background-position: -20px 4px;
	box-sizing: border-box;
}

.zh #s6 .list_box .tabs li {
	font-size: 16px;
}

.zh #news_main .list_box .tabs li,
.th #news_main .list_box .tabs li {
	font-size: 22px;
}

.th #s6 .list_box .tabs li {
	font-size: 18px;
}

#s6 .list_box .tabs li:nth-last-child(1),
#news_main .list_box .tabs li:nth-last-child(1) {
	margin-right: 0;
}

#s6 .list_box .tabs li.tab_active,
#news_main .list_box .tabs li.tab_active {
	border: 1px solid #3f3f3f;
	box-sizing: border-box;
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_title_bg.png') left bottom no-repeat #fff100;
	background-size: 46px;
	background-position: -17px 4px;
	padding-left: 12px;
}

#s6 .list_box .newslist {
	position: relative;
	top: 12px;
	height: 296px;
}

#s6 .list_box .newslist a,
#news_main .list_box .newslist a{
	text-decoration: none;
}

#s6 .list_box .newslist li,
#news_main .list_box .newslist li {
	font-size: 15px;
	height: 45px;
	padding-left: 60px;
	box-sizing: border-box;
	color: #3f3f3f;
	line-height: 45px;
	cursor: pointer;
	margin-bottom: 5px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	padding-right: 84px;
	transition: .3s;
}

.th #s6 .list_box .newslist li {
	font-size: 16px;
}

.th #news_main .list_box .newslist li {
	font-size: 22px;
}


/*en*/
#s6 .list_box .newslist li.tab1,
#news_main .list_box .newslist li.tab1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class1_en.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

#s6 .list_box .newslist li.tab2,
#news_main .list_box .newslist li.tab2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class2_en.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

#s6 .list_box .newslist li.tab3,
#news_main .list_box .newslist li.tab3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class3_en.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

#s6 .list_box .newslist li.tab4,
#news_main .list_box .newslist li.tab4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class4_en.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

/*zh*/
.zh #s6 .list_box .newslist li.tab1,
.zh #news_main .list_box .newslist li.tab1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class1.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

.zh #s6 .list_box .newslist li.tab2,
.zh #news_main .list_box .newslist li.tab2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class2.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

.zh #s6 .list_box .newslist li.tab3,
.zh #news_main .list_box .newslist li.tab3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class3.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

.zh #s6 .list_box .newslist li.tab4,
.zh #news_main .list_box .newslist li.tab4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class4.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

/*th*/
.th #s6 .list_box .newslist li.tab1,
.th #news_main .list_box .newslist li.tab1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class1_th.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

.th #s6 .list_box .newslist li.tab2,
.th #news_main .list_box .newslist li.tab2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class2_th.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

.th #s6 .list_box .newslist li.tab3,
.th #news_main .list_box .newslist li.tab3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class3_th.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}

.th #s6 .list_box .newslist li.tab4,
.th #news_main .list_box .newslist li.tab4 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_class4_th.png') left center no-repeat;
	background-size: 40px;
	background-position-x: 10px;
}


#s6 .list_box .newslist li:hover,
#news_main .list_box .newslist li:hover {
	background-color: #f7f7f7 !important;
}

#s6 .list_box .newslist li span,
#news_main .list_box .newslist li span {
	font-size: 11.5px;
	color: #a1a2a3;
	right: 10px;
	position: absolute;
}


/* Go Top --------------------------------------------------- */

#gotop {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/gotop.png') center center no-repeat;
	background-size: contain;
	width: 84px;
	height: 85px;
	position: absolute;
	right: 1.3%;
	margin-top: -106px;
	cursor: pointer;
	transition: .3s;
}

.pt #gotop {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/gotop_pt.png') center center no-repeat;
	background-size: contain;
}

#gotop:hover {
	transform: rotate(10deg);
}


/* Footer --------------------------------------------------- */

footer {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/cr_line.jpg') top center no-repeat #000;
	height: 137px;
	color: #fff;
	user-select: none;
}

footer .pic {
	width: 274px;
	position: absolute;
	top: 55%;
	transform: translate(0, -50%);
	left: 3%;
}

footer .pic li {
	display: inline-block;
	margin: 0 9px;
}

footer .dena {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/cr_dena.png') top center no-repeat;
	background-size: contain;
	width: 80px;
	height: 38px;
}

footer .toei {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/cr_toei.png') top center no-repeat;
	background-size: contain;
	width: 89px;
	height: 58px;
}

footer .pic p {
	font-size: 13px;
	font-family: Arial;
}

footer .info {
	font-family: Arial;
	font-size: 13px;
	position: absolute;
	right: 1%;
	top: 55%;
	transform: translate(0, -50%);
}

footer .info li {
	line-height: 20px;
}

footer .info span {
	cursor: pointer;
	text-decoration: underline;
	transition: .2s;
}

footer .info span:hover {
	color: #ffff01;
}

footer .info p {
	margin-top: 5px;
}

footer a:link a:active a:visited {
	color: #fff !important;
	text-decoration: none;
}


[data-aos="title_ani"] {
	background-position: 0 135px !important;
	transition-property: background-position;
}

[data-aos="title_ani"].aos-animate {
	background-position: 0 0 !important;
}

[data-aos="fade-left2"] {
	opacity: 0 !important;
	transform: translate3d(100px, 0, 0) scaleX(-1) !important;
	transition-property: opacity, transform;
}

[data-aos="fade-left2"].aos-animate {
	opacity: 1 !important;
	transform: translateZ(0) scaleX(-1) !important;
}

[data-aos="opacity_ani"] {
	opacity: 0 !important;
	transition-property: opacity;
}

[data-aos="opacity_ani"].aos-animate {
	opacity: 1 !important;
}


/* Pop Frame ------------------------------------------------ */

#popframe {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1001;
	min-width: 800px;
}

#popframe .bg {
	background: #000;
	position: relative;
	width: 100%;
	height: 100%;
	opacity: 0.8;
	animation: pop_bg_ani .6s forwards;
}

@keyframes pop_bg_ani {
	from {
		opacity: 0
	}

	to {
		opacity: 0.8
	}
}

.pop_bg_out {
	animation: pop_bg_out .6s forwards !important;
}

@keyframes pop_bg_out {
	from {
		opacity: 0.8
	}

	to {
		opacity: 0
	}
}

#popframe .box {
	display: none;
	width: 527px;
	height: 382px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: #fff 2px solid;
	animation: pop_box_ani .3s forwards;
}

@keyframes pop_box_ani {
	from {
		transform: translate(-50%, -20%);
		opacity: 0
	}

	to {
		transform: translate(-50%, -50%);
		opacity: 1
	}
}

.pop_box_out {
	animation: pop_box_out .3s forwards !important;
}

@keyframes pop_box_out {
	from {
		transform: translate(-50%, -50%);
		opacity: 1
	}

	to {
		transform: translate(-50%, -20%);
		opacity: 0
	}
}

#popframe .box.photo1 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic1.jpg') center center no-repeat;
	background-size: contain;
}

#popframe .box.photo2 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic2.jpg') center center no-repeat;
	background-size: contain;
}

#popframe .box.photo3 {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/story_pic3.jpg') center center no-repeat;
	background-size: contain;
}

#popframe .video_box {
	display: none;
	width: 800px;
	height: 464px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: #fff 2px solid;
	animation: pop_box_ani .3s forwards;
}

#popframe .video_box .video {
	position: absolute;
	width: 100%;
	padding-top: 58%;
	max-width: 800px;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
}

.video-container {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#popframe .close {
	position: absolute;
	width: 42px;
	height: 42px;
	right: 0;
	top: -13.5%;
	cursor: pointer;
	transition: .3s;
}

#popframe .close:before {
	content: ' ';
	transform: rotate(45deg);
	width: 120%;
	height: 1px;
	display: block;
	background: #fff;
	top: 20px;
	left: -5px;
	position: absolute;
}

#popframe .close:after {
	content: ' ';
	transform: rotate(-45deg);
	width: 120%;
	height: 1px;
	display: block;
	background: #fff;
	top: 20px;
	left: -5px;
	position: absolute;
}

#popframe .close:hover {
	transform: rotate(10deg);
}


/* SP Menu -------------------------------------------------- */

.nav-icon {
	display: none;
	width: 8%;
	padding-top: 7%;
	position: absolute;
	top: 0.25%;
	left: 3%;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
	z-index: 1000;
	animation: fadeInDown .6s forwards;
}

.nav-icon span {
	display: block;
	position: absolute;
	padding-top: 7%;
	width: 100%;
	background: #626262;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

.nav-icon span:nth-child(1) {
	top: 0px;
}

.nav-icon span:nth-child(2),
.nav-icon span:nth-child(3) {
	top: 30%;
}

.nav-icon span:nth-child(4) {
	top: 60%;
}

.nav-icon.open span:nth-child(1) {
	top: 22%;
	width: 0%;
	left: 50%;
}

.nav-icon.open span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

.nav-icon.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.nav-icon.open span:nth-child(4) {
	top: 22%;
	width: 0%;
	left: 50%;
}

#sp_menu {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
	min-width: 320px;
	overflow: auto;
}

#sp_menu .bg {
	background: #fff;
	position: relative;
	width: 100%;
	height: 100%;
	animation: fadeInLeft .3s forwards;
}

#sp_menu .box {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/sp_menu_bg.jpg') top center no-repeat;
	background-size: contain;
	padding-top: 150%;
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	animation: fadeInLeft .3s forwards;
}

.sp_menu_box_out {
	animation: sp_menu_box_out .3s forwards !important;
}

@keyframes sp_menu_box_out {
	from {
		left: 0;
	}

	to {
		left: -100%;
	}
}

#sp_menu .logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/logo.png') top center no-repeat;
	background-size: contain;
	max-width: 511px;
	width: 64%;
	padding-top: 34%;
	position: absolute;
	top: 10.5%;
	margin: 0 auto;
	right: 0;
	left: 0;
	animation: zoomIn .6s forwards;
}

.th #sp_menu .logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/logo_th.png') top center no-repeat;
	background-size: contain;
}

.en #sp_menu .logo {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/logo_en.png') top center no-repeat;
	background-size: contain;
}

#sp_menu .btns {
	position: absolute;
	width: 100%;
	top: 37.5%;
}

#sp_menu .btns li {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/sp_menu_list.png') top center no-repeat;
	background-size: cover;
	max-width: 688px;
	width: 86%;
	padding-top: 10.25%;
	margin: 0 auto;
	margin-bottom: 6%;
	cursor: pointer;
	position: relative;
	animation: sp_menu_list_ani .6s forwards;
	overflow: hidden;
}

@keyframes sp_menu_list_ani {
	from {
		padding-top: 0
	}

	to {
		padding-top: 10.25%;
	}
}

#sp_menu .btns p {
	position: absolute;
	transition: .3s;
	font-family: Arial;
}

.zh #sp_menu .btns p {
	font-family: 'Microsoft Yahei';
}

#sp_menu .no {
	top: 29.4%;
	left: 9.8%;
	color: #0096db;
	font-size: 2.6vw;
	line-height: 2.6vw;
}

#sp_menu .no span {
	font-size: 4.5vw;
}

#sp_menu .title {
	color: #fff;
	top: -2%;
	right: 3.5%;
	font-size: 6.5vw;
	line-height: 7.5vw;
}

.zh #sp_menu .title {
	font-size: 6.5vw;
	line-height: 7.5vw;
}

#sp_menu .txt {
	bottom: 6%;
	right: 3.5%;
	color: #fff585;
}

.zh #sp_menu .txt {
	font-size: 2.8vw;
	line-height: 2.8vw;
}

.th #sp_menu .txt {
	font-size: 3.5vw;
	line-height: 3.2vw;
}

#sp_menu .apps {
	position: absolute;
	top: 84%;
	width: 100%;
	text-align: center;
	animation: fadeInDown 1s forwards;
}

#sp_menu .apps li {
	display: inline-block;
	cursor: pointer;
}

#sp_menu .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google.svg') top center no-repeat;
	width: 24.5%;
	height: auto;
	padding-top: 8%;
	margin-right: 1%;
}

.fr #sp_menu .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google_fr.svg') top center no-repeat;
}

.es #sp_menu .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google_es.svg') top center no-repeat;
}

.pt #sp_menu .google {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_google_pt.svg') top center no-repeat;
}

#sp_menu .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios.svg') top center no-repeat;
	width: 22.5%;
	height: auto;
	padding-top: 8%;
	margin-right: 1%;
}

.fr #sp_menu .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios_fr.svg') top center no-repeat;
}

.es #sp_menu .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios_es.svg') top center no-repeat;
	width: 26%;
}

.pt #sp_menu .ios {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_ios_pt.svg') top center no-repeat;
}

#sp_menu .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk.jpg') top center no-repeat;
	width: 35.75%;
	height: auto;
	padding-top: 8%;
}

.fr #sp_menu .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk_fr.jpg') top center no-repeat;
}

.es #sp_menu .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk_es.jpg') top center no-repeat;
}

.pt #sp_menu .apk {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/app_apk_pt.jpg') top center no-repeat;
}

.main #sp_menu .apk {
	background-size: contain;
}


/* Loading -------------------------------------------------- */

#app_loading {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/cr_line.jpg') center center no-repeat;
	position: fixed;
	margin: 0 auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
}

/* #app_loading:before, #app_loading:after {
	content: ' ';
	position: absolute;
	height: 2px;
	background: #ffff01;
	width: 43%;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
} */

#app_loading:after {
	right: 0;
	left: auto;
}

#app_loading .loadingbg {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/loading_bg.png') center center no-repeat;
	background-size: contain;
	width: 168px;
	height: 202px;
	position: absolute;
	margin: 0 auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	animation: rotate 1.5s linear infinite;
	transform-origin: 0% 0%;
	z-index: 1;
}

@keyframes rotate {
	from {
		transform: rotate(0) translate(-50%, -50%)
	}

	to {
		transform: rotate(360deg) translate(-50%, -50%)
	}
}

#app_loading img {
	position: absolute;
	margin: 0 auto;
	max-width: 168px;
	top: 50%;
	left: 50%;
	transform: translate(-38%, -50%);
	z-index: 1;
}


/* Rewards -------------------------------------------------- */

#rewards {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/reward_btn.png') top center no-repeat;
	background-size: contain;
	width: 38px;
	height: 253px;
	position: fixed;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
	z-index: 2;
	cursor: pointer;
	opacity: 0;
}

.rewards_ani {
	animation: rewards_ani .8s forwards;
}

@keyframes rewards_ani {
	from {
		left: -38px;
		opacity: 1
	}

	to {
		left: 0;
		opacity: 1
	}
}


/* User Agreement -------------------------------------------------- */

#popframe .agreement_box {
	display: none;
	width: 800px;
	height: 464px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: #fff 2px solid;
	animation: pop_box_ani .3s forwards;
	font-family: Arial;
}

#popframe .agreement {
	background: rgba(255, 255, 255, 0.9);
	width: 100%;
	height: 100%;
	padding: 15px 8px 15px 15px;
	box-sizing: border-box;
	font-size: 12px;
	text-align: left;
	line-height: 14px;
}

#popframe .agreement_in {
	width: 100%;
	height: 100%;
	overflow: auto;
}

#popframe .title {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 10px;
}

#popframe p {
	margin-bottom: 10px;
	width: 98%;
}

#popframe span {
	font-weight: bold;
}

#popframe ul {
	margin-bottom: 10px;
}

#popframe li {
	margin-bottom: 4px;
	margin-left: 14px;
	width: 96%;
}

#popframe li a {
	display: block;
	padding-left: 8px;
}

#popframe li p {
	margin-top: 10px;
	margin-bottom: 2px;
}

#popframe li li {
	list-style-type: initial;
	margin-left: 28px;
}

#popframe li li li {
	list-style-type: circle;
}

#popframe .agreement_in .tg {
	border-collapse: collapse;
	border-spacing: 0;
	width: 96%;
	margin-bottom: 4px;
	margin-left: 14px;
}

#popframe .agreement_in .tg td {
	border-color: black;
	border-style: solid;
	border-width: 1px;
	font-family: Arial, sans-serif;
	overflow: hidden;
	padding: 10px 5px;
	word-break: normal;
}

#popframe .agreement_in .tg th {
	border-color: black;
	border-style: solid;
	border-width: 1px;
	font-family: Arial, sans-serif;
	font-weight: bold;
	overflow: hidden;
	padding: 10px 5px;
	word-break: normal;
}

#popframe .agreement_in .tg .tg-0pky {
	border-color: inherit;
	text-align: left;
	vertical-align: top;
}

#popframe .agreement_in .tg .tg-0lax {
	text-align: left;
	vertical-align: top;
}

#popframe .agreement_in .tg li {
	list-style-type: disc;
}

#popframe .agreement_in .talic {
	font-style: italic;
	font-weight: normal;
}

#popframe .agreement_in .noliststyle {
	list-style-type: none;
}

/* Languages -------------------------------------------------- */

body .lan .display {
	display: block;
}

.zh .lan {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_zh.png') top right no-repeat;
}

.en .lan {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_en.png') top right no-repeat;
}

.th .lan {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_th.png') top right no-repeat;
}

.fr .lan {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_fr.png') top right no-repeat;
}

.es .lan {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_es.png') top right no-repeat;
}

.pt .lan {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_pt.png') top right no-repeat;
}

.main .lan {
	background-size: cover;
}

.lan .select {
	display: none;
	pointer-events: none;
	width: 100%;
	height: 100%;
	position: relative;
	animation: fadeInDown forwards;
}

.lan div:nth-child(1) {
	margin-top: 100%;
	animation-duration: .5s;
	z-index: 1;
}

.lan div:nth-child(2) {
	animation-duration: .6s;
}

.lan div:nth-child(3) {
	animation-duration: .7s;
}

.lan div:nth-child(4) {
	animation-duration: .8s;
}

.lan div:nth-child(5) {
	animation-duration: .9s;
}

.lan .zh {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_zh.png') top left no-repeat;
}

.lan .en {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_en.png') top left no-repeat;
}

.lan .th {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_th.png') top left no-repeat;
}

.lan .fr {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_fr.png') top left no-repeat;
}

.lan .es {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_es.png') top left no-repeat;
}

.lan .pt {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/top_pt.png') top left no-repeat;
}

.main .lan .select {
	background-size: cover;
}


/* News Pages ------------------------------------------------ */

#news_main {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/newsmain_bg.jpg') top center no-repeat fixed;
	background-size: cover;
}

#news_main .top {
	height: 273px;
}

#news_main .title {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_title_en.png') center center no-repeat;
	background-size: contain;
	width: 458px;
	height: 151px;
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#news_main .in {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/cr_line.jpg') top center no-repeat rgba(255, 255, 255, .7);
	background-position-y: -4.5px;
	max-width: none;
	height: auto;
}

#news_main .box {
	width: 755px;
	margin: 0 auto;
	padding-top: 30px;
}

#news_main .list_box {
	background: #fff;
	padding: 40px 34px;
	user-select: none;
}

#news_main .list_box .tabs {
	height: 51.6px;
}

#news_main .list_box .tabs li {
	width: 130px;
	height: 51.6px;
	line-height: 51.6px;
	font-size: 25px;
	margin-right: 9px;
	background-position: -32px 5px;
}

#news_main .list_box .tabs li.tab_active {
	background-position: -25px 5px;
	background-size: unset;
	padding-left: 20px;
}

#news_main .list_box .newslist {
	margin-top: 18px;
}

#news_main .list_box .newslist li {
	position: relative;
	font-size: 20px;
	height: 66.4px;
	padding-left: 95px;
	line-height: 66.4px;
	margin-bottom: 8px;
	padding-right: 128px;
}

#news_main .list_box .newslist li.tab1,
#news_main .list_box .newslist li.tab2,
#news_main .list_box .newslist li.tab3,
#news_main .list_box .newslist li.tab4 {
	background-size: unset !important;
	background-position-x: 17px !important;
}

#news_main .list_box .newslist li span {
	font-size: 16.35px;
	right: 16px;
}

#news_main .nav {
	background-color: #f7f7f7;
	margin-top: 18px;
	text-align: center;
	height: 66.4px;
}

#news_main .back_btn,
#news_main .list_btn {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_btnback_en.png') top center no-repeat;
	background-size: contain;
	width: 215px;
	height: 71px;
	margin: 0 auto;
	margin-top: 56px;
	margin-bottom: 30px;
	cursor: pointer;
}

#news_main .list_btn {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_btn_en.png') top center no-repeat;
	background-size: contain;
}

.zh #news_main .back_btn {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_btnback.png') top center no-repeat;
	background-size: contain;
}

.zh #news_main .list_btn {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_btn.png') top center no-repeat;
	background-size: contain;
}

.th #news_main .back_btn {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_btnback_th.png') top center no-repeat;
	background-size: contain;
}

.th #news_main .list_btn {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_btn_th.png') top center no-repeat;
	background-size: contain;
}

#news_main .nav li {
	display: inline-block;
	height: 38px;
	border: 1px solid #000;
	line-height: 38px;
	font-size: 17px;
	vertical-align: middle;
	top: 13px;
	position: relative;
}

#news_main .prev,
#news_main .next {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_arrow.png') center center no-repeat #fff;
	width: 38px;
	cursor: pointer;
	color: #fff;
}

#news_main .next {
	transform: scaleX(-1);
}

#news_main .pages {
	background: #fff;
	width: 203px;
	color: #3f3f3f;
	margin: 0px 10px;
}

#news_main .list_box.article {
	user-select: auto;
	color: #3f3f3f;
}

#news_main .article_title {
	background-color: #f7f7f7;
	font-size: 29px;
	font-weight: bold;
	text-align: center;
	padding: 18px 20px;
}

#news_main .article_title span {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

#news_main .time {
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	color: #7e7e7e;
	margin-top: 32px;
}

#news_main .share {
	font-size: 16px;
	color: #7e7e7e;
	float: right;
	margin-top: -40px;
}

#news_main .share li {
	display: inline-block;
	vertical-align: middle;
}

#news_main .share_fb,
#news_main .share_line {
	width: 53px;
	height: 52px;
	cursor: pointer;
}

#news_main .share_fb {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_sharefb.png') top center no-repeat;
}

#news_main .share_line {
	background: url('https://os-web-cdn.mobage.tw/cdn/web/global_sd/static/main/img/news_list_shareline.png') top center no-repeat;
}

#news_main .article_text {
	padding-top: 40px;
	padding-bottom: 26px;
	font-size: 16px;
}

#news_main .article_text img {
	max-width: 100%;
}

#news_main .article_text a:link,
#news_main .article_text a:visited,
#news_main .article_text a:hover,
#news_main .article_text a:active {
	color: rgb(25, 98, 213);
	text-decoration: none;
}

#news_main .article_text a:hover {
	text-decoration: underline;
}