@charset "utf-8";

/* ==========================================================================
RWD
========================================================================== */


@media screen and (max-width: 1300px) {
body {

	background: url(fs-bg_cover_m.gif) repeat 50% 50%;
	color:#000000;



}}
@media screen and (max-width: 860px) {

	
.mobile_wrapper {display:inline;}
.notitle{display:none;}




	.logo_img,.roleTxt_1,.roleTxt_2,.roleTxt_3 {
		display: none;
	}
	.wrap {
		padding-top: 480px;
		min-width: 100%;
		background-image: url('fs-head.jpg');
		background-size: 100%;
	}
	.logo {
		top: 30px;
		margin-left: -310px;
		width: 270px;
		height: 170px;
	}
	.people {
		top: 384px;
		margin-right: -328px;
		font-size: 50px;
		text-align: right;
		letter-spacing: 22px;
	}
	.main {
		padding-top: 30px;
		margin: 0 auto 20px;
		width: 95%;
		border-width: 10px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
	}
	section {
		width: 92%;
		padding: 30px 0 20px;
	}
	

	section#event_1 {
		padding-top: 0px;
	}
	section:last-child {
		padding-bottom: 30px;
	}
	article {
		width: 100%;
	}
	.title {
		background: none;
	}
	.title span {
		padding: 0;
	}
	.title img {
		padding: 0;
		margin: auto;
	}
	#event_1 .title img,
	#event_2 .title img {
		width: 82%;
	}
	#event_3 .title img {
		width: 85%;
	}
	#event_4 .title img {
		width: 80%;
	}
	#event_2 article img {
		width: 100%;
	}
	.step_1, .step_2, .step_3 {
		padding-left: 165px;
	}
	.step_1 .txt {
		width: 36%;
	}
	.role_1 {
		top: 350px;
		right: -110px;
	}
	.genius_1 {
		width: 90%;
		z-index:100;
	}
	.role_2 {

left: 209px; top: 1266px


	}
	.genius_2 {
		width: 70%;
	}
	.role_3 {
		top: 145px;
		right: -210px;
	}
	.genius_3 {
		width: 60%;
	}
	.inline {
		display: block;
	}
	.run {
		/* padding-left: 27.5%; */
	}
	.rate_bg {
		width: 100%;
	}
	.target img {
		margin: 0 .5% 8px 0;
		width: 19.5%;
	}
	.btn {
		width: 220px;
		height: 55px;
		font-size: 24px;
		line-height: 49px;
	}
	.btn:before {
		background-position: center -50%;
	}
	.btn_s {
		margin-top: 6px;
		font-size: 18px;
		width: 250px;
		height: 46px;
		line-height: 44px;
	}
	.btn_top {
		bottom: 135px;
	}
	.stepBox {
		margin-bottom: 50px;
	}
	
	
	
.cfield{display:none;}	

}


.ifooter {
	height:100px;
	background-color:#ffffff;
	!important;
}

footer{
	position:relative;}
	.cfield{
		width:180px;
		position:absolute;
		z-index:50;
		top:13px;
		right:130px;
		padding:5px;
		}
		#cf18{
			-moz-box-shadow:inset 0px 1px 0px 0px #f7c5c0;
			-webkit-box-shadow:inset 0px 1px 0px 0px #f7c5c0;
			box-shadow:inset 0px 1px 0px 0px #f7c5c0;
			background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff3d64), color-stop(1, #e00029) );
			background:-moz-linear-gradient( center top, #ff3d64 5%, #e00029 100% );
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3d64', endColorstr='#e00029');
			background-color:#ff3d64;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
			border:1px solid #d83526;
			display:inline-block;
		}
		#cf15{
			-moz-box-shadow:inset 0px 1px 0px 0px #fceaca;
			-webkit-box-shadow:inset 0px 1px 0px 0px #fceaca;
			box-shadow:inset 0px 1px 0px 0px #fceaca;
			background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fca729), color-stop(1, #f29100) );
			background:-moz-linear-gradient( center top, #fca729 5%, #f29100 100% );
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fca729', endColorstr='#f29100');
			background-color:#fca729;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
			border:1px solid #eeb44f;
			display:inline-block;
	}
		#cf12{
			-moz-box-shadow:inset 0px 1px 0px 0px #fce2c1;
			-webkit-box-shadow:inset 0px 1px 0px 0px #fce2c1;
			box-shadow:inset 0px 1px 0px 0px #fce2c1;
			background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffe354), color-stop(1, #fed800) );
			background:-moz-linear-gradient( center top, #ffe354 5%, #fed800 100% );
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe354', endColorstr='#fed800');
			background-color:#ffe354;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
			border:1px solid #eeb44f;
			display:inline-block;
			}
		#cf6{
			-moz-box-shadow:inset 0px 1px 0px 0px #97c4fe;
			-webkit-box-shadow:inset 0px 1px 0px 0px #97c4fe;
			box-shadow:inset 0px 1px 0px 0px #97c4fe;
			background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #07abeb), color-stop(1, #009ddb) );
			background:-moz-linear-gradient( center top, #07abeb 5%, #009ddb 100% );
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#07abeb', endColorstr='#009ddb');
			background-color:#07abeb;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
			border:1px solid #337fed;
			display:inline-block;
			}
		#cf0{
			-moz-box-shadow:inset 0px 1px 0px 0px #c1ed9c;
			-webkit-box-shadow:inset 0px 1px 0px 0px #c1ed9c;
			box-shadow:inset 0px 1px 0px 0px #c1ed9c;
			background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #58cc46), color-stop(1, #44b133) );
			background:-moz-linear-gradient( center top, #58cc46 5%, #44b133 100% );
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#58cc46', endColorstr='#44b133');
			background-color:#58cc46;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
			border:1px solid #83c41a;
			display:inline-block;
			}
		.cname{
			display:block;
			width:105px;
			float:right;
			font-size:13px;
			color:#ffffff;
			line-height:120%;
			word-wrap: break-word;
			word-break: break-all;
			vertical-align:middle;}
			#cn12{ color:#aba322;}
		.cimg{
			display:block;
			width:50px;
			height:50px;
			float:left;
			-webkit-border-top-left-radius:6px;
			-moz-border-radius-topleft:6px;
			border-top-left-radius:6px;
			-webkit-border-top-right-radius:6px;
			-moz-border-radius-topright:6px;
			border-top-right-radius:6px;
			-webkit-border-bottom-right-radius:6px;
			-moz-border-radius-bottomright:6px;
			border-bottom-right-radius:6px;
			-webkit-border-bottom-left-radius:6px;
			-moz-border-radius-bottomleft:6px;
			border-bottom-left-radius:6px;
			text-indent:-9999px;
			border:1px solid #fff;
			}
			
			#cimg18{background:url(https://image.mycard520.com/mycard/model/swclassify/images/18.png);}
			#cimg15{background:url(https://image.mycard520.com/mycard/model/swclassify/images/15.png);}
			#cimg12{background:url(https://image.mycard520.com/mycard/model/swclassify/images/12.png);}
			#cimg6{background:url(https://image.mycard520.com/mycard/model/swclassify/images/6.png);}
			#cimg0{background:url(https://image.mycard520.com/mycard/model/swclassify/images/0.png);}
.footer_iframe{
	width:100%;
	border-top:1px solid #49abe1;
	padding:15px 10px;
	background:url(../images/footer_bg.png);
	background-repeat:repeat-x;
	}
	.copyright{
		width:95%;
		max-width:1000px;
		margin:0 auto 10px ;
		padding:0 5px;
		}
	
	.c_img a{
		display:block;
		background:url(../images/footer_logo.png);
		width:95px;
		height:60px;
		text-indent:-9999px;
		float:left;}
		.c_info{
			}
		.c_info p{
			color:#999;
			font-size:75%;
			padding:3px 0;
			line-height:100%;
			}
			
			 .c_info p a{
				 color:#999;}
				 
				 .c_info p a:hover{
					 color:#49abe1;}
					 




@media screen and (max-width: 600px) {

	
.cfield{display:none;}	

	body {
		font-size: 15px;
	}
	.wrap {
		padding-top: 290px;
	}
	.logo {
		top: 15px;
		margin-left: -240px;
		width: 210px;
		height: 135px;
	}
	.people {
		top: 300px;
		margin-right: -255px;
		font-size: 40px;
		letter-spacing: 16.5px;
	}
	.h2 {
		display: block;
		margin: 0 auto;
		width: 92%;
		top:0px;

	}
	
	section:last-child {
		padding-bottom: 20px;
	}
	#event_1 .title img,
	#event_2 .title img {
		width: 100%;
	}
	.title span {
		margin: 0 auto 25px;
	}
	article p {
		margin-bottom: 20px;
		line-height: 21px;
	}
	.stepBox {
		margin-bottom: 30px;
	}
	.step_1,
	.step_2,
	.step_3 {
		padding-left: 105px;
		margin-left: 10px;
		margin-bottom: 5px;
	}
	.step_1_mark,
	.step_2_mark,
	.step_3_mark {
		left: -15px;
		width: 100px;
	}
	.step_1 {
		padding-top: 8px;
		height: 133px;
	}
	.step_1 .txt {
		margin-bottom: 5px;
		width: 95%;
	}
	.step_3 .tel {
		width: 230px;
	}
	.role_1,
	.role_2,
	.role_3 {
		display: none;
	}
	.inline {
		display: inline;
	}
	.btn {
		margin: 0 1% 7px;
		width: 40%;
		height: 50px;
		font-size: 20px;
		line-height: 45px;
	}
	.btn:before {
		background-position: center -45%;
	}
	#event_4 .title img {
		width: 63%;
	}
	table {
		margin-bottom: 20px;
	}
	th, td {
		padding: 5px 5px;
		font-size: 13px;
		line-height: 18px;
	}
	.pop iframe,
	.popBox_2,
	.popBox_3 {
		width: 90%;
		border-width: 10px;
	}
	
}

@media screen and (max-width: 800px) {
.mobile_wrapper_01 {display:inline;}
.notitle_01{display:none;}
.cfield{display:none;}
}


@media screen and (max-width: 900px) {



	body {
		background: url('fs-bg_cover_m.gif') top center repeat;
	}
	.wrap {
		padding-top:80%;
		background-image: url('fs-head_2m.jpg');
	}
	.logo {
		top: 10px;
		margin-left: -40%;
		width: 38%;
		height: 100px;
	}
	
	
	.people {
		right: 7.5%;
		width: 36%;
		text-align: center;
		margin-right: auto;
		font-size: 27px;
		letter-spacing: 5px;
	}
	.main {
		padding-top: 20px;
		border-width: 6px;
		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		border-radius: 15px;
		
	}
	h2, .h2_txt {
		font-size: 18px;

	}
	

	section {
		padding: 20px 0 20px;
	}
	.sizeBig {
		font-size: 21px;
	}
	article p {
		text-align: left;
		word-break: break-all;
		text-align: justify;
	}
	.title span {
		margin: 0 auto 15px;
	}
	.stepBox {
		margin-bottom: 20px;
		font-size: 15px;
	}
	.step_1,
	.step_2,
	.step_3 {
		padding-left: 24%;
		margin-left: 2%;
		margin-bottom: 4px;
		line-height: 26px;
		border-width: 3px;
		-webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		border-radius: 7px;
	}
	.step_1_mark,
	.step_2_mark,
	.step_3_mark {
		left: -4%;
		width: 25%;
	}
	.step_1_mark {
		top: -10%;
	}
	.step_3_mark {
		top: -16%;
	}
	.step_3_mark {
		top: -12%;
	}
	.step_1 {
		height: 140px;
	}
	.step_1 .txt {
		line-height: 20px;
	}
	#event_1 .fb-page {
		width: 95%;
		overflow: hidden;
	}
	.step_2 {
		padding-top: 12px;
		height: 85px;
	}
	.step_2 input {
		margin-right: 4px;
		-webkit-transform: scale(1.1, 1.1);
		-moz-transform: scale(1.1, 1.1);
		transform: scale(1.1, 1.1);
	}
	.step_2 b {
		margin-right: 10px;
		font-size: 19px;
	}
	.step_3 {
		padding-top: 6px;
		height: 85px;
	}
	.step_3 .country_number,
	.step_3 .tel,
	.share {
		padding: 0 10px;
		width: 95%;
		height: 30px;
		font-size: 15px;
	}
	.step_3 .country_number {
		padding: 0 5px;
	}
	.step_3 .tel,
	.share {
		padding: 0 10px;
	}
	#event_2 p:nth-child(3) {
		margin: 5px 0 15px;
	}
	.btn {
		width: 47%;
		height: 45px;
		font-size: 16px;
    	line-height: 44px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		border-radius: 6px;
	}
	.btn:before {
		background-position: center -36%;
	}
	.btn.btn_s {
		width: 92%;
		font-size: 15px;
		height: 46px;
		line-height: 43px;
	}
	.target img {
		margin: 0 0 3px 0;
		width: 100%;
	}
	#event_4 .title img {
		width: 45%;
	}
	.popBox {
		padding: 20px 15px;
	}
	.popBox p {
		font-size: 15px;
		line-height: 24px;
	}
	.popBox img {
		width: 75%;
	}
	.popBox_2 img {
		width: 90%;
	}
	.url_share span {
		font-size: 15px;
		padding: 3px 8px;
	}
	.share {
		padding: 0 8px;
		margin-top: 2px;
		width: 100%;
		height: 30px;
		font-size: 14px;
	}
	h1 {
		margin: 0px 0 15px;
		font-size: 24px;
	}
	ol li {
		font-size: 15px;
	}
	.btn_top {
		right: 10px;
		bottom: 60px;
	}
	

}

@media screen and (max-width: 375px) {
	.wrap {
		padding-top: 290px;
	}
	h2, .h2_txt {
		font-size: 17px;
	
	}
	
.mobile_wrapper {display:inline;}
.notitle{display:none;}

}

@media screen and (max-width: 360px) {
	.wrap {
		padding-top: 290px;
	}
	.people {
		font-size: 23px;
	}
	h2, .h2_txt {
		font-size: 16px;
				

	}
		
.cfield{display:none;}	


}

@media screen and (max-width: 320px) {
	.wrap {
		padding-top: 200px;
	}
	section#event_1 {
		padding-top: 0px;
	}
		
.cfield{display:none;}	


}

@media screen and (max-height: 480px) and (orientation: landscape) {
	.wrap {
		padding-top: 290px;
		background-image: url('fs-head_2m.jpg');
	}
	.people {
		right: 8%;
		margin-right: auto;
		width: 36%;
		font-size: 60px;
		letter-spacing: 10px;
		text-align: center;
	}
	.role_1,
	.role_2,
	.role_3 {
		display: none;
	}
	.step_1 .txt {
		width: 35%;
		line-height: 23px;
	}
	#event_1 .fb-page {
		width: 55%;
		overflow: hidden;
	}
	
.cfield{display:none;}
}

@media screen and (max-height: 375px) and (orientation: landscape) {
	.people {
		font-size: 54px;
		letter-spacing: 7px;
	}
}

@media screen and (max-height: 375px) and (orientation: landscape) {
	.step_1 .txt {
		line-height: 25px;
	}
}

@media screen and (max-height: 320px) and (orientation: landscape) {
	.people {
		font-size: 46px;
		letter-spacing: 7px;
	}
	.step_1 {
		height: 103px;
		padding-top: 13px;
	}
}

@media screen and (max-width: 480px) and (max-height: 320px) and (orientation: landscape) {
	.people {
		font-size: 40px;
	}
	.step_1 .txt {
		margin-right: 4px;
		width: 36%;
	}
	#event_1 .fb-page {
		width: 180px;
	}
	.step_1,
	.step_2,
	.step_3 {
		padding-left: 22.5%;
	}
	.step_3 {
		height: 85px;
	}
	.step_1_mark,
	.step_2_mark,
	.step_3_mark {
		width: 23%;
	}
	.step_2_mark {
		top: -23px;
	}
	.step_3_mark {
		top: -19px;
	}
}