@media (min-width: 1200px){

	.row3 h3{
		position: relative;
		top: 7rem;
		margin-top: 2rem !important;
	}


}




@media (max-width: 1199px){
	
	

	

	.row1 img[src="img/fire_new.gif"]{
		left: 31.2rem !important;
		top: 9.8rem!important;
		max-width: 150px !important;
	}

	.row1 img[src="img/fire_new2.gif"]{
		left: 3.7rem !important;
		top: 9.1rem!important;
		max-width: 150px !important;
	}

	.row4 img[src="img/outro_frame.png"]{
		bottom: -6rem !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all.png"] {
		width: 33.8rem !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/btn_char.png"] {
		width: 16.8rem !important;
		left: -0.3rem !important;
		margin:  0 !important;
	}

	.row3 #demo .carousel-inner .carousel-item p{
		font-size: 0.9rem;
	}

	.row3 #demo img[src="img/char_mask.png"] {
		bottom: -6rem !important;
	}

	.fire,
	.fire2{
		font-size: 0.6em !important;
	}

	.fire2 {
		left: 6rem !important;
		top: 9.2rem !important;
	}

	.fire{
		left: 33rem !important;
		top: 10.3rem !important;

	}

	.main_banner1 .site-heading .col-12{
		top: 23rem!important;
	}

	.main_banner1 .site-heading .col-12 img{
		width: 11rem !important;
	}
}

@media (min-width: 992px){
	.row2 .main_text .embed-responsive-4by3{
		display: none;
	}

	.row2 .main_text .embed-responsive-16by9{
		display: block;
	}
}



@media (max-width: 991px){

	#mainNav .navbar-brand img{
		max-width: 84px !important;
		margin-left: 1rem;
	}

	#mainNav .container{
		max-width: 100%;
	}

	#mainNav .navbar-nav .nav-item .nav-link{
		font-size: 0.7rem;
	}

	.navbar-nav{
		padding: 1rem;
		background: rgb(3,3,3,0.5);
	}

	.nav-item.social{
		justify-content: center;
		padding-top: 0.5rem;
	}

	.dropdown-menu {
		border-top: 0 !important;
	}


	

	

	.row1:before{
		left: -3.3rem;
		top: 1.5rem;
		width: 116%;
		height: 95%;
	}

	.row1 img {
		width: 119%;
		bottom: 0;
		left: -8%;
	}

	.row1 img[src="img/fire_new.gif"]{
		left: 25.2rem !important;
		top: 9.1rem!important;
		max-width: 125px !important;
	}

	.row1 img[src="img/fire_new2.gif"]{
		left: 1rem !important;
		top: 8.5rem!important;
		max-width: 125px !important;
	}

	.fire,
	.fire2{
		font-size: 0.5em !important;
	}

	.fire2 {
		left: 2.5rem !important;
		top: 8.5rem !important;
	}

	.fire{
		left: 26.5rem !important;
		top: 9.3rem !important;
	}

	.row2 .main_text img[src="img/intro2_shadow.png"],
	.row2_support .main_text img[src="img/intro2_shadow.png"],
	.row4 img[src="img/intro2_shadow.png"]{
		top: -1.1rem !important;
	}

	.row2 .main_text img[src="img/intro2_frame.png"],
	.row2_support .main_text img[src="img/intro2_frame.png"],
	.row4 img[src="img/intro2_frame.png"]{
		display: none;
	}

	.row2 .main_text img[src="img/intro2_frame_m.png"],
	.row2_support .main_text img[src="img/intro2_frame_m.png"],
	.row4 img[src="img/intro2_frame_m.png"]{
		display: block!important;
	}

	.row4 img[src="img/outro_frame.png"]{
		bottom: -4.3rem !important;
	}

	.row2 .main_text p{
		padding-top: 3rem;
		padding-left: 3rem;
		padding-right: 3rem;
		font-size: 0.9rem;
		padding-bottom: 0;
	}

	

	.row2_support .main_text p, 
	.row2_support .main_text label,
	.row2_support .main_text input,
	.row2_support .main_text ul,
	.row2_support .main_text textarea{
		font-size: 0.9rem;
	}

	.row2_support .main_text h4{
		font-size: 1.25rem;
		font-weight: bold;
	}

	.row2_support .main_text h5{
		font-size: 1.1rem;
	}

	.row2 .main_text .embed-responsive-4by3{
		display: block;
	}

	.row2 .main_text .embed-responsive-16by9{
		display: none;
	}

	.row3 h3{
		font-size: 1.75rem !important;
		margin-bottom: 0 !important;
		margin-top: 8rem !important;
		position: relative;
		bottom: 1rem;
		z-index: 6;

	}

	.row3 img[src="img/char_bg.jpg"]{
		display: none;
	}

	.row3 img[src="img/char_bg_m.jpg"]{
		display: block !important;

	}
	.row3 #demo {
		bottom: 2rem;
		width: 105%;
		left: -1rem;
	}

	.row3 #demo .carousel-inner .carousel-item p{
		font-size: 0.9rem;
		padding-left: 0;
		padding-right: 0;
	}

	.row3 #demo .carousel-inner .carousel-item h4{
		font-size: 1.3rem;
	}

	.row3 #demo .carousel-inner .carousel-item img {
		width: 105%;
		position: relative;
		left: -1rem;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/btn_char.png"] {
		width: 20.3rem !important;
		left: -0.3rem !important;
		margin:  0 !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all.png"] {
		display: none;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all_xm.png"] {
		display: block !important;
		width: 26.8rem !important;
	}

	.row3 #demo img[src="img/char_mask.png"]{
		bottom: -2rem !important;
		width: 100%;
	}

	.row3 #demo .carousel-control-prev {
		left: -4rem;
	}

	.row3 #demo .carousel-control-next {
		right: -4rem;
	}



	.row4_title{
		margin-top: 10rem !important;
		position: relative;
		padding:0;
		top: -4rem;
	}

	.row4_title h3{
		font-size: 1.75rem !important;
	}

	.row4, .row2_support {
		margin-top: -3.5rem;
	}

	.row4 .col-12{
		margin-top: 1rem !important;
	}

	.row4 .main_text1 h5, .row4 .main_text2 h5{
		font-size: 1.3rem !important;
	}



	.row4 .main_text1 p,
	.row4 .main_text2 p{
		font-size: 0.9rem;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-bottom: 1rem !important;
	}

	.row4 .main_text1 img,
	.row4 .main_text2 img{
		max-width: 100%;
		padding-top: 0 !important;

	}


	.main_banner1:before{
		height: 45rem !important;
	}

	.main_banner1 .site-heading{
		padding-top: 4rem;
	}

	.main_banner1 .site-heading img{
		left: -1rem !important;
		width: 110% !important;
	}

	.main_banner1 .site-heading .col-12{
		top: 21rem!important;
	}

	.main_banner1 .site-heading .col-12 img{
		width: 12rem !important;
	}

	


}

@media (max-width: 767px){
	footer .main_text6 .col-6{
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
}



@media (min-width: 576px) and (max-width: 767px){



	#mainNav .navbar-brand img{
		max-width: 84px !important;
		margin-left: 1rem;
	}

	#mainNav .container{
		max-width: 100%;
	}

	#mainNav .navbar-nav .nav-item .nav-link{
		font-size: 0.7rem;
	}

	.navbar-nav{
		padding: 1rem;
	}

	.nav-item.social{
		justify-content: center;
		padding-top: 0.5rem;
	}

	

	

	.row1:before{
		left: -2.6rem;
		top: 1.5rem;
		width: 115%;
		height: 95%;
	}

	.row1 img {
		width: 119%;
		bottom: 0;
		left: -8%;
	}

	.row1 img[src="img/fire_new.gif"]{
		left: 20.8rem !important;
		top: 7.1rem!important;
		max-width: 110px !important;
	}

	.row1 img[src="img/fire_new2.gif"]{
		left: 0.8rem !important;
		top: 6.6rem!important;
		max-width: 110px !important;
	}

	.fire,
	.fire2{
		font-size: 0.5em !important;
	}

	.fire2 {
		left: 2.5rem !important;
		top: 5.9rem !important;
	}

	.fire{
		left: 21.5rem !important;
		top: 6.5rem !important;
	}


	.row2 .main_text img[src="img/intro2_shadow.png"],
	.row2_support .main_text img[src="img/intro2_shadow.png"],
	.row4 img[src="img/intro2_shadow.png"]{
		top: -0.6rem !important;
	}

	.row2 .main_text img[src="img/intro2_frame.png"],
	.row2_support .main_text img[src="img/intro2_frame.png"],
	.row4 img[src="img/intro2_frame.png"]{
		display: none;
	}

	.row2 .main_text img[src="img/intro2_frame_m.png"],
	.row2_support .main_text img[src="img/intro2_frame_m.png"],
	.row4 img[src="img/intro2_frame_m.png"]{
		display: block!important;
	}

	.row4 img[src="img/outro_frame.png"]{
		bottom: -3.7rem !important;
	}

	.row2 .main_text p{
		padding-top: 3rem;
		padding-left: 3rem;
		padding-right: 3rem;
		font-size: 0.8rem;
		padding-bottom: 0;
	}

	

	.row2_support .main_text .inner_div{
		padding: 8rem 1rem !important;
	}


	.row3 h3{
		font-size: 1.5rem !important;
		margin-bottom: 1rem !important;
		margin-top: 6rem !important;
		position: relative;
		bottom: 1rem;
		z-index: 6;

	}

	.row3 img[src="img/char_bg.jpg"]{
		display: none;
	}

	.row3 img[src="img/char_bg_m.jpg"]{
		display: block !important;

	}
	.row3 #demo {
		bottom: 2rem;
		width: 100%;
		left: 0;
	}

	.row3 #demo .carousel-inner .carousel-item p{
		font-size: 0.8rem;
		padding-left: 0;
		padding-right: 0;
	}

	.row3 #demo .carousel-inner .carousel-item h4{
		font-size: 1rem;
	}

	.row3 #demo .carousel-inner .carousel-item img {
		width: 100%;
		position: relative;
		left: 0;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/btn_char.png"] {
		width: 16.7rem !important;
		left: -0.3rem !important;
		margin:  0 !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all_xm.png"] {
		width: 22.8rem !important;
		left: -0.5rem !important;
		top: -2rem;
	}

	.row3 #demo img[src="img/char_mask.png"]{
		bottom: -3rem !important;
		width: 100%;
	}

	.row3 #demo .carousel-control-prev {
		left: -2rem;
	}

	.row3 #demo .carousel-control-next {
		right: -2rem;
	}

	.row4_title{
		margin-top: 6rem !important;
		position: relative;
		top: -2rem;
	}

	.row4_title h3{
		font-size: 1.5rem !important;
	}

	.row4 {
		margin-top: -3.5rem;
	}

	.row4 .col-12{
		margin-top: 1rem !important;
	}

	.row4 .main_text1 h5, .row4 .main_text2 h5{
		font-size: 1rem !important;
	}



	.row4 .main_text1 p,
	.row4 .main_text2 p{
		font-size: 0.8rem;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-bottom: 1rem !important;
	}

	.row4 .main_text1 img,
	.row4 .main_text2 img{
		max-width: 100%;
		padding-top: 0 !important;

	}

	.row4 .main_text1.xm-pb-0{
		padding-bottom: 0 !important;
	}


	.main_banner1:before{
		height: 39rem !important;
	}

	.main_banner1 .site-heading{
		padding-top: 5rem;
	}

	.main_banner1 .site-heading img{
		left: -1rem !important;
		width: 110% !important;
	}

	.main_banner1 .site-heading .col-12{
		top: 20rem!important;
	}

	.main_banner1 .site-heading .col-12 img{
		width: 10rem !important;
	}

	


}

@media (min-width: 290px) and (max-width: 575px){

	.main_banner .site-heading .col-12{
		flex-wrap: wrap;
	}

	.main_banner .site-heading .col-12 img{
		width: 100%;
		margin-top: 0.5rem;
	}

	.main_banner .site-heading .col-12 a{
		width: 45%;
	}

	.site-heading {
		padding-left: 0;
		padding-right: 0;
	}

	.site-heading, .site-heading_support {
		padding-left: 0;
		padding-right: 0;
	}

	.col-xs-10 {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}

	.row2_support .main_text .inner_div{
		padding: 5rem 1rem !important;
	}

	.row2_support .main_text p, 
	.row2_support .main_text label,
	.row2_support .main_text ul,
	.row2_support .main_text input,
	.row2_support .main_text textarea{
		font-size: 0.8rem;
	}

	.row2_support .main_text h4{
		font-size: 1rem;
		font-weight: bold;
	}

	.row2_support .main_text h5{
		font-size: 0.9rem;
	}

	.row3 img[src="img/char_bg_m.jpg"] {
		display: none !important; 
	}



	.embed-responsive-4by3:before{
		padding-top: 83% !important;
	}

}




@media (min-width: 290px) and (max-width: 429px){





	.row2{
		top: 0;
	}

	.row2 .main_text p{
		padding: 2rem;
	}
	.row3 {
		top: -5rem;
	}

	.embed-responsive-4by3:before{
		padding-top: 111% !important;
	}


}




@media (min-width: 430px) and (max-width: 575px){

	#mainNav .navbar-brand img{
		max-width: 84px !important;
		margin-left: 1rem;
	}

	#mainNav .container{
		max-width: 100%;
	}

	#mainNav .navbar-nav .nav-item .nav-link{
		font-size: 0.7rem;
	}

	.navbar-nav{
		padding: 1rem;
	}

	.nav-item.social{
		justify-content: center;
		padding-top: 0.5rem;
	}

	

	.main_banner .site-heading img, .main_banner .site-heading_support img{
		padding: 0 !important;
	}




	.container{
		max-width: 400px;
	}


	


	.row1:before{
		left: -1.8rem;
		top: 1rem;
		width: 113%;
		height: 95%;
	}

	.row1 img {
		width: 119%;
		bottom: 0;
		left: -8%;
	}

	.row1 img[src="img/fire_new.gif"]{
		left: 18.2rem !important;
		top: 6rem!important;
		max-width: 100px !important;
	}

	.row1 img[src="img/fire_new2.gif"]{
		left: 0.8rem !important;
		top: 5.8rem!important;
		max-width: 100px !important;
	}

	.fire,
	.fire2{
		font-size: 0.4em !important;
	}

	.fire2 {
		left: 2rem !important;
		top: 5.5rem !important;
	}

	.fire{
		left: 19.5rem !important;
		top: 6.3rem !important;
	}

	.row2 .main_text img[src="img/intro2_shadow.png"],
	.row2_support .main_text img[src="img/intro2_shadow.png"],
	.row4 img[src="img/intro2_shadow.png"]{
		top: -0.6rem !important;
	}

	.row2 .main_text img[src="img/intro2_frame.png"],
	.row2_support .main_text img[src="img/intro2_frame.png"],
	.row4 img[src="img/intro2_frame.png"]{
		display: none;
	}

	.row2 .main_text img[src="img/intro2_frame_m.png"],
	.row2_support .main_text img[src="img/intro2_frame_m.png"],
	.row4 img[src="img/intro2_frame_m.png"]{
		display: block!important;
	}

	.row4 img[src="img/outro_frame.png"]{
		bottom: -3.3rem !important;
	}

	.row2 .main_text p{
		padding-top: 3rem;
		padding-left: 3rem;
		padding-right: 3rem;
		font-size: 0.8rem;
		padding-bottom: 0;
	}


	.row3 h3{
		font-size: 1.5rem !important;
		margin-bottom: 1rem !important;
		margin-top: 3rem !important;
		position: relative;
		bottom: -3rem;
		z-index: 6;
	}

	.row3 img[src="img/char_bg.jpg"]{
		display: none;
	}

	.row3 img[src="img/char_bg_sm.jpg"]{
		display: block !important;
		width: 146% !important;
		position: relative;
		left: -6rem;

	}
	.row3 #demo {
		bottom: 6rem;
		width: 146%;
		left: -5.6rem;
	}

	.row3 #demo .carousel-inner .carousel-item p{
		font-size: 0.8rem;
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.row3 #demo .carousel-inner .carousel-item h4{
		font-size: 1rem;
	}

	.row3 #demo .carousel-inner .carousel-item img {
		width: 110%;
		position: relative;
		left: 0;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/btn_char.png"] {
		width: 18rem !important;
		left: -0.3rem !important;
		margin: 2.3rem 0 !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all_xm.png"] {
		width: 100% !important;
		top: -2rem;
	}

	.row3 #demo img[src="img/char_mask.png"]{
		bottom: -2rem !important;
		width: 100%;
	}

	.row3 #demo .carousel-control-prev, 
	.row3 #demo .carousel-control-next{
		display: none;
	}

	.row3 #demo .carousel-indicators,
	#rina .carousel-indicators,
	#dankuma .carousel-indicators,
	#titus .carousel-indicators{
		display: flex !important;
	}

	.row3 #demo .carousel-indicators li,
	#rina .carousel-indicators li,
	#dankuma .carousel-indicators li,
	#titus .carousel-indicators li{
		width: 10px;
		height: 10px;
		border-radius: 19px;
		margin-right: 5px;
		margin-left: 5px; 
		border-top: 0; 
		border-bottom: 0;
	}

	.row4_title{
		margin-top: 5rem !important;
		position: relative;
		top: -2rem;
	}

	.row4_title h3{
		font-size: 1.5rem !important;
	}

	.row4 {
		margin-top: -3.5rem;
	}

	.row4 .col-12{
		margin-top: 1rem !important;
	}

	.row4 .main_text1 h5, .row4 .main_text2 h5{
		font-size: 1rem !important;
	}



	.row4 .main_text1 p,
	.row4 .main_text2 p{
		font-size: 0.8rem;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-bottom: 1rem !important;
	}

	.row4 .main_text1 img,
	.row4 .main_text2 img{
		max-width: 100%;
		padding-top: 0 !important;

	}

	.row4 .main_text1.xm-pb-0{
		padding-bottom: 0 !important;
	}

	.row4 .thumb_lg{
		display: none;
	}

	.row4 .thumb_xm{
		display: block;
	}

	.main_banner1:before{
		height: 38rem !important;
	}

	.main_banner1 .site-heading{
		padding-top: 5rem;
	}

	.main_banner1 .site-heading img{
		left: -5rem !important;
		width: 150% !important;
	}

	.main_banner1 .site-heading .col-12{
		top: 20rem!important;
	}

	.main_banner1 .site-heading .col-12 img{
		width: 10rem !important;
	}

	

}




@media (min-width: 370px) and (max-width: 430px){

	#mainNav .navbar-brand img{
		max-width: 84px !important;
		margin-left: 1rem;
	}

	#mainNav .container{
		max-width: 100%;
	}

	#mainNav .navbar-nav .nav-item .nav-link{
		font-size: 0.7rem;
	}

	.navbar-nav{
		padding: 1rem;
	}

	.nav-item.social{
		justify-content: center;
		padding-top: 0.5rem;
	}


	.container{
		max-width: 360px;
	}

	


	


	.row1:before{
		left: -1.8rem;
		top: 1rem;
		width: 113%;
		height: 95%;
	}

	.row1 img {
		width: 119%;
		bottom: 0;
		left: -8%;
	}

	.row1 img[src="img/fire_new.gif"]{
		left: 16rem !important;
		top: 5rem!important;
		max-width: 95px !important;
	}

	.row1 img[src="img/fire_new2.gif"]{
		left: 0.8rem !important;
		top: 4.8rem!important;
		max-width: 95px !important;
	}

	.fire,
	.fire2{
		font-size: 0.4em !important;
	}

	.fire2 {
		left: 2rem !important;
		top: 4.5rem !important;
	}

	.fire{
		left: 17.2rem !important;
		top: 4.8rem !important;
	}


	.row2 .main_text img[src="img/intro2_shadow.png"],
	.row2_support .main_text img[src="img/intro2_shadow.png"],
	.row4 img[src="img/intro2_shadow.png"]{
		top: -0.6rem !important;
	}

	.row2 .main_text img[src="img/intro2_frame.png"],
	.row2_support .main_text img[src="img/intro2_frame.png"],
	.row4 img[src="img/intro2_frame.png"]{
		display: none;
	}

	.row2 .main_text img[src="img/intro2_frame_m.png"],
	.row2_support .main_text img[src="img/intro2_frame_m.png"],
	.row4 img[src="img/intro2_frame_m.png"]{
		display: block!important;
	}

	.row4 img[src="img/outro_frame.png"]{
		bottom: -3rem !important;
	}

	.row2 .main_text p{
		padding-top: 2rem;
		font-size: 0.8rem;
		padding-bottom: 0;
	}



	.row3 h3{
		font-size: 1.5rem !important;
		margin-bottom: 1rem !important;
		margin-top: 9rem !important;
		position: relative;
		bottom: -3rem;
		z-index: 6;
	}

	.row3 img[src="img/char_bg.jpg"]{
		display: none;
	}

	.row3 img[src="img/char_bg_sm.jpg"]{
		display: block !important;
		width: 160% !important;
		position: relative;
		left: -6rem;

	}
	.row3 #demo {
		bottom: 6rem;
		width: 119%;
		left: -2rem;
		top: 16rem;
	}

	.row3 #demo .carousel-inner .carousel-item p{
		font-size: 0.8rem;
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}

	.row3 #demo .carousel-inner .carousel-item h4{
		font-size: 1rem;
	}

	.row3 #demo .carousel-inner .carousel-item img {
		width: 136%;
		position: relative;
		left: -3rem;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/btn_char.png"] {
		width: 17.5rem !important;
		left: 0 !important;
		margin:2rem 0 !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all_xm.png"] {
		top: -1rem;
		left: -2rem !important;
		width: 24.5rem !important;
	}

	.row3 #demo img[src="img/char_mask.png"]{
		bottom: -1rem !important;
		width: 100%;
	}

	.row3 #demo .carousel-control-prev, 
	.row3 #demo .carousel-control-next{
		display: none;
	}

	.row3 #demo .carousel-indicators{
		display: flex !important;
	}

	.row3 #demo .carousel-indicators li{
		width: 10px;
		height: 10px;
		border-radius: 19px;
		margin-right: 5px;
		margin-left: 5px; 
		border-top: 0; 
		border-bottom: 0;
	}

	.row4_title{
		margin-top: 0rem !important;
		position: relative;
		top: -2rem;
	}

	.row4_title h3{
		font-size: 1.5rem !important;
	}

	.row4 {
		margin-top: -3.5rem;
	}

	.row4 .col-12{
		margin-top: 1rem !important;
	}

	.row4 .main_text1 h5, .row4 .main_text2 h5{
		font-size: 1rem !important;
	}



	.row4 .main_text1 p,
	.row4 .main_text2 p{
		font-size: 0.8rem;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-bottom: 1rem !important;
	}

	.row4 .main_text1 img,
	.row4 .main_text2 img{
		max-width: 100%;
		padding-top: 0 !important;

	}

	.row4 .main_text1.xm-pb-0{
		padding-bottom: 0 !important;
	}

	.row4 .thumb_lg{
		display: none;
	}

	.row4 .thumb_xm{
		display: block;
	}


	.main_banner1:before{
		height: 34rem !important;
	}

	.main_banner1 .site-heading{
		padding-top: 5rem;
	}

	.main_banner1 .site-heading img{
		left: -4.5rem !important;
		width: 150% !important;
	}

	.main_banner1 .site-heading .col-12{
		top: 18rem!important;
	}

	.main_banner1 .site-heading .col-12 img{
		width: 10rem !important;
	}

	


}



@media (min-width: 290px) and (max-width: 370px){

	body{
		overflow: hidden !important;
	}

	#mainNav .navbar-brand img{
		max-width: 70px !important;
		margin-left: 1rem;
	}

	#mainNav .container{
		max-width: 100%;
	}

	#mainNav .navbar-nav .nav-item .nav-link{
		font-size: 0.7rem;
	}

	.navbar-nav{
		padding: 1rem;
	}

	.nav-item.social{
		justify-content: center;
		padding-top: 0.5rem;
	}

	.container{
		max-width: 290px;
	}

	

	


	.row1:before{
		left: -1.4rem;
		top: 0.8rem;
		width: 113%;
		height: 95%;
	}

	.row1 img {
		width: 119%;
		bottom: 0;
		left: -8%;
	}

	.row1 img[src="img/fire_new.gif"]{
		left: 12.8rem !important;
		top: 3.7rem!important;
		max-width: 80px !important;
	}

	.row1 img[src="img/fire_new2.gif"]{
		left: 0.8rem !important;
		top: 3.7rem!important;
		max-width: 80px !important;
	}

	.fire,
	.fire2{
		font-size: 0.3em !important;
	}

	.fire2 {
		left: 2rem !important;
		top: 3.9rem !important;
	}

	.fire{
		left: 13.8rem !important;
		top: 4.5rem !important;
	}



	.row2 .main_text img[src="img/intro2_shadow.png"],
	.row2_support .main_text img[src="img/intro2_shadow.png"],
	.row4 img[src="img/intro2_shadow.png"]{
		top: -0.6rem !important;
	}

	.row2 .main_text img[src="img/intro2_frame.png"],
	.row2_support .main_text img[src="img/intro2_frame.png"],
	.row4 img[src="img/intro2_frame.png"]{
		display: none;
	}

	.row2 .main_text img[src="img/intro2_frame_m.png"],
	.row2_support .main_text img[src="img/intro2_frame_m.png"],
	.row4 img[src="img/intro2_frame_m.png"]{
		display: block!important;
	}

	.row4 img[src="img/outro_frame.png"]{
		bottom: -2.3rem !important;
	}

	.row2 .main_text p{
		padding-top: 2rem;
		font-size: 0.7rem;
		padding-bottom: 0;
	}




	.row3 h3{
		font-size: 1rem !important;
		margin-bottom: 1rem !important;
		margin-top: 9rem !important;
		position: relative;
		bottom: -3rem;
		z-index: 6;
	}

	.row3 img[src="img/char_bg.jpg"]{
		display: none;
	}

	.row3 img[src="img/char_bg_xm.jpg"]{
		display: block !important;
		width: 130% !important;
		position: relative;
		left: -3rem;
	}
	.row3 #demo {
		bottom: 6rem;
		width: 126%;
		left: -2.5rem;
		top: 12rem;
	}

	.row3 #demo .carousel-inner .carousel-item p{
		font-size: 0.7rem;
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}

	.row3 #demo .carousel-inner .carousel-item h4{
		font-size: 0.9rem;
	}

	.row3 #demo .carousel-inner .carousel-item img {
		width: 151%;
		position: relative;
		left: -5rem;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/btn_char.png"] {
		width: 17.5rem !important;
		left: 0 !important;
		margin:1.5rem 0 !important;
	}

	.row3 #demo .carousel-inner .carousel-item img[src="img/hero_all_xm.png"] {
		top: -1rem;
		left: -2rem !important;
		width: 21.5rem !important;
	}

	.row3 #demo img[src="img/char_mask.png"]{
		bottom: -1rem !important;
		width: 100%;
	}

	.row3 #demo .carousel-control-prev, 
	.row3 #demo .carousel-control-next{
		display: none;
	}

	.row3 #demo .carousel-indicators{
		display: flex !important;
	}

	.row3 #demo .carousel-indicators li{
		width: 10px;
		height: 10px;
		border-radius: 19px;
		margin-right: 5px;
		margin-left: 5px; 
		border-top: 0; 
		border-bottom: 0;
	}

	.row4_title{
		margin-top: 0rem !important;
		position: relative;
		top: -2rem;
	}

	.row4_title h3{
		font-size: 1rem !important;
	}

	.row4 {
		margin-top: -3.5rem;
	}

	.row4 .col-12{
		margin-top: 0rem !important;
	}

	.row4 .main_text1 h5, .row4 .main_text2 h5{
		font-size: 0.9rem !important;
	}



	.row4 .main_text1 p,
	.row4 .main_text2 p{
		font-size: 0.7rem;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-bottom: 1rem !important;
	}

	.row4 .main_text1 img,
	.row4 .main_text2 img{
		max-width: 100%;
		padding-top: 0 !important;

	}

	.row4 .main_text1.xm-pb-0{
		padding-bottom: 0 !important;
	}

	.row4 .thumb_lg{
		display: none;
	}

	.row4 .thumb_xm{
		display: block;
	}

	footer .main_text6 p{
		font-size: 0.8rem;
	}

	.row4 .main_text5 .col-12 a{
		width: 55%;
	}

	#video1:before{
		margin-top: 0.2rem;
		border-radius: 5px;

	}


	.main_banner1:before{
		height: 29rem !important;
	}

	.main_banner1 .site-heading{
		padding-top: 4rem;
	}

	.main_banner1 .site-heading img{
		left: -3.5rem !important;
		width: 150% !important;
	}

	.main_banner1 .site-heading .col-12{
		top: 13.5rem!important;
	}

	.main_banner1 .site-heading .col-12 img{
		width: 10rem !important;
	}


	



}


/*new*/


@media (max-width: 1199px){
	.main_banner{
		margin-bottom: 18rem;
	}

	.site-heading,
	.site-heading_support{
		padding-right: 0;
		padding-left: 0 ;
	}


	.page-section {
		margin-top: 26rem !important;
	}

	.page-section img[src="img/spark1.png"]{
		top: 34rem !important;
	}

	.row0 p{
		font-size: 1.3rem !important;
	}

	.row0 p:first-letter{
		line-height: 5.5rem !important;
	}

	.main_banner2_1st  img[src="img/btn_play.png"]{
		max-width: 129px !important;
	}

	.main_banner2_1st  img[src="img/divider1.png"]{
		left: -2.5rem !important;
		bottom: 2rem !important;
	}

	.main_banner2_1st  video,
	.main_banner2_1st  .overlay1{
		top: 92rem !important;
	}

	.main_banner2_2nd  img[src="img/divider2.png"]{
		left: -15rem !important;
	}

	.main_banner2_3rd{
		height: 34rem !important;
	}

	.main_banner2_3rd:before{
		top: 170rem !important;
	}

	.main_banner2_3rd .carousel-item .details{
		padding-top: 0 !important;
	}

	.main_banner2_3rd .carousel-control-prev,
	.main_banner2_3rd .carousel-control-next{
		display: block !important;
		top: 190rem !important;
	}
	.main_banner2_3rd .carousel-control-prev{
		left: 1rem !important;
		text-align: left;
	}

	.main_banner2_3rd .carousel-control-next{
		right: 1rem !important;
		text-align: right;
	}

	.main_banner2_3rd .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_3rd .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 60% !important;
	}

	.main_banner2_5th:before{
		top: 225rem !important;
	}






	.main_banner2.main_banner2_1st.characters.changelog{  
		padding: 9rem 0 !important; 
		padding-bottom: 11rem !important;
		margin-bottom: -15rem !important;
	}
	.main_banner2_1st.characters.changelog:before{
		height: 56rem;
	}

	.main_banner2_1st.characters.changelog .thumb img{
		margin-bottom: 0;
		width: 150%;
		z-index: 0;
	}

	.main_banner2_1st.characters.changelog h2{
		font-size: 1.2rem;
	}

	.main_banner2_1st.characters.changelog .thumb h2{
		font-size: 1.7rem;
		top: 73%;
	}

	.main_banner2_1st.characters.changelog .view{
		font-size: 1rem;
		padding: 0.4rem 2rem;
	}

	.main_banner2_1st.characters.changelog .date{
		font-size: 1rem;
		padding: 0.4rem 2rem;
	}




	.main_banner2.main_banner2_1st.characters.heroes.making_details.patch_details.tnc .row2_support{
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes.making_details.patch_details.tnc .row2_support h5{
		margin-left: 0 !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes.making_details.patch_details.tnc .row2_support p{
		text-align: left !important;
	}

}

@media (max-width: 991px){
	.site-heading {
		padding-top: 8rem;
	}

	.main_banner:before{
		height: 50rem;
	}

	.main_banner{
		margin-bottom: 17em;
	}

	.main_banner .site-heading .col-12 {
		padding: 0;
	}

	.site-heading,
	.site-heading_support {
		padding-left: 0;
		padding-right: 0;
	}



	.page-section {
		margin-top: 0!important;
		margin-bottom: 0;
	}


	.page-section:before{
		top: 24rem;
		width: 100%;
		height: 49rem;
	}

	.page-section img[src="img/spark1.png"]{
		top: 28rem !important;
		width: 74% !important;
	}

	.page-section img[src="img/logo1.png"]{
		max-width: 44% !important;
	}

	.row0 p{
		padding-top: 3rem !important;
		font-size: 1rem !important;
	}

	.row0 p:first-letter{
		font-size: 6rem !important;
		line-height: 4.3rem !important;
	}

	.main_banner2{
		margin-bottom: 7.5rem;
		margin-top: 2rem !important;
	}

	.main_banner2 .container{
		padding-top:3rem !important; 
	}

	.main_banner2:before{
		height: 24rem;
	}

	.main_banner2 .container .col-md-6{
		padding-right: 0 !important;
		padding-top: 0 !important;
	}

	.main_banner2_1st  img[src="img/divider1.png"]{
		left: -3.5rem !important;
		bottom: 2rem !important;
		max-width: 150% !important;
		width: 110% !important;
	}

	.main_banner2_1st  h5{
		margin-left: -1rem;
	}

	.main_banner2_1st  video,
	.main_banner2_1st  .overlay1{
		top: 73rem !important;
	}


	.main_banner2_2nd{
		height: 36.5rem!important;
	}

	.main_banner2_2nd:before{
		height: 44rem;
		top: 104rem;
	}

	.main_banner2_2nd .container .pb-5{
		padding-bottom:0!important;
	}

	.main_banner2_2nd h2{
		margin-bottom:1rem !important;
	}

	.main_banner2_2nd  img[src="img/divider2.png"]{
		left: -22.5rem !important;
		bottom:-40.5rem !important;
	}

	.main_banner2_3rd{
		height: 34rem !important;
	}

	.main_banner2_3rd .container{
		padding-top: 4rem !important;
	}

	.main_banner2_3rd:before{
		top: 141rem !important;
		height: 32rem !important;
	}

	.main_banner2_3rd .carousel-item img{
		width: 120% !important;
		position: relative;
		left: -1rem;
	}

	.main_banner2_3rd .carousel-item .details{
		padding-top: 0 !important;
		margin-top: 1rem !important;
	}

	.main_banner2_3rd .carousel-item .details h5{
		margin-bottom: 1rem !important;
		padding-top: 1rem !important;
	}

	.main_banner2_3rd .carousel-item .details p{
		font-size: 0.9rem !important;
	}

	.main_banner2_3rd .carousel-control-prev,
	.main_banner2_3rd .carousel-control-next{
		display: block !important;
		top: 155rem !important;
	}
	.main_banner2_3rd .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_3rd .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 60% !important;
	}
	

	.main_banner2_4th{
		margin-top: -30rem !important;
		height: 36rem !important;
	}

	.main_banner2_4th .slider_content, 
	.main_banner2_4th .slider_content1, 
	.main_banner2_4th .slider_content2{
		
		padding-bottom: 0rem;
		height: 32rem;
	}

	.main_banner2_4th .slider_content:before, 
	.main_banner2_4th .slider_content1:before, 
	.main_banner2_4th .slider_content2:before{
		top: -1rem;
		height: 34rem ;
	}

	.main_banner2_5th p{
		margin-bottom:1rem !important;
	}

	.main_banner2_5th:before {
		top: 190rem !important;
		height: 42rem !important;
	}

	.footer{
		height: 31rem !important;
	}

	footer .main_text6{
		margin-top: 0rem;
		margin-bottom: 4rem;
	}

	.footer:before{
		height: 39rem !important;
	}





	.main_banner.characters{
		padding: 0rem 0 !important;
		padding-bottom: 4rem !important;
		margin-top: -2rem !important;
		margin-bottom: -8rem !important;
	}
	.main_banner.characters .site-heading h2{
		font-size: 1.5rem !important
	}


	.main_banner2_1st.characters {
		margin-top: -6rem !important;
		margin-bottom: -6rem !important;
	}
	.main_banner2_1st.characters:before{
		height: 59rem;
	}
	.main_banner2_1st.characters h2{
		font-size: 1.8rem;
	}





	.main_banner2_1st.characters.themaking:before{
		height: 75rem;
	}
	.main_banner2_1st.characters.themaking h2{
		font-size: 1rem;
	}





	.row2_support .main_text {
		padding: 3rem 2rem;
	}






	.main_banner2.main_banner2_1st.characters.changelog{  
		padding: 7rem 0 !important; 
		padding-bottom: 11rem !important;
		margin-bottom: -7rem !important;
	}
	.main_banner2_1st.characters.changelog:before{
		height: 48rem;
	}
	.main_banner2_1st.characters.changelog .thumb img{
		margin-bottom: 0;
		width: 170%;
		z-index: 0;
	}

	.main_banner2_1st.characters.changelog h2{
		font-size: 1.2rem;
	}

	.main_banner2_1st.characters.changelog .thumb h2{
		font-size: 1.4rem;
		top: 77%;
	}

	.main_banner2_1st.characters.changelog .view{
		font-size: 1rem;
		padding: 0.4rem 2rem;
	}

	.main_banner2_1st.characters.changelog .date{
		font-size: 1rem;
		padding: 0.4rem 2rem;
	}





	.main_banner2.main_banner2_1st.characters.heroes{
		margin-top: -23rem !important;
		padding-bottom: 16rem; 
		position: relative;
		margin-bottom: -15rem !important;
	}








	.main_banner.characters.heroes.making_details{
		padding-bottom: 3rem !important;
		margin-bottom: -9rem !important;
	}
	.main_banner.characters.heroes.making_details h2{
		margin-top: 2rem !important;
	}





	.main_banner2.main_banner2_1st.characters.heroes.making_details.patch_details{
		padding-top: 7rem;
	}


}


@media (min-width: 576px) and (max-width: 767px){
	.site-heading {
		padding-top: 6.5rem;
		padding-left: 0;
		padding-right: 0;
	}

	.main_banner:before{
		height: 39rem;
	}

	.main_banner{
		margin-bottom: 14rem;
	}

	.main_banner .site-heading .col-12 {
		padding: 0;
	}

	.main_banner h4{
		font-size: 1rem !important;
	}

	.main_banner h2{
		font-size: 1.5rem !important;
		margin-top: 3rem !important;
	}

	.main_banner a{
		width: 33%;
	}

	.page-section:before {
		top: 24rem;
		width: 100%;
		height: 39rem;
	}
	.page-section img[src="img/logo1.png"] {
		max-width: 48% !important;
	}

	.row0 p{
		padding-top: 3rem !important;
		font-size: 0.9rem !important;
	}

	.row0 p:first-letter{
		font-size: 6rem !important;
		line-height: 4.7rem !important;
	}

	.main_banner2{
		margin-bottom: 6.5rem;
		margin-top: -1rem !important;
	}

	.main_banner2 .container{
		padding-top:3rem !important; 
	}

	.main_banner2:before{
		height: 20rem;
		background-position-x: 0%;
	}

	.main_banner2 .container .col-md-6{
		-ms-flex: 0 0 70%;
		flex: 0 0 70%;
		max-width: 70%;
	}

	.main_banner2 .container .col-md-6 h5{
		font-size: 1rem;
	}

	.main_banner2 .container .col-md-6 p{
		font-size: 0.8rem;
	}

	.main_banner2_1st img[src="img/btn_play.png"] {
		max-width: 100% !important;
		width: 100% !important;
	}

	.main_banner2_1st  img[src="img/divider1.png"]{
		left: -1.5rem !important;
		width: 100% !important;
	}

	.main_banner2_1st  h5{
		margin-left: 1rem;
		padding-top: 0.5rem !important;
	}

	.main_banner2_1st  video,
	.main_banner2_1st  .overlay1{
		top: 63rem !important;
	}

	.main_banner2_2nd{
		height: 55.5rem !important;
	}

	.main_banner2_2nd:before{
		height: 60rem;
		top: 97rem;
		background: url(../img/row2_bg_md.png) no-repeat center center;
		background-size: cover !important;
	}

	.main_banner2_2nd .container .pb-5{
		padding-bottom:0!important;
	}

	.main_banner2_2nd h2{
		margin-bottom:1rem !important;
	}

	.main_banner2_2nd  img[src="img/divider2.png"]{
		left: -28.5rem !important;
	}

	.main_banner2_3rd{
		height: 34rem !important;
	}

	.main_banner2_3rd .container{
		padding-top: 5rem !important;
	}

	.main_banner2_3rd:before{
		top: 144rem  !important;
		height: 59rem !important;
		background: url(../img/row3_bg_md.png) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.main_banner2_3rd .carousel-item .main_item{
		flex-direction: column;
	}

	.main_banner2_3rd .carousel-item img{
		width: 100% !important;
		position: relative;
		left: 0;
		margin-top: -1rem;
	}

	.main_banner2_3rd .carousel-item .image{
		order: 2;
	}

	.main_banner2_3rd .carousel-inner .carousel-item .image img{
		width: 131% !important;
		position: relative;
		margin-top: 2rem;
	}

	.main_banner2_3rd .carousel-item .details{
		padding-top: 0 !important;
		margin-top: 1rem !important;
		order: 1;
	}

	.main_banner2_3rd .carousel-item .details h5{
		margin-bottom: 1rem !important;
		font-size: 1.1rem !important;
	}

	.main_banner2_3rd .carousel-item .details p{
		font-size: 0.9rem;
		padding-right: 0 !important;
	}

	.main_banner2_3rd .carousel-control-prev,
	.main_banner2_3rd .carousel-control-next{
		display: block !important;
		top: 175rem !important;
	}
	.main_banner2_3rd .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_3rd .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}

	.main_banner2_4th{
		margin-top: -11rem !important;
		height: 41rem !important;
	}

	.main_banner2_4th .slider_content, 
	.main_banner2_4th .slider_content1, 
	.main_banner2_4th .slider_content2{
		padding: 3rem;
		padding-bottom: 0rem;
		height: 30rem;
	}

	.main_banner2_4th .slider_content:before, 
	.main_banner2_4th .slider_content1:before, 
	.main_banner2_4th .slider_content2:before{
		top: 1rem;
		height: 32rem !important;
	}

	.main_banner2_4th .carousel-item h2{
		font-size: 1.2rem !important;
	}

	.main_banner2_4th .carousel-item p{
		font-size: 0.9rem !important;

	}

	.main_banner2_4th .carousel-control-prev,
	.main_banner2_4th .carousel-control-next{
		display: block !important;
		top: 207rem !important;
	}
	.main_banner2_4th .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_4th .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_4th .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_4th .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 80% !important;
	}

	.main_banner2_5th{
		padding-top: 2rem;
	}

	.main_banner2_5th p{
		margin-bottom:1rem !important;
	}

	.main_banner2_5th:before {
		top: 221rem !important;
		background-position: 98%;
		height: 39rem !important;
	}


	.footer:before {
		height: 36rem !important;
	}





	.main_banner.characters{
		padding: 0rem 0 !important;
		padding-bottom: 2rem !important;
		margin-top: -2rem !important;
		margin-bottom: -5rem !important;
	}
	.main_banner.characters .site-heading h2{
		font-size: 1.1rem !important
	}
	.main_banner.characters:before{
		height: 16rem;
	}

	.main_banner2_1st.characters {
		margin-top: -6rem !important;
		margin-bottom: -8rem !important;
	}
	.main_banner2_1st.characters:before {
		height: 50rem;
	}
	.main_banner2_1st.characters h2{
		font-size: 1.5rem;
	}



	.main_banner2_1st.characters.themaking:before{
		height: 64rem;
	}
	.main_banner2_1st.characters.themaking h2,
	.main_banner2_1st.characters.themaking p{
		font-size: 0.9rem;
	}





	.main_banner2.main_banner2_1st.characters.changelog{  
		padding: 4rem 0 !important; 
		padding-bottom: 11rem !important;
		margin-bottom: -11rem !important;
	}
	.main_banner2_1st.characters.changelog:before{
		height: 39rem;
	}

	.main_banner2_1st.characters.changelog .thumb img{
		margin-bottom: 0;
		width: 213%;
		z-index: 0;
		left: -2rem;
	}

	.main_banner2_1st.characters.changelog .spacing{
		display: block !important;
	}

	.main_banner2_1st.characters.changelog h2{
		font-size: 1rem;
	}

	.main_banner2_1st.characters.changelog .thumb h2{
		font-size: 1.2rem;
		top: 60%;
	}

	.main_banner2_1st.characters.changelog .view,
	.main_banner2_1st.characters.changelog .date{
		font-size: 0.8rem;
		padding: 0.2rem 2rem;
	}







	.main_banner.characters.heroes{
		padding-bottom: 25rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes{
		margin-top: -21rem !important;
		padding-bottom: 16rem; 
		position: relative;
		margin-bottom: -15rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes h2{
		font-size: 1.5rem !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes p{
		font-size: 0.9rem !important;
	}







	.main_banner.characters.heroes.making_details h2{
		font-size: 1.2rem !important;
	}
	.main_banner.characters.heroes.making_details p{
		font-size: 0.9rem !important;
	}


	.main_banner2.main_banner2_1st.characters.heroes.making_details h2{
		font-size: 1rem !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}


}

@media (min-width: 430px) and (max-width: 575px){
	.main_banner{
		margin-bottom: 12rem;
	}

	.main_banner:before{

		height: 48rem;
		top: -5rem !important;
	}

	.main_banner h4{
		font-size: 1rem !important;
	}

	.main_banner h2{
		font-size: 1.5rem !important;
		margin-bottom: 1rem !important;
		margin-top: 1rem !important;
	}

	.main_banner .site-heading .col-12 a{
		width: 40%;
		margin-right: 1rem;
	}

	.site-heading{
		padding-top: 14rem;
	}

	.page-section:before {
		top: 24rem;
		width: 100%;
		height: 45rem;
	}

	.page-section img[src="img/logo1.png"] {
		max-width: 62% !important;
		padding-bottom: 2rem;
	}

	.row0 p{
		padding-top: 0!important;
		font-size: 0.9rem !important;
	}

	.row0 p:first-letter{
		font-size: 6rem !important;
		line-height: 4.7rem !important;
	}

	.main_banner2{
		margin-bottom: 5rem;
		margin-top: 0rem !important;
	}

	.main_banner2 .container{
		padding-top:3rem !important; 
	}

	.main_banner2:before{
		height: 20rem;
		background-position-x: 0%;
	}

	.main_banner2 .container .col-md-6{
		-ms-flex: 0 0 80%;
		flex: 0 0 80%;
		max-width: 80%;
	}

	.main_banner2 .container .col-md-6 h5{
		font-size: 1rem;
	}

	.main_banner2 .container .col-md-6 p{
		font-size: 0.8rem;
	}

	.main_banner2_1st img[src="img/btn_play.png"] {
		max-width: 100% !important;
		width: 100% !important;
	}

	.main_banner2_1st  img[src="img/divider1.png"]{
		left: -1rem !important;
		width: 100% !important;
		bottom: 1.9rem !important;
	}

	.main_banner2_1st  h5{
		margin-left: 1rem;
		padding-top: 0.9rem !important;
		font-size: 1.2rem;
	}

	.main_banner2_1st  p{
		font-size: 0.9rem;
	}

	.main_banner2_1st  video,
	.main_banner2_1st  .overlay1{
		top: 69rem !important;
	}

	.main_banner2_2nd{
		height: 39rem !important;
	}

	.main_banner2_2nd:before{
		height: 44rem;
		top: 103rem;
		background: url(../img/row2_bg_md.png) no-repeat center center;
		background-size: cover !important;
	}

	.main_banner2_2nd .container .pb-5{
		padding-bottom:0!important;
	}

	.main_banner2_2nd h2{
		margin-bottom:1rem !important;
	}

	.main_banner2_2nd  img[src="img/divider2.png"]{
		left: -32.5rem !important;
	}

	.main_banner2_3rd{
		height: 37rem !important;
	}

	.main_banner2_3rd .container{
		padding-top: 5rem !important;
	}

	.main_banner2_3rd:before{
		top: 142rem !important;
		height: 41rem !important;
		background: url(../img/row3_bg_md.png) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.main_banner2_3rd .carousel-item .main_item{
		flex-direction: column;
	}

	.main_banner2_3rd .carousel-item img{
		width: 100% !important;
		position: relative;
		left: 0;
		margin-top: 0;
	}

	.main_banner2_3rd .carousel-item .image{
		order: 2;
	}

	.main_banner2_3rd .carousel-item .details{
		padding: 0!important;
		margin-top: 1rem !important;
		order: 1;
	}

	.main_banner2_3rd .carousel-item .details h5{
		margin-bottom: 1rem !important;
		font-size: 1.1rem !important;
		padding-top: 0 !important;
	}

	.main_banner2_3rd .carousel-item .details p{
		font-size: 0.9rem;
		padding-right: 0 !important;
	}

	.main_banner2_3rd .carousel-control-prev,
	.main_banner2_3rd .carousel-control-next{
		display: block !important;
		top: 163rem !important;
	}
	.main_banner2_3rd .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_3rd .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}

	.main_banner2_4th{
		margin-top: -21rem !important;
		height: 44rem !important;
	}

	.main_banner2_4th .slider_content, 
	.main_banner2_4th .slider_content1, 
	.main_banner2_4th .slider_content2{
		padding: 3rem 2rem;
		height: 34rem;
	}

	.main_banner2_4th .slider_content:before, 
	.main_banner2_4th .slider_content1:before, 
	.main_banner2_4th .slider_content2:before{
		top: 2rem ;
		height: 28rem ;
	}

	.main_banner2_4th .carousel-item h2{
		font-size: 1.2rem !important;
	}

	.main_banner2_4th .carousel-item p{
		font-size: 0.9rem !important;
	}

	.main_banner2_4th .carousel-control-prev,
	.main_banner2_4th .carousel-control-next{
		display: block !important;
		top: 190rem !important;
	}
	.main_banner2_4th .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_4th .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_4th .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_4th .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}


	.main_banner2_5th{
		padding-top: 0rem;
		margin-top: -3rem !important;
	}

	.main_banner2_5th h2{
		font-size: 1.2rem !important;
	}

	.main_banner2_5th p{
		font-size: 0.9rem !important;
		margin-bottom:1rem !important;
	}

	.main_banner2_5th img[src="img/behind_scene.png"]{
		max-width: 150px !important;
	}

	.main_banner2_5th:before {
		top: 204rem !important;
		background-position: 73%;
		height: 32rem !important;
	}
	.footer p{
		font-size: 0.9rem;
	}

	.footer:before {
		height: 35rem !important;
	}






	.main_banner.characters{
		padding: 0rem 0 !important;
		padding-bottom: 3rem !important;
		margin-top: 0rem !important;
		margin-bottom: -6rem !important;
	}
	.main_banner.characters .site-heading h2{
		font-size: 1.1rem !important
	}
	.main_banner2_1st.characters {
		margin-top: -6rem !important;
		margin-bottom: -9rem !important;
	}

	.main_banner2_1st.characters:before{
		height: 135rem;
	}

	.main_banner2_1st.characters h2{
		font-size: 1.5rem;
	}






	.main_banner2_1st.characters.themaking:before{
		height: 64rem;
	}
	.main_banner2_1st.characters.themaking h2,
	.main_banner2_1st.characters.themaking p{
		font-size: 0.9rem;
	}





	.main_banner2.main_banner2_1st.characters.changelog{  
		padding: 5rem 0 !important; 
		padding-bottom: 11rem !important;
		margin-bottom: -13rem !important;
	}
	.main_banner2_1st.characters.changelog:before{
		height: 37rem;
	}
	.main_banner2_1st.characters.changelog .thumb img{
		margin-bottom: 0;
		width: 187%;
		z-index: 0;
		left: -3rem;
	}

	.main_banner2_1st.characters.changelog .spacing{
		display: block !important;
	}

	.main_banner2_1st.characters.changelog h2{
		font-size: 0.8rem;
	}

	.main_banner2_1st.characters.changelog .thumb h2{
		font-size: 1.2rem;
		top: 60%;
	}

	.main_banner2_1st.characters.changelog .view,
	.main_banner2_1st.characters.changelog .date{
		font-size: 0.8rem;
		padding: 0.2rem 2rem;
	}






	.main_banner.characters.heroes{
		padding-bottom: 21rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes{
		margin-top: -19rem !important;
		padding-bottom: 16rem; 
		position: relative;
		margin-bottom: -15rem !important;
		padding-right: 2rem;
		padding-left: 2rem;
	}

	.main_banner2.main_banner2_1st.characters.heroes .col-sm-7.pr-5{
		padding-right: 15px !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes img{
		max-width: 100%;
	}
	.main_banner2.main_banner2_1st.characters.heroes h2{
		font-size: 1.2rem !important;
		text-align: center !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes p{
		font-size: 0.8rem !important;
		text-align: center !important;
	}






	.main_banner.characters.making_details .site-heading{
		padding-top: 3rem;
	}
	.main_banner.characters.heroes.making_details{
		padding-bottom: 1rem !important;
		margin-bottom: -9rem !important;
	}
	.main_banner.characters.heroes.making_details h2{
		font-size: 1.1rem !important;
	}
	.main_banner.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details{
		padding-right: 0;
		padding-left: 0;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details img{
		max-width: 100%;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details h2{
		font-size: 1rem !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}

}

@media (min-width: 370px) and (max-width: 430px){
	.main_banner{
		margin-bottom: 11rem;
	}


	.main_banner .site-heading img, .main_banner .site-heading_support img{
		padding: 0 !important;
	}

	.main_banner:before{

		height: 43rem;
		top: -4rem !important;
	}

	.main_banner h4{
		font-size: 1rem !important;
	}

	.main_banner h2{
		font-size: 1.5rem !important;
		margin-bottom: 1rem !important;
		margin-top: 1rem !important;
	}

	.main_banner .site-heading .col-12 a{
		width: 40%;
		margin-right: 1rem;
	}

	.site-heading{
		padding-top: 13rem;
	}

	.page-section:before {
		height: 45rem;
	}

	.page-section img[src="img/logo1.png"] {
		max-width: 71% !important;
		padding-bottom: 2rem;
	}



	.row0 p{
		padding-top: 0 !important;
		font-size: 0.9rem !important;
	}

	.row0 p:first-letter{
		font-size: 6rem !important;
		line-height: 4.7rem !important;
	}

	.main_banner2{
		margin-bottom: 5rem;
		margin-top: -1rem !important;
	}

	.main_banner2 .container{
		padding-top:3rem !important; 
	}

	.main_banner2:before{
		height: 20rem;
		background-position-x: 0%;
	}

	.main_banner2 .container .col-md-6{
		-ms-flex: 0 0 80%;
		flex: 0 0 80%;
		max-width: 80%;
	}

	.main_banner2 .container .col-md-6 h5{
		font-size: 1rem;
	}

	.main_banner2 .container .col-md-6 p{
		font-size: 0.8rem;
	}

	.main_banner2_1st img[src="img/btn_play.png"] {
		max-width: 100% !important;
		width: 100% !important;
	}

	.main_banner2_1st  img[src="img/divider1.png"]{
		left: -1rem !important;
		width: 100% !important;
		bottom: 1.8rem !important;
	}

	.main_banner2_1st  h5{
		margin-left: 1rem;
		padding-top: 0.5rem !important;
		font-size: 1.1rem;
	}

	.main_banner2_1st  p{
		font-size: 0.8rem;
	}

	.main_banner2_1st  video,
	.main_banner2_1st  .overlay1{
		top: 69rem !important;
	}

	.main_banner2_2nd{
		height: 37rem !important;
	}

	.main_banner2_2nd:before{
		height: 43rem;
		top: 98rem;
		background: url(../img/row2_bg_md.png) no-repeat center center;
		background-size: cover !important;
	}

	.main_banner2_2nd .container .pb-5{
		padding-bottom:0!important;
	}

	.main_banner2_2nd h2{
		margin-bottom:1rem !important;
	}

	.main_banner2_2nd  img[src="img/divider2.png"]{
		left: -33.5rem !important;
	}

	.main_banner2_3rd{
		height: 37rem !important;
		margin-top: 1rem !important;
	}

	.main_banner2_3rd .container{
		padding-top: 6rem !important;
	}

	.main_banner2_3rd:before{
		top: 141rem !important;
		height: 36rem !important;
		background: url(../img/row3_bg_md.png) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.main_banner2_3rd .carousel-item .main_item{
		flex-direction: column;
	}

	.main_banner2_3rd .carousel-item img{
		width: 100% !important;
		position: relative;
		left: 0;
		margin-top: 1rem;
	}

	.main_banner2_3rd .carousel-item .image{
		order: 2;
	}

	.main_banner2_3rd .carousel-item .details{
		padding-top: 0 !important;
		margin-top: 1rem !important;
		order: 1;
	}

	.main_banner2_3rd .carousel-item .details h5{
		margin-bottom: 1rem !important;
		font-size: 1.1rem !important;
		padding-top: 0 !important;
	}

	.main_banner2_3rd .carousel-item .details p{
		font-size: 0.8rem;
		padding-right: 0 !important;
	}

	.main_banner2_3rd .carousel-control-prev,
	.main_banner2_3rd .carousel-control-next{
		display: block !important;
		top: 161rem !important;
	}
	.main_banner2_3rd .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_3rd .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}

	.main_banner2_4th{
		margin-top: -15rem !important;
		height: 34rem !important;
	}

	.main_banner2_4th .slider_content, 
	.main_banner2_4th .slider_content1, 
	.main_banner2_4th .slider_content2{
		padding: 3rem;
		padding-bottom: 0;
		height: 27rem !important;
	}

	.main_banner2_4th .slider_content:before, 
	.main_banner2_4th .slider_content1:before, 
	.main_banner2_4th .slider_content2:before{
		top: 0rem;
		height: 42rem !important;
	}

	.main_banner2_4th .carousel-item h2{
		font-size: 1rem !important;
	}

	.main_banner2_4th .carousel-item p{
		font-size: 0.8rem !important;
	}

	.main_banner2_4th .carousel-control-prev,
	.main_banner2_4th .carousel-control-next{
		display: block !important;
		top: 182rem !important;
	}
	.main_banner2_4th .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_4th .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_4th .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_4th .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}

	.main_banner2_5th{
		padding-top: 3rem;
	}

	.main_banner2_5th h2{
		font-size: 1.1rem !important;
	}

	.main_banner2_5th p{
		font-size: 0.8rem !important;
		margin-bottom:1rem !important;
	}

	.main_banner2_5th img[src="img/behind_scene.png"]{
		max-width: 150px !important;
	}

	.main_banner2_5th:before {
		top: 198rem !important;
		background-position: 79%;
		height: 34rem !important;
	}

	.footer:before {
		height: 34rem !important;
	}

	.footer p {
		font-size: 0.8rem;
	}




	.main_banner.characters{
		padding: 0rem 0 !important;
		padding-bottom: 3rem !important;
		margin-top: 0rem !important;
		margin-bottom: -6rem !important;
	}
	.main_banner.characters .site-heading h2{
		font-size: 1.1rem !important;
	}


	.main_banner2_1st.characters {
		margin-top: -6rem !important;
		margin-bottom: -10rem !important;
	}

	.main_banner2_1st.characters:before{
		height: 114rem;
	}

	.main_banner2_1st.characters h2{
		font-size: 1.5rem;
	}





	.main_banner2_1st.characters.themaking h2,
	.main_banner2_1st.characters.themaking p{
		font-size: 0.8rem;
	}




	.main_banner2.main_banner2_1st.characters.changelog{  
		padding: 6rem 0 !important; 
		padding-bottom: 11rem !important;
		margin-bottom: -13rem !important;
	}
	.main_banner2_1st.characters.changelog:before{
		height: 40rem;
	}
	.main_banner2_1st.characters.changelog .thumb img{
		margin-bottom: 0;
		width: 224%;
		z-index: 0;
		left: -4rem;
	}

	.main_banner2_1st.characters.changelog .spacing{
		display: block !important;
	}

	.main_banner2_1st.characters.changelog h2{
		font-size: 0.8rem;
	}

	.main_banner2_1st.characters.changelog .thumb h2{
		font-size: 1rem;
		top: 60%;
	}

	.main_banner2_1st.characters.changelog .view,
	.main_banner2_1st.characters.changelog .date{
		font-size: 0.8rem;
		padding: 0.2rem 2rem;
	}






	.main_banner.characters.heroes{
		padding-bottom: 21rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes{
		margin-top: -19rem !important;
		padding-bottom: 16rem; 
		position: relative;
		margin-bottom: -15rem !important;
		padding-right: 2rem;
		padding-left: 2rem;
	}

	.main_banner2.main_banner2_1st.characters.heroes .col-sm-7.pr-5{
		padding-right: 15px !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes img{
		max-width: 100%;
	}
	.main_banner2.main_banner2_1st.characters.heroes h2{
		font-size: 1.2rem !important;
		text-align: center !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes p{
		font-size: 0.8rem !important;
		text-align: center !important;
	}






	.main_banner.characters.making_details .site-heading{
		padding-top: 3rem;
	}
	.main_banner.characters.heroes.making_details{
		padding-bottom: 1rem !important;
		margin-bottom: -9rem !important;
	}
	.main_banner.characters.heroes.making_details h2{
		font-size: 1.1rem !important;
	}
	.main_banner.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details{
		padding-right: 0;
		padding-left: 0;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details img{
		max-width: 100%;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details h2{
		font-size: 1rem !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}


}

@media (min-width: 290px) and (max-width: 370px){
	.main_banner{
		margin-bottom: 11rem;
	}

	.main_banner:before{
		height: 41rem;
	}

	.main_banner .site-heading img, .main_banner .site-heading_support img{
		padding: 0 !important;
	}

	.main_banner:before{

		height: 40rem;
		background-position: 59% center;
		top: -4rem !important;
	}

	.main_banner h4{
		font-size: 0.9rem !important;
	}

	.main_banner h2{
		font-size: 1.1rem !important;
		margin-bottom: 1rem !important;
		margin-top: 1rem !important;
	}

	.main_banner .site-heading .col-12 a{
		width: 45%;
		margin-right: 0;
		padding-right: 1rem;
	}

	.site-heading{
		padding-top: 13rem;
	}

	.page-section:before {
		height: 41rem;
	}

	.page-section img[src="img/logo1.png"] {
		max-width: 77% !important;
	}

	.row0 p{
		padding-top: 1rem !important;
		font-size: 0.8rem !important;
	}

	.row0 p:first-letter{
		font-size: 5rem !important;
		line-height: 4.3rem !important;
	}

	.main_banner2{
		margin-bottom: 6rem;
	}

	.main_banner2 .container{
		padding-top:3rem !important; 
		padding-right: 15px !important;
	}

	.main_banner2:before{
		height: 20rem;
		background-position-x: 15%;
	}

	.main_banner2 .container .col-md-6{
		-ms-flex: 0 0 90%;
		flex: 0 0 90%;
		max-width: 90%;

		padding-right: -1rem;
	}

	.main_banner2 .container .col-md-6 h5{
		font-size: 0.9rem;
	}

	.main_banner2 .container .col-md-6 p{
		font-size: 0.7rem;
	}

	.main_banner2_1st .col-xs-12{
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}

	.main_banner2_1st .play_vid a{
		text-align: center !important;
		padding:0 !important;
	}

	.main_banner2_1st .play_title{
		padding-top: 1rem !important;
		padding-right: 0 !important;
	}

	.main_banner2_1st .play_text{
		padding-top: 1rem !important;
		padding-right: 0 !important;
		padding-left: 0 !important;
	}

	.main_banner2_1st img[src="img/btn_play.png"] {
		max-width: 100% !important;
		width: 35% !important;
	}

	.main_banner2_1st  img[src="img/divider1.png"]{
		left: 1rem !important;
		width: 100% !important;
		bottom: 1.2rem  !important;
	}

	.main_banner2_1st  h5{
		margin:0 1rem !important;
		padding-top: 0.5rem !important;
		font-size: 1rem;
		text-align: center;
	}

	.main_banner2_1st  p{
		font-size: 0.8rem !important;
	}

	.main_banner2_1st  video,
	.main_banner2_1st  .overlay1{
		top: 65rem !important;
		height: 62rem ;
	}

	.main_banner2_2nd{
		height: 23rem !important;
	}

	.main_banner2_2nd:before{
		height: 29rem;
		top: 102rem;
		background: url(../img/row2_bg_md.png) no-repeat center center;
		background-size: cover !important;
	}

	.main_banner2_2nd .container .pb-5{
		padding-bottom:0!important;
	}

	.main_banner2_2nd h2{
		margin-bottom:1rem !important;
		font-size: 1.2rem !important;
	}

	.main_banner2_2nd  img[src="img/divider2.png"]{
		left: -35.5rem !important;
		bottom: -41rem !important;

	}

	.main_banner2_3rd{
		height: 37rem !important;
		margin-top: 1rem !important;
	}

	.main_banner2_3rd .container{
		padding-top: 3rem !important;
	}

	.main_banner2_3rd:before{
		top: 125rem !important;
		height: 37rem !important;
		background: url(../img/row3_bg_md.png) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.main_banner2_3rd .carousel-item .main_item{
		flex-direction: column;
	}

	.main_banner2_3rd .carousel-item img{
		width: 120% !important;
		position: relative;
		left: -1rem;
		margin-top: 0;
	}

	.main_banner2_3rd .carousel-item .image{
		order: 2;
	}

	.main_banner2_3rd .carousel-item .details{
		padding:0 !important;
		margin-top: 1rem !important;
		order: 1;
	}

	.main_banner2_3rd .carousel-item .details h5{
		margin-bottom: 1rem !important;
		font-size: 1rem !important;
		padding-top: 0 !important;
	}

	.main_banner2_3rd .carousel-item .details p{
		font-size: 0.8rem !important;
		padding-right: 0 !important;
	}

	.main_banner2_3rd .carousel-control-prev,
	.main_banner2_3rd .carousel-control-next{
		display: block !important;
		top: 148rem !important;
	}
	.main_banner2_3rd .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_3rd .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_3rd .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}

	.main_banner2_4th{
		margin-top: -17rem !important;
		height: 27rem !important;
	}

	.main_banner2_4th .slider_content, 
	.main_banner2_4th .slider_content1, 
	.main_banner2_4th .slider_content2{
		padding: 3rem;
		padding-bottom: 0;
		height: 27rem !important;
	}

	.main_banner2_4th .slider_content:before, 
	.main_banner2_4th .slider_content1:before, 
	.main_banner2_4th .slider_content2:before{
		top: 0rem;
		height: 42rem !important;
	}

	.main_banner2_4th .carousel-item h2{
		font-size: 1rem !important;
	}

	.main_banner2_4th .carousel-item p{
		font-size: 0.8rem !important;
		margin-bottom: 2rem !important;
	}

	.main_banner2_4th .carousel-control-prev,
	.main_banner2_4th .carousel-control-next{
		display: block !important;
		top: 168rem !important;
	}
	.main_banner2_4th .carousel-control-prev{
		left: 1rem !important;
	}

	.main_banner2_4th .carousel-control-next{
		right: 1rem !important;
	}

	.main_banner2_4th .carousel-control-prev img[src="img/btn_slider_next.png"],
	.main_banner2_4th .carousel-control-next img[src="img/btn_slider_next.png"]{
		width: 100% !important;
	}

	.main_banner2_5th{
		padding-top: 0;
	}

	.main_banner2_5th h2{
		font-size: 1.1rem !important;
	}

	.main_banner2_5th p{
		font-size: 0.8rem !important;
		margin-bottom:1rem !important;
	}

	.main_banner2_5th img[src="img/behind_scene.png"]{
		max-width: 150px !important;
	}

	.main_banner2_5th:before {
		top: 182rem !important;
    background-position: 77%;
    height: 44rem !important;
	}

	.footer:before {
		height: 33rem !important;
	}

	.footer p{
		font-size: 0.8rem;
	}



	

	.main_banner.characters{
		padding: 0rem 0 !important;
		padding-bottom: 3rem !important;
		margin-top: 0rem !important;
		margin-bottom: -5rem !important;
	}
	.main_banner.characters .site-heading h2{
		font-size: 1rem !important
	}
	.main_banner.characters:before{
		height: 18rem;
	}
	.main_banner2_1st.characters {
		margin-top: -6rem !important;
		margin-bottom: -10rem !important;
	}

	.main_banner2_1st.characters:before{
		height: 98rem;
	}

	.main_banner2_1st.characters h2{
		font-size: 1.2rem;
	}





	.main_banner2_1st.characters.themaking h2,
	.main_banner2_1st.characters.themaking p{
		font-size: 0.8rem;
	}







	.main_banner2.main_banner2_1st.characters.changelog{  
		padding: 4rem 0 !important; 
		padding-bottom: 11rem !important;
		margin-bottom: -14rem !important;
	}
	.main_banner2_1st.characters.changelog:before{
		height: 37rem;
	}
	.main_banner2_1st.characters.changelog .thumb img{
		margin-bottom: 0;
		width: 269%;
		z-index: 0;
		left: -5rem;
	}

	.main_banner2_1st.characters.changelog .spacing{
		display: block !important;
	}

	.main_banner2_1st.characters.changelog h2{
		font-size: 0.8rem;
	}

	.main_banner2_1st.characters.changelog .thumb h2{
		font-size: 1rem;
		top: 64%;
		padding-left: 0.7rem;
	}

	.main_banner2_1st.characters.changelog .view,
	.main_banner2_1st.characters.changelog .date{
		font-size: 0.8rem;
		padding: 0.2rem 2rem;
	}






	.main_banner.characters.heroes{
		padding-bottom: 21rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes{
		margin-top: -19rem !important;
		padding-bottom: 16rem; 
		position: relative;
		margin-bottom: -15rem !important;
		padding-right: 1rem;
		padding-left: 1rem;
	}

	.main_banner2.main_banner2_1st.characters.heroes .col-sm-7.pr-5{
		padding-right: 15px !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes img{
		max-width: 100%;
	}
	.main_banner2.main_banner2_1st.characters.heroes h2{
		font-size: 1.2rem !important;
		text-align: center !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes p{
		font-size: 0.8rem !important;
		text-align: center !important;
	}







	.main_banner.characters.making_details .site-heading{
		padding-top: 3rem;
	}
	.main_banner.characters.heroes.making_details{
		padding-bottom: 1rem !important;
		margin-bottom: -9rem !important;
	}
	.main_banner.characters.heroes.making_details h2{
		font-size: 1.1rem !important;
	}
	.main_banner.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details{
		padding-right: 0;
		padding-left: 0;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details img{
		max-width: 100%;
	}
	.main_banner2.main_banner2_1st.characters.heroes.making_details h2{
		font-size: 1rem !important;
	}

	.main_banner2.main_banner2_1st.characters.heroes.making_details p{
		font-size: 0.8rem !important;
	}
}