@charset "utf-8";
* {
	margin: 0;
	padding: 0;
}
body {
	position: relative;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
	color: #3c3c3c;
	margin: 0;
	width: 100%;
}
img, video {
	width: 100%;
	height: 100%;
	vertical-align: middle;
}
#lp_contents {
	max-width: 2000px;
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
}



/*--------------------
	fade
--------------------*/
.fadeIn_up {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 2s;
}
.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}



/*--------------------
	loading
--------------------*/
#loadingScreen {
	display: none;
	position: fixed;
	width: 100%;
	top: 0px;
	left: 0px;
	background: #fff;
	z-index: 100;
	height: 100vh;
}
#loadingScreen .loadingScreenInner {
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
}
#loadingScreen .loader {
	z-index: 100;
	position: relative;
}
#loadingScreen .loader .objectPart01 {
	max-width: 157px;
	width: 7.85vw;
	position: relative;
	left: -8%;
	margin-top: 12%;
	margin-bottom: 7%;
}
#loadingScreen .loader .objectPart01 img {
	width: 40%;
	margin-left: 40%;
	opacity: 0;
}
#loadingScreen .loader .objectPart02 {
	max-width: 124px;
	width: 6.2vw;
	position: absolute;
	bottom: 10%;
	right: -75%;
}
#loadingScreen .loader .objectPart02 img {
	opacity: 0;
}
#loadingScreen .loader .objectPart03 {
	max-width: 159px;
	width: 7.95vw;
	margin-left: 6%;
	position: absolute;
	top: -20%;
}
#loadingScreen .loader .objectPart03 img {
	margin-bottom: -40%;
	opacity: 0;
}
#loadingScreen .loader .objectPart04 {
	max-width: 175px;
	width: 8.75vw;
	position: absolute;
	bottom: -30%;
}
#loadingScreen .loader .objectPart04 img {
	margin-top: -40%;
	opacity: 0;
}



/*--------------------
	header
--------------------*/
header {
	position:relative;
}
header .title {
	position: absolute;
	max-width: 796px;
	width: 39.8%;
	top: 10.64516%;
	right: 12.32%;
	z-index: 20;
}
header .ilust01 {
	position: absolute;
	max-width: 164px;
	width: 8.2%;
	top: 40.32258%;
	right: 8.97%;
	z-index: 20;
}
header .objectPart01 {
	position: absolute;
	width: 14.15%;
	top: 95.69892%;
	right: 0%;
	z-index: 20;
}
header .mov {
	position: relative;
	width: 71.5%;
	height: auto;
	z-index: 10;
}
header .mov .movInner {
	width: 100%;
	height: 100%;
	overflow: hidden;
}
header .mov .movInner:before {
	background: #fff;
	bottom: 0;
	content: '';
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
}
header .mov .movInner.movStart:before {
	animation: img-wrap 2s cubic-bezier(.4, 0, .2, 1) forwards;
}
@keyframes img-wrap {
	100% {
		transform: translateX(100%);
	}
}
header .mov video {
	width: 100%;
	object-fit: cover;
}
header .objectPart02 {
	position: absolute;
	width: 32.45%;
	top: 110%;
	left: 15.5%;
	z-index: 0;
}



/*--------------------
	wellcomeBlock
--------------------*/
section#wellcomeBlock {
	position: relative;
	margin-top: 7%;
}
section#wellcomeBlock .wc-objectPart01 {
	position: absolute;
	width: 10.85%;
	top: 4vw;
	left: 5.5%;
	z-index: 0;
}
section#wellcomeBlock .wc-objectPart02 {
	position: absolute;
	width: 10.6%;
	top: 20vw;
	left: 0%;
	z-index: 0;
}
section#wellcomeBlock .wc-objectPart03 {
	position: absolute;
	width: 13%;
	top: -4vw;
	right: 17.2%;
	z-index: 0;
}
section#wellcomeBlock .wc-objectPart04 {
	position: absolute;
	width: 10%;
	top: 9vw;
	right: 9%;
	z-index: 0;
}
section#wellcomeBlock .wc-objectPart05 {
	position: absolute;
	width: 7.5%;
	top: 23vw;
	right: 27.1%;
	z-index: 0;
}
section#wellcomeBlock .wcb-inner {
	width: 43%;
	margin: 0 auto;
}
section#wellcomeBlock .wcb-inner h2 {
	font-size: 1.6vw;
	margin-bottom: 2vw;
	line-height: 180%;
}
section#wellcomeBlock .wcb-inner p {
	font-size: 1.25vw;
	font-weight: 600;
	line-height: 200%;
	color: #777777;
}
@media screen and (min-width:2000px) {
	section#wellcomeBlock .wcb-inner h2 {
		font-size: 32px;
	}
	section#wellcomeBlock .wcb-inner p {
		font-size: 22px;
	}
}



#ambassadorBlock {
	position: relative;
	padding-top: 7%;
	margin-top: 7%;
	margin-bottom: 11%;
}
#ambassadorBlock .ambassadorInner {
	width: 71.5%;
	max-height: 790px;
	height: 39.5vw;
	background: #f5f5f5;
}
#ambassadorBlock .ambassadorInner h2 {
	width: 46.224%;
	padding-top: 10.49%;
	margin-left: 20.28%;
	position: relative;
	z-index: 10;
}
#ambassadorBlock .ambassadorInner .mov {
	width: 43%;
	position: absolute;
	top: 0;
	right: 14.5%;
}
#ambassadorBlock .ambassadorInner .movInner:before {
	background: #fff;
	bottom: 0;
	content: '';
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
}
#ambassadorBlock .ambassadorInner .movInner.movStart:before {
	animation: img-wrap 2s cubic-bezier(.4, 0, .2, 1) forwards;
}
#ambassadorBlock .ambassadorInner .txtBlock {
	width: 27%;
	background: #fff;
	margin-left: auto;
	padding-top: 3%;
	padding-left: 6.5%;
	padding-right: 1%;
	padding-bottom: 3%;
	position: absolute;
	right: 28.5%;
	bottom: 0;
}
#ambassadorBlock .ambassadorInner .txtBlock strong {
	background: url(../img/ambassador_txt_icon01.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size: 12%;
	font-size: 1.5vw;
	display: inline-block;
	margin-bottom: 3%;
	padding-right: 12%;
}
#ambassadorBlock .ambassadorInner .txtBlock .txt {
	font-size: 1.1vw;
	font-weight: 600;
	display: block;
	line-height: 200%;
	color: #777777;
}
@media screen and (min-width:2000px) {
	#ambassadorBlock .ambassadorInner .txtBlock strong {
		font-size: 30px;
	}
	#ambassadorBlock .ambassadorInner .txtBlock .txt {
		font-size: 22px;
	}
}
#ambassadorBlock .ambassadorInner .objectPart01 {
	width: 25.9%;
	position: absolute;
	bottom: -8%;
	left: 15%;
	z-index: 10;
}
#ambassadorBlock .ambassadorInner .objectPart02 {
	position: absolute;
	width: 7%;
	bottom: 17%;
	right: 58%;
	z-index: 10;
}



#point1Block {

}
#point1Block .point1Inner {
	
}
#point1Block .point1Inner .txtBox {
	width: 50%;
	padding-bottom: 21%;
	float: left;
	padding-left: 14.5%;
	box-sizing: border-box;
	position: relative;
}
#point1Block .point1Inner .txtBox h2 {
	width: 47.607%;
	margin-bottom: 9.86%;
}
#point1Block .point1Inner .txtBox .hTxt {
	font-size: 1.797vw;
	color: #777777;
	font-weight: 600;
	line-height: 170%;
}
@media screen and (min-width:2000px) {
	#point1Block .point1Inner .txtBox .hTxt {
		font-size: 30px;
	}
}
#point1Block .point1Inner .txtBox .phTxtImg1 {
	width: 67.6%;
	position: absolute;
	margin-top: 3%;
	z-index: 20;
}
#point1Block .point1Inner .img1 {
	width: 50%;
	height: 54.385%;
	float: left;
	position: absolute;
	z-index: 20;
}
#point1Block .point1Inner .txtBox .phTxtImg1 .txt {
	position: absolute;
	font-size: 1.2vw;
	font-weight: 600;
	color: #72899b;
	line-height: 180%;
	padding-top: 5%;
	padding-left: 5%;
}
@media screen and (min-width:2000px) {
	#point1Block .point1Inner .txtBox .phTxtImg1 .txt {
		font-size: 22px;
	}
}
#point1Block .point1Inner .txtBox .phTxtImg1 img {
	
}
#point1Block .point1Inner .free6Box {
	background: url(../img/point1_bg_img01.jpg) center top;
	background-size: cover;
	clear: both;
	position: relative;
	z-index: 10;
}
#point1Block .point1Inner .free6Box .freeImg1 {
	width: 54.5%;
	margin: 0 auto;
	padding-top: 10%;
	padding-bottom: 7%;
}
#point1Block .point1Inner .free6Box .captionTxt {
	position: absolute;
	width: 100%;
	bottom: 1%;
}
#point1Block .point1Inner .free6Box .captionTxt p {
	width: 71%;
	font-size: 0.8%;
	color: #fff;
	margin: 0 auto;
	text-align: right;
}
#point1Block .point1Inner .objectPart01 {
	position: absolute;
	width: 38.7%;
	bottom: 45%;
	right: 0%;
	z-index: 1;
}



#point2Block {
	margin-top: 7%;
	position: relative;
}
#point2Block .point2Inner {
	
}
#point2Block .point2Inner .mov {
	width: 43%;
	position: absolute;
	top: 0;
	left: 14.5%;
	z-index: 10;
}
#point2Block .point2Inner .movInner:before {
	background: #fff;
	bottom: 0;
	content: '';
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
}
#point2Block .point2Inner .movInner.movStart:before {
	animation: img-wrap 2s cubic-bezier(.4, 0, .2, 1) forwards;
}
#point2Block .point2Inner .cbg {
	background: #f5f5f5;
	width: 30%;
	padding-bottom: 21%;
	position: absolute;
	top: 0;
	left: 0%;
	z-index: 1;
	margin-top: 15.5%;
}
#point2Block .point2Inner .txtBox {
	width: 100%;
	padding-left: 62%;
	box-sizing: border-box;
	position: relative;
	z-index: 20;
}
#point2Block .point2Inner .txtBox h2 {
	width: 47.607%;
	margin-bottom: 9.86%;
}
#point2Block .point2Inner .txtBox .hTxt {
	font-size: 1.797vw;
	color: #777777;
	font-weight: 600;
	line-height: 170%;
}
@media screen and (min-width:2000px) {
	#point2Block .point2Inner .txtBox .hTxt {
		font-size: 30px;
	}
}
#point2Block .point2Inner .txtBox .phTxtImg1 {
	width: 123.29%;
	position: relative;
	margin-top: 15.79%;
	margin-left: -58%;
	z-index: 20;
}
#point2Block .point2Inner .txtBox .phTxtImg1 .txt {
	position: absolute;
	font-size: 1.2vw;
	font-weight: 600;
	color: #72899b;
	line-height: 180%;
	padding-top: 3.8%;
	padding-left: 39.4%;
}
@media screen and (min-width:2000px) {
	#point2Block .point2Inner .txtBox .phTxtImg1 .txt {
		font-size: 22px;
	}
}



#point3Block {
	margin-top: 7%;
	position: relative;
}
#point3Block .point3Inner {
	
}
#point3Block .point3Inner .movInner {
	position: relative;
	overflow: hidden;
}
#point3Block .point3Inner .mov {
	width: 43%;
	position: absolute;
	top: 0;
	right: 14.5%;
	z-index: 10;
}
#point3Block .point3Inner .movInner:before {
	display: block;
	background: #fff;
	bottom: 0;
	content: '';
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
}
#point3Block .point3Inner .movInner.movStart:before {
	animation: img-wrap 2s cubic-bezier(.4, 0, .2, 1) forwards;
}
#point3Block .point3Inner .cbg {
	background: #f5f5f5;
	width: 30%;
	padding-bottom: 46%;
	position: absolute;
	top: 0;
	right: 0%;
	z-index: 1;
	margin-top: -11.5%;
}
#point3Block .point3Inner .txtBox {
	width: 50%;
	padding-left: 14.5%;
	box-sizing: border-box;
	position: relative;
	z-index: 20;
}
#point3Block .point3Inner .txtBox h2 {
	width: 47.607%;
	margin-bottom: 9.86%;
}
#point3Block .point3Inner .txtBox .hTxt {
	font-size: 1.797vw;
	color: #777777;
	font-weight: 600;
	line-height: 170%;
}
@media screen and (min-width:2000px) {
	#point3Block .point3Inner .txtBox .hTxt {
		font-size: 30px;
	}
}
#point3Block .point3Inner .txtBox .phTxtImg1 {
	width: 93.1%;
	margin-top: 7.043%;
	margin-left: 0%;
	z-index: 20;
}
#point3Block .point3Inner .txtBox .phTxtImg1 .txt {
	position: absolute;
	font-size: 1.2vw;
	font-weight: 600;
	color: #72899b;
	line-height: 180%;
	padding-top: 3.7%;
	padding-left: 4%;
}
@media screen and (min-width:2000px) {
	#point3Block .point3Inner .txtBox .phTxtImg1 .txt {
		font-size: 22px;
	}
}



#productBlock {
	position: relative;
	margin-top: 12%;
	margin-bottom: 25%;
}
#productBlock .productInner {
	position: relative;
}
#productBlock .productInner .objectPart01 {
	position: absolute;
	width: 27.5%;
	top: -35%;
	right: 0;
}
#productBlock .productInner .txtBox {
	
}
#productBlock .productInner .txtBox h2 {
	width: 45.6%;
	margin: 0 auto;
	padding-bottom: 2.5%;
}
#productBlock .productInner .txtBox .phImg1 {
	width: 71.1%;
	margin: 0 auto;
	position: relative;
	padding-bottom: 7%;
}
#productBlock .productInner .txtBox .phImg1 .captionTxt {
	position: absolute;
	width: 100%;
	font-size: 0.8vw;
	left: 0%;
	bottom: 15.5%;
}
@media screen and (min-width:2000px) {
	#productBlock .productInner .txtBox .phImg1 .captionTxt {
		font-size: 16px;
	}
}
#productBlock .productInner .txtBox2 {
	background: url(../img/product_bg_img01.jpg) center top;
	background-size: cover;
	box-sizing: border-box;
	position: relative;
	padding-top: 5.5%;
	padding-bottom: 14%;
}
#productBlock .productInner .txtBox2 .hTxt {
	font-size: 1.5vw;
	color: #FFF;
	font-weight: 600;
	line-height: 200%;
	text-align: center;
}
@media screen and (min-width:2000px) {
	#productBlock .productInner .txtBox2 .hTxt {
		font-size: 30px;
	}
}
#productBlock .productInner .txtBox2 .phTxtImg1 {
	width: 26.1%;
	margin-top: 2.5%;
	margin-left: 42%;
	z-index: 20;
	position: absolute;
}
#productBlock .productInner .txtBox2 .phTxtImg1 .txt {
	position: absolute;
	font-size: 1.1vw;
	font-weight: 600;
	color: #72899b;
	line-height: 180%;
	padding-top: 6%;
	padding-left: 62%;
	color: #fff;
}
@media screen and (min-width:2000px) {
	#productBlock .productInner .txtBox2 .phTxtImg1 .txt {
		font-size: 22px;
	}
}
#productBlock .objectPart02 {
	position: absolute;
	width: 85.5%;
	top: 69%;
	left: 90%;
	z-index: -1;
}
#productBlock .productInner2 {
	padding-top: 12%;
	text-align: center;
}
#productBlock .productInner2 .txt {
	font-size: 1.5vw;
	color: #777777;
	font-weight: 600;
	line-height: 200%;
	color: #72899b;
}
#productBlock .productInner2 .txt a {
	font-size: 2.5vw;
	color: #72899b;
	margin-top: 1vw;
	display: inline-block;
}
@media screen and (min-width:2000px) {
	#productBlock .productInner2 .txt {
		font-size: 30px;
	}
	#productBlock .productInner2 .txt a {
		font-size: 30px;
	}
}
#productBlock .productInner2 strong {
	font-size: 2.5vw;
	color: #777777;
	font-weight: 600;
	line-height: 200%;
	color: #72899b;
}



footer {
	position: relative;
	background: #f5f5f5;
	border-bottom:#72899b solid 10px;
	margin-top: 20%;
}
footer .footerInner {
	position: relative;
	padding-top: 1.6%;
}
footer .footerInner copy {
	font-size: 0.8vw;
	display: block;
	text-align: center;
	padding-top: 3.8%;
	padding-bottom: 3.8%;
}
footer .footerInner copy .companyLink {
	display: block;
	font-size: 16px;
	text-decoration: underline;
	color: #72899b;
	margin-bottom: 0.5vw;
}
@media screen and (min-width:2000px) {
	footer .footerInner copy {
		font-size: 16px;
	}
}
footer .footerInner .objectPart01 {
	width: 12.05%;
	position: absolute;
	left: 10%;
	bottom: 60%;
}
footer .footerInner .objectPart02 {
	width: 71.5%;
	position: absolute;
	right: 0;
	bottom: 76.67%;
}