@charset "utf-8";
/* レスポンシブ設定
------------------------------------- */
@media screen and (min-width: 769px){
	.sp {
		display: none!important;
	}
	body {
		min-width: 1000px;
		margin: 0 auto;
	}
}

@media screen and (max-width: 768px){
	.pc {
		display: none!important;
	}


	/* 基本設定
	------------------------------------- */
	body{
		font-size: 2.08vw;
		letter-spacing: 0.04vw;
	}


	@keyframes bounce {
		0%, 100% {
			transform: translateY(0);
		}
		50% {
			transform: translateY(-2.6vw);
		}
	}

	/* Header
	------------------------------------- */
	#header{
		width: 100vw;
		height: 19.53vw;
		background: url("../img/bgHeader.jpg") repeat-x;
		background-size: cover;
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: space-between;
		align-items: center;
		padding: 0;
	}

	#header p.titleHeader{
		width: 73.44vw;
		height: 14.58vw;
		background: url("../img/titleHeader.png") no-repeat;
		background-size: cover;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		margin-left: 1.95vw
	}

	#header p.btnContact{
		width: 20.7vw;
		height: 19.53vw;
		background: url("../img/btnHeaderContactSp.png") no-repeat;
		background-size: cover;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}

	/* Main Visual
	------------------------------------- */
	#mv{
		width: 100vw;
		background: linear-gradient(to bottom, #E5D6AA, #FFE094);
	}

	#mv img{
		width: 100vw;
		height: auto;
	}

	/* Company
	------------------------------------- */
	#boxCompany{
		position: relative;
		width: 100vw;
		height: 230.21vw;
		background: url("../img/bgCompanySp.png");
		background-size: 100% 100%;
		background-repeat: repeat-x;
		overflow:hidden;
	}

	#boxCompany #msg{
		position: absolute;
		top: 7.42vw;
		right: calc((100vw - 96.61vw) / 2);
		left: calc((100vw - 96.61vw) / 2);
		width: 96.61vw;
		height: 81.25vw;
		background: url("../img/bgMsgSp.png") no-repeat;
		background-size: cover;
		font-size: 3.39vw;
		line-height: 1.88;
		padding: 5.21vw 6.2vw;
		z-index: 3;
	}
	
	#boxCompany .star{
		width: 13vw;
		height: 13vw;
	}

	#boxCompany #star1{
		top: 90.06vw;
		left: 0.58vw;
	}

	#boxCompany #star2{
		top: 141.21vw;
		left: 2.04vw;
	}

	#boxCompany #star3{
		top: 162.59vw;
		left: 8.2vw;
	}

	#boxCompany #star4{
		top: 180.00vw;
		right: 19.9vw;
	}

	#boxCompany #star5{
		top: 100.82vw;
		right: -2vw;
	}

	#boxCompany #star6{
		top: 186.38vw;
		left: 6.29vw;
	}

	#boxCompany #details{
		position: absolute;
		bottom: 71.48vw;
		right: calc((100% - 82.81vw) / 2);
		left: calc((100% - 82.81vw) / 2);
		width: 82.81vw;
		height: 42.84vw;
	}

	#boxCompany #details ul li{
		font-size: 2.86vw;
		padding-left: 1.6vw;
		padding-top: 1.6vw;
		margin-bottom: 3.35vw;
		line-height: 1.16;
	}

	#boxCompany #details ul li p{
		color: #fff;
		width: 19.50vw;
	}

	#boxCompany #msgContact{
		bottom: 35.62vw;
		right: 26vw;
		width: 62.24vw;
		height: 29.04vw;
		background: url("../img/bgMsgContactSp.png") no-repeat;
		background-size: cover;
		font-size: 4.3vw;
		line-height: 1.27;
		padding-top: 2.1vw;
	}

	#boxCompany #btnContact{
		bottom: 22.14vw;
		right: calc(50% - 14.82vw);
		width: 28.64vw;
		height: 17.84vw;
		font-size: 2.8vw;
		line-height: 0.95;
		padding-top: 11.9vw;
	}

	#boxCompany #nobori{
		bottom: 16.93vw;
		right: 4vw;
		width: 20.18vw;
		height: 58.46vw;
	}

	#boxCompany #company{
		position: absolute;
		bottom: 10.16vw;
		right: 0;
		left: 0;
		width: 100vw;
		height: 124vw;
		background: url("../img/imgCompanySp.png") no-repeat;
		background-size: cover;
		z-index: 2;
	}

	#boxCompany #cloud1{
		width: 38.02vw;
		height: 16.15vw;
		top: 19.53vw;
		left: -16.15vw;
	}

	#boxCompany #cloud2{
		width: 46.09vw;
		height: 22.92vw;
		top: 90.54vw;
		right: -10.34vw;
	}

	#boxCompany #cloud3{
		display: none;
	}

	#boxCompany #buildings{
		position: absolute;
		bottom: 23.83vw;
		width: 266.15vw;
		left: -88.93vw;
		height: 62.5vw;
		background: url("../img/bgBuildings.png") no-repeat;
		background-size: contain;
		z-index: 0;
	}

	#boxCompany #copyright{
		bottom: 11.67vw;
		font-size: 2.4vw;
	}

}