body {
	position: relative;
	max-width: 2208px;
	min-width: 1380px;
	/*height: 4488px;*/
	height: 4388px;
	margin: 0 auto;
}

.container {
	position: relative;
	width: 100%;
	height: 100%;
	font-size: 18px;
	overflow: hidden;
	background: url(https://media.game-tree.com/simkoong/home/img/bg.jpg) center top no-repeat;
	-webkit-background-size: auto 100%;
	background-size: auto 100%;
}

.logo {
	position: absolute;
	top: 28px;
	right: 26px;
	width: 331px;
	height: 176px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/logo.png);
}

.main {
	position: relative;
	width: 1380px;
	height: 4190px;
	margin: 0 auto;
}


/* page1 */
.page1 {
	position: relative;
	width: 100%;
	height: 1051px;
}

.page1 .pendant{
	position: fixed;
    top: 682px;
	    right: 50%;
	    transform: translateX(690px);
	    z-index: 9;
	width: 200px;
	height: 200px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/pendant.png);
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
}
@media only screen and (max-width: 1380px) {
	.page1 .pendant{
		right: 0;
		transform: translateY(0);
	}
}

.page1 .video_btn {
	position: absolute;
	bottom: 502px;
	left: 50%;
	transform: translateX(-55%);
	width: 219px;
	height: 96px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/video_btn.png);
	cursor: pointer;
}

.page1 .book_btn {
	position: absolute;
	bottom: 132px;
	left: 50%;
	transform: translateX(-54%);
	width: 550px;
	height: 67px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/book_btn.png);
	cursor: pointer;
}

.page1 .book_btn:after {
	content: '';
	position: absolute;
	top: -61px;
	right: -81px;
	width: 184px;
	height: 224px;
	background: url(https://media.game-tree.com/simkoong/home/img/book_btn_girl.png) no-repeat;
}

.page1 .btn_wrap {
	display: -webkit-flex;
	display: flex;
	justify-content: space-between;
    position: absolute;
    bottom: 258px;
    left: 50%;
    transform: translateX(-54%);
    width: 460px;
    height: 62px;
}
.page1 .btn_wrap a{
	display: block;
	width: 209px;
	height: 62px;
	-webkit-background-size: auto 100%;
	background-size: auto 100%;
	background-position: center center;
	background-repeat: no-repeat;
}
.page1 .btn_wrap .google{
	background-image: url(https://media.game-tree.com/simkoong/home/img/google.png);
}
.page1 .btn_wrap .apple{
	background-image: url(https://media.game-tree.com/simkoong/home/img/apple.png);
}

/* page2 */

.page2 {
	display: -webkit-flex;
	display: flex;
	position: relative;
	z-index: 1;
	height: 909px;
}

.book_main {
	width: 652px;
	padding-top: 61px;
}

.book_main .title {
	width: 532px;
	height: 291px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/book_title.png);
	margin-left: 18px;
}

.device_wrap {
	height: 36px;
	line-height: 36px;
	padding-left: 88px;
	margin-top: 31px;
}

.device_wrap .device_item {
	position: relative;
	width: 210px;
	height: 100%;
	background: url(https://media.game-tree.com/simkoong/home/img/check.png) left center no-repeat;
	-webkit-background-size: 36px 36px;
	background-size: 36px 36px;
	cursor: pointer;
	padding-left: 46px;
}

.device_wrap .device_item.active {
	background-image: url(https://media.game-tree.com/simkoong/home/img/checked.png);
}

.device_wrap .device_item .device_type {
	position: absolute;
	top: 0;
	left: 0;
	width: 32px;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.device_wrap .device_item p {
	font-size: 18px;
	font-weight: bold;
}

.input_item {
	display: flex;
	width: 538px;
	height: 72px;
	line-height: 72px;
	font-size: 24px;
	border: 1px solid #000;
	transform: skewX(-20deg);
	margin-top: 28px;
	margin-left: 34px;
}

.input_item span {
	position: relative;
	display: block;
	width: 146px;
	text-align: center;
	transform: skewX(20deg);
}

.input_item span:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 1px;
	height: 100%;
	background-color: #10080b;
	transform: skewX(-20deg);
}

.mobile {
	flex: 1;
	height: 60px;
	font-size: 24px;
	/*font-weight: bold;*/
	color: #000;
	text-align: center;
	background-color: transparent;
	transform: skewX(20deg);
}

::-webkit-input-placeholder {
	/* WebKit browsers */
	color: #727272;
	font-size: 18px;
}

:-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	color: #727272;
	font-size: 18px;
}

::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	color: #727272;
	font-size: 18px;
}

:-ms-input-placeholder {
	/* Internet Explorer 10+ */
	color: #727272;
	font-size: 18px;
}

.agree_main {
	display: block;
	height: 46px;
	line-height: 46px;
	background: url(https://media.game-tree.com/simkoong/home/img/check.png) left center no-repeat;
	-webkit-background-size: 36px 36px;
	background-size: 36px 36px;
	cursor: pointer;
	margin-top: 24px;
	margin-left: 3px;
}

.agree_main.active {
	background-image: url(https://media.game-tree.com/simkoong/home/img/checked.png);
}

.agree_main .agreement_main_item {
	width: 40px;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.agree_main p {
	font-weight: bold;
}

.agreement_wrap {
	margin-left: 95px;
}

.agreement_wrap .agree_wrap_item {
	position: relative;
	display: block;
	width: 100%;
	height: 34px;
	line-height: 34px;
	font-size: 16px;
	background: url(https://media.game-tree.com/simkoong/home/img/check_agree.png) left center no-repeat;
	-webkit-background-size: 27px 26px;
	background-size: 27px 26px;
	cursor: pointer;
	margin-bottom: 10px;
	padding-left: 34px;
}

.agreement_wrap .agree_wrap_item .agreement_item {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 30px;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.agreement_wrap .agree_wrap_item.active {
	background-image: url(https://media.game-tree.com/simkoong/home/img/checked_agree.png);
}

.agreement_wrap .agree_wrap_item .privacy_btn {
	width: 156px;
	height: 32px;
	line-height: 32px;
	color: #f5f5f1;
	font-size: 18px;
	text-align: center;
	font-weight: bold;
	background-color: #000;
	margin-left: 18px;
	border-radius: 16px;
}

.book_submit {
	display: block;
	width: 367px;
	height: 92px;
	cursor: pointer;
	background-image: url(https://media.game-tree.com/simkoong/home/img/book_submit.png);
	margin: 20px 0 0 90px;
	position: relative;
}

.book_submit:after {
	content: '';
	position: absolute;
	top: -52px;
	right: -68px;
	width: 155px;
	height: 140px;
	background: url(https://media.game-tree.com/simkoong/home/img/book_submit_girl.png) no-repeat;
}

.reward_list {
	position: relative;
	width: 714px;
	height: 853px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/reward_list.png);
	margin-top: 63px;
}

.reward_list .item {
	position: absolute;
	width: 145px;
	height: 84px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/achieved.png);
	display: none;
}

.reward_list .item.active {
	display: block;
}

.reward_list .item1 {
	top: 156px;
	left: 281px;
}

.reward_list .item2 {
	top: 340px;
	left: 100px;
}

.reward_list .item3 {
	top: 340px;
	left: 462px;
}

.reward_list .item4 {
	top: 582px;
	left: 276px;
}

.page3 {
	position: relative;
	height: 1241px;
	padding-top: 156px;
}

.page3 .role_pic {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 2208px;
	height: 1640px;
	background-repeat: no-repeat;
	background-position: right bottom;
}

.page3 .role_pic.camp1_role1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_role1.png);
}

.page3 .role_pic.camp1_role2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_role2.png);
}

.page3 .role_pic.camp1_role3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_role3.png);
}

.page3 .role_pic.camp2_role1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_role1.png);
}

.page3 .role_pic.camp2_role2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_role2.png);
}

.page3 .role_pic.camp2_role3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_role3.png);
}

.page3 .role_pic.camp3_role1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_role1.png);
}

.page3 .role_pic.camp3_role2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_role2.png);
}

.page3 .role_pic.camp3_role3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_role3.png);
}

.page3 .role_pic.camp4_role1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_role1.png);
}

.page3 .role_pic.camp4_role2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_role2.png);
}

.page3 .role_pic.camp4_role3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_role3.png);
}

.page3 .role_pic.camp5_role1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_role1.png);
}

.page3 .role_pic.camp5_role2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_role2.png);
}

.page3 .role_pic.camp5_role3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_role3.png);
}

.page3 .main {
	position: relative;
	width: 100%;
	height: 100%;
}

.page3 .title {
	position: absolute;
	top: 164px;
	left: -192px;
	width: 160px;
	height: 275px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/role_title.png);
}

.page3 .name_wrap {
	height: 358px;
	margin-bottom: 151px;
}

.page3 .name_wrap .name {
	width: 600px;
	height: 310px;
	background-repeat: no-repeat;
	background-position: center bottom;
	margin-bottom: 16px;
}

.camp1 .name_wrap .name1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_name1.png);
}

.camp1 .name_wrap .name2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_name2.png);
}

.camp1 .name_wrap .name3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_name3.png);
}

.camp2 .name_wrap .name1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_name1.png);
}

.camp2 .name_wrap .name2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_name2.png);
}

.camp2 .name_wrap .name3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_name3.png);
}

.camp3 .name_wrap .name1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_name1.png);
}

.camp3 .name_wrap .name2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_name2.png);
}

.camp3 .name_wrap .name3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_name3.png);
}

.camp4 .name_wrap .name1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_name1.png);
}

.camp4 .name_wrap .name2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_name2.png);
}

.camp4 .name_wrap .name3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_name3.png);
}

.camp5 .name_wrap .name1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_name1.png);
}

.camp5 .name_wrap .name2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_name2.png);
}

.camp5 .name_wrap .name3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_name3.png);
}

.page3 .name_wrap .rarity_wrap {
	height: 32px;
	text-align: center;
	padding-left: 225px;
}

.page3 .name_wrap .rarity_wrap p {
	width: 90px;
	height: 32px;
}

.page3 .name_wrap .rarity {
	line-height: 32px;
	color: #fff;
	background-color: #000;
	margin-right: 10px;
}

.page3 .name_wrap .career {
	line-height: 28px;
	color: #000;
	border: 2px solid #000;
}

.page3 .head_wrap {
	position: relative;
	width: 630px;
	height: 131px;
	padding: 0 145px;
	margin-bottom: 58px;
}

.page3 .head_prev,
.page3 .head_next {
	position: absolute;
	top: 56px;
	width: 61px;
	height: 11px;
	cursor: pointer;
}

.page3 .head_prev {
	left: 1px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/role_prev.png);
}

.page3 .head_next {
	right: 1px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/role_next.png);
}

.page3 .head_list {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
}

.page3 .head_list .head_item {
	position: relative;
	display: block;
	width: 97px;
	height: 97px;
	cursor: pointer;
	filter: grayscale(0.6);
}

.page3 .head_list .head_item.active {
	filter: grayscale(0);
}

.page3 .head_list .head_item.active:after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 90px;
	height: 90px;
	border: 9px solid #76afdb;
	border-radius: 50%;
}

.camp1 .head_list .head1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_head1.png);
}

.camp1 .head_list .head2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_head2.png);
}

.camp1 .head_list .head3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp1_head3.png);
}

.camp2 .head_list .head1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_head1.png);
}

.camp2 .head_list .head2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_head2.png);
}

.camp2 .head_list .head3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp2_head3.png);
}

.camp3 .head_list .head1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_head1.png);
}

.camp3 .head_list .head2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_head2.png);
}

.camp3 .head_list .head3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp3_head3.png);
}

.camp4 .head_list .head1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_head1.png);
}

.camp4 .head_list .head2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_head2.png);
}

.camp4 .head_list .head3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp4_head3.png);
}

.camp5 .head_list .head1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_head1.png);
}

.camp5 .head_list .head2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_head2.png);
}

.camp5 .head_list .head3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/role/camp5_head3.png);
}

.page3 .camp_list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 510px;
	margin-left: 76px;
}

.page3 .camp_list .camp_item {
	display: block;
	width: 136px;
	height: 30px;
	line-height: 30px;
	text-align: right;
	padding-left: 104px;
	background: url(https://media.game-tree.com/simkoong/home/img/camp_select.png) left center no-repeat;
	margin-right: 50px;
	margin-bottom: 33px;
	cursor: pointer;
}

.page3 .camp_list .camp_item:nth-of-type(3),
.page3 .camp_list .camp_item:nth-of-type(5) {
	margin-right: 0;
}

.page3 .camp_list .camp_item.active {
	color: #d34f5e;
	background-image: url(https://media.game-tree.com/simkoong/home/img/camp_selected.png);
}


/*page4*/
.page4 {
	position: relative;
	height: 990px;
}

.page4 .center {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 2208px;
	height: 100%;
	padding-top: 30px;
}

.page4 .title {
	width: 100%;
	height: 169px;
	background: url(https://media.game-tree.com/simkoong/home/img/feature_title.png) center center no-repeat;
}

.feature {
	position: relative;
	width: 1217px;
	height: 672px;
	margin: 0 auto;
	/*background: url(https://media.game-tree.com/simkoong/home/img/feature_active.png) no-repeat;*/
	padding: 12px 0 0 12px;
}
.feature:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background: url(https://media.game-tree.com/simkoong/home/img/feature_active.png) no-repeat;
	/*padding: 12px 0 0 12px;*/
}

.feature .swiper {
	width: 1195px;
	height: 672px;
	overflow: hidden;
}

.feature .swiper-slide {
	width: 100%;
	height: 100%;
}

.feature .slide1 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/1.jpg);
}

.feature .slide2 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/2.jpg);
}

.feature .slide3 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/3.jpg);
}

.feature .slide4 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/4.jpg);
}

.feature .slide5 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/5.jpg);
}

.feature .slide6 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/6.jpg);
}

.feature .slide7 {
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/7.jpg);
}
.feature_swiper_prev_wrap,
.feature_swiper_next_wrap{
	position: absolute;
	top: 280px;
	width: 492px;
	height: 412px;
}
.feature_swiper_prev_wrap{
	left: 0;
}
.feature_swiper_next_wrap{
	right: 0;
}
.feature_swiper_prev_pic,
.feature_swiper_next_pic{
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: auto 100%;
	background-size: auto 100%;
	background-image: url(https://media.game-tree.com/simkoong/home/img/feature/6.jpg);
}
.feature_swiper_prev_wrap:before,
.feature_swiper_next_wrap:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.6);
}

.feature_swiper_prev,
.feature_swiper_next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 61px;
	height: 11px;
	background-repeat: no-repeat;
	background-position: center center;
	cursor: pointer;
}

.feature_swiper_prev:after,
.feature_swiper_next:after {
	display: none;
}

.feature_swiper_prev {
    left: auto;
	right: 1px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/role_prev.png);
}

.feature_swiper_next {
	left: 1px;
	background-image: url(https://media.game-tree.com/simkoong/home/img/role_next.png);
}


/* footer */
.footer{
	width: 100%;
	height: 198px;
	background-color: #1a1a1a;
	border-top: 15px solid #858585;
}
.footer .center{
	width: 1380px;
	height: 100%;
	margin: 0 auto;
}
.footer .footer_logo{
	width: 456px;
	height: 100%;
	background: url(https://media.game-tree.com/simkoong/home/img/foot_logo.png) left 38px center no-repeat;
	border-right: 6px solid #2c2c2c;
}
.footer .link_wrap{
	height: 100%;
}
.footer .link{
	display: flex;
	align-items: center;
	width: 564px;
	height: 100%;
	padding-left: 190px;
}
.footer .link a{
	position: relative;
	display: block;
	color: #7c7c7c;
	font-size: 18px;
	letter-spacing: 2px;
}
.footer .link a:first-child{
	padding-right: 26px;
}
.footer .link a:first-child:after{
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 2px;
	height: 16px;
	background-color: #444;
}
.footer .link a:last-child{
	padding-left: 24px;
}
.footer .open_list{
	display: flex;
	align-items: center;
	/*justify-content: space-between;*/
	width: 300px;
	height: 100%;
}
.footer .open_list a{
	display: block;
	width: 35px;
	height: 35px;
	background-repeat: no-repeat;
	background-position: center center;
}
.footer .open_list .ytb{
	background-image: url(https://media.game-tree.com/simkoong/home/img/icon_youtube.png);
	margin-right: 24px;
}
.footer .open_list .cafe{
	background-image: url(https://media.game-tree.com/simkoong/home/img/icon_cafe.png);
}
.footer .open_list .kakao{
	background-image: url(https://media.game-tree.com/simkoong/home/img/icon_kakao.png);
}
.footer .open_list .x{
	background-image: url(https://media.game-tree.com/simkoong/home/img/icon_x.png);
}
.footer .open_list .lounge{
	background-image: url(https://media.game-tree.com/simkoong/home/img/icon_lounge.png);
}

