@charset "UTF-8";
/* CSS Document */

body {
	margin: 0;
	padding: 0;
	background-color: #1877bd;
}

/* --- MOBILE --- */

@media screen and (max-width:360px){
		
.mobile {margin:auto;width:300px;}
.tablet {display: none;}
.desktop {display: none;}

.mob_tit {
	width:300px;
	margin:auto;
	margin-top:20px;
	/*background-color:yellow;*/
}

.mob_back {
	width:300px;
	height:600px;
	margin:auto;
	/*background-color:pink;*/
	background-image: url("images/front_mobile.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position:absolute;
	float:left;
}

.mob_con {
	width:300px;
	margin:380px auto 20px auto;
	/*background-color:yellow;*/
	position:relative;
	float:left;
	}

}

/* --- TABLET --- */

@media screen and (min-width:361px) and (max-width:768px){
	
.mobile {display: none;}
.tablet {margin:auto;width:768px;}
.desktop {display: none;}

.tab_tit {
	width:648px;
	margin:auto;
	margin-top:40px;
	/*background-color:yellow;*/
}
	
.tab_con {
	width:450px;
	margin:50px auto 20px auto;
	/*background-color:yellow;*/
	}
	
}

/* --- DESKTOP --- */

@media screen and (min-width:769px) and (max-width:2560px){
	
.mobile {display: none;}
.tablet {display: none;}
.desktop {margin:auto;width:648px;}

.desk_tit {
	width:648px;
	margin:auto;
	margin-top:40px;
	/*background-color:yellow;*/
}
	
.desk_back {
	width:648px;
	height:600px;
	margin:auto;
	/*background-color:pink;*/
	background-image: url("images/front_mobile.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position:absolute;
	float:left;
}

.desk_con {
	width:648px;
	margin:380px auto 20px auto;
	/*background-color:yellow;*/
	position:relative;
	float:left;
	}
	
	
}
