@charset "utf-8";

/*=====================================================
TOP
======================================================*/

body{
	background:#FFF;
}

.main_wrap{
	height: 900px;
	position: relative;
}

.main_wrap:before{
	content:"";
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background: url("../images/top/main.jpg") left center / cover no-repeat;
}

.main_wrap .main_cont{
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	max-width:1400px;
	margin:0 auto;
	width:100%;
	box-sizing:content-box;
}

.main_wrap .main_cont .m01{
	position: absolute;
	left:20px;
	top:50px;
	/*width:35.72%;*/
}

.main_wrap .main_cont .m02{
	position: absolute;
	left:0;
	right:0;
	bottom:40px;
	margin:auto;
	text-align: center;
	width:61.67%;
}


@media screen and (max-width: 1080px){
	
	.main_wrap {
		height: 0;
		padding-bottom: 80%;
	}
	
	.main_wrap .main_cont .m01{
		width:46.297%;
	}




}

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

	.main_wrap{
	/*	padding-bottom: 137.5%; */
    	height: calc(100vh - 80px);
	}
	
	.main_wrap:before{
		background:url("../images/top/main_sp.jpg") center / cover no-repeat;
	}
	
	
	.main_wrap .main_cont .m01{
		width:58%;
	}

	.main_wrap .main_cont .m02{
		width:70.28%;
	}
}

@media screen and (max-width: 414px){

	.main_wrap .main_cont .m01 {
		top:40px;
		left:30px;
		width: 60%;
	}

	
	.main_wrap .main_cont .m02{
		width:90%;
		bottom:30px;
	}

	
}

@media screen and (max-width: 320px){

	div.header .logo_wrap {
    	max-width: 240px;
		top:13px;
	}

	
}