/* CSS Document */
* {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-style: normal;
}
html {
	background-color: #ffffff !important;
    line-height:0;
}
body {
	padding: 0;
	margin: 0;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
}

img {
	vertical-align: bottom;
	width: 100%;
}
a{
	cursor: pointer;
}
.pc {
	display: block; 
	max-width: 1200px;
	margin: 0 auto;
}
.sp {
	display: none; 
}
.sp_only{
    display:none;
}
.wrapper {
    width: 100%;
    background-color: #fff;
}
.w_1200{
	margin: 0 auto;
    max-width: 1200px;
	overflow: hidden;
	text-align: center;
	margin-top: -5px;
}
.posi_01 {
    max-width: initial; /* 初期状態にリセット */
    width: 21%;
    height: auto;
    position: absolute;
    transform: translate(174%, -164%);
    -webkit-transform: translate(174%, -164%);
    -ms-transform: translate(174%, -164%);
}
.fix{
    position: fixed;
    height:auto;
    top: 0;
    z-index: 2;
}
.fix_adjust{
	padding-top: 2.1em;
}
.absolute-parent{
    position: relative;
    height:auto;
}
.absolute-text{
    position: absolute;
    top: 53%;
    left: 18%;
    width: 22%;
    margin: 0 auto;
}
.absolute-text2{
	position: absolute;
    top: 73%;
    left: 15%;
    width: 22%;
    margin: 0 auto;
}
.absolute-text3{
	position: absolute;
    top: 54%;
    left: 16%;
    width: 24%;
    margin: 0 auto;
}
.absolute-text4{
    position: absolute;
    top: 58%;
    left: 37%;
    width: 23%;
    margin: 0 auto;
}
.absolute-text5{
	position: absolute;
    top: 55%;
    left: 57%;
    width: 24%;
    margin: 0 auto;
}
.absolute-text6{
    position: absolute;
    top: 79%;
    left: 41%;
    width: 17%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-text7{
	position: absolute;
    top: 81%;
    left: 41%;
    width: 17%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-text8{
	position: absolute;
    top: 57%;
    left: 41%;
    width: 17%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-text9{
	position: absolute;
    top: 91%;
    left: 41%;
    width: 17%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-num1 {
    position: absolute;
    top: 88%;
    left: 8%;
    width: 17%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-num2 {
    position: absolute;
    top: 95%;
    left: 8%;
    width: 17%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-pkg{
	position: absolute;
    top: 91%;
    left: 25%;
    width: 26%;
    margin: 0 auto;
}
.absolute-btn {
    position: absolute;
    top: 48%;
    left: 48%;
    width: 29%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-btn_2,
.absolute-btn_3{
    position: absolute;
    top: 46%;
    left: 46%;
    width: 33%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-btn_3{
	top:55%;
}
.absolute-middle{
	position: absolute;
    top: 48%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    margin: 0 auto;
}
.absolute-middle2 {
    position: absolute;
    top: 76%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 104%;
}
.absolute-middle3 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 99%;
}
video {
    width: 65%;
}

.absolute-middle img {
  animation: anime1 0.8s ease 0s infinite alternate;
  transform-origin:center;
}

.absolute-btn img,
.absolute-btn_2 img,
.absolute-btn_3 img{
  animation: anime2 1.1s ease 0s infinite alternate;
  transform-origin:center;
}

.fadein_sam {
  opacity : 0;
  transform : translate(0, 40px);
  transition : all 2.2s;
}
 
.fadein_sam.active{
  opacity : 1;
  transform : translate(0, 0);
}

@keyframes anime1 {
0% {
    transform: translate(0, 4px);
}
100% {
    transform: translate(0, -4px);
}
}
@keyframes anime2 {
  from {
    transform: scale(0.9,0.9);
  }
  to {
    transform: scale(1,1);
  }
}

.relative_button {
    position: relative;
	line-height: 0;
}

.absolute_button {
  position: absolute;
  top: 0%;
  left: 0;	
}

.cv_button {
  margin: 0 auto;
}
.cv_button img {
  animation: anime3 1s infinite ease-out;
  transform-origin:center;
}

@keyframes anime3 {
  0% {
    transform: translateY(6%);
  }
  50% {
    transform: translateY(-6%);
  }
  100% {
    transform: translateY(6%);
  }
}


/*アコーディオンcss*/
.accordionlist dt{
    display:block;
    background: #fff;
    border-top: 1px solid #DFDFDF;
    margin:0;
}
.accordionlist dt:first-child{
    border-top: none !important;
}
.accordionlist dt .title{
    padding-left: 0px;
}
.accordionlist dd{
    display:none;
	background: #fff;
	padding:0 0 0px 0px;
}
.accordion_icon,
.accordion_icon span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.accordion_icon span {
	position: absolute;
    left: 6px;
    width: 50%;
	height: 2px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-ms-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
}
.accordion_icon span:nth-of-type(1) {
	transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
}
.accordion_icon span:nth-of-type(2) {
	transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
/*＋、－切り替え*/
.accordion_icon.active span:nth-of-type(1) {
	display:none;
}
.accordion_icon.active span:nth-of-type(2) {
	top: 5px;
	transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}
	/*マウスポインタ指になる*/
	cursor: pointer;
	cursor: hand;
	/*マウスポインタ指になる*/
/*アコーディオンcss*/



.content-text {
    padding: 8px 10px;
    box-sizing: border-box;
    margin: 0 auto;
    padding-bottom: 10px;
    background: #FFFFEF;
}
.footer {
    font-size: small;
    text-align: center;
    background-color: rgba(246,247,231,1.00);
}
.footer p {
    line-height: 1.5em;
}
.footer .footer-menu {
    padding: 10px;
    font-size: x-small;
}
.footer .footer-menu p {
    font-size: 10px;
}
.footer .copyright {
	position: absolute;
	width: 100%;
    font-size: small;
    font-weight: normal;
    background-color: #000000;
    color: #fff;
    line-height: 200%;
}
#fixed_btn5{
	display: none;
}
#offer{
	padding-top: 63px;
	margin-top: -63px;
}
@media screen and (max-width: 800px) {
	video {
    	width: 96%;
	}
	.sp_only{
    	display:block;
		height:100%;
		width: 150%;
		margin: 0 -50%;
	}
	.absolute-text{
    	position: absolute;
    	top: 53%;
    	left: 14%;
    	width: 22%;
    	margin: 0 auto;
	}
	.absolute-text2{
    	position: absolute;
    	top: 73%;
    	left: 11%;
    	width: 22%;
    	margin: 0 auto;
	}
	.absolute-text3{
    	position: absolute;
    	top: 55%;
    	left: 8%;
    	width: 24%;
    	margin: 0 auto;
	}
	.absolute-text5{
		position: absolute;
    	top: 54%;
    	left: 66%;
    	width: 24%;
    	margin: 0 auto;
	}
	.absolute-pkg{
    	position: absolute;
    	top: 92%;
    	left: 15%;
    	width: 26%;
    	margin: 0 auto;
	}
    	.absolute-middle2 {
    	position: absolute;
    	top: 76%;
    	left: 50%;
    	transform: translate(-50%, -50%);
    	width: 104%;
	}
    .absolute-btn {
    	position: absolute;
    	top: 48%;
    	left: 55%;
    	width: 29%;
    	margin: 0 auto;
    	z-index: 1;
	}
	.absolute-btn_2,
	.absolute-btn_3{
    	position: absolute;
    	top: 47%;
    	left: 52%;
    	width: 32%;
    	margin: 0 auto;
    	z-index: 1;
	}
	.absolute-btn_3{
		top: 55%;
	}
	.w_1200 .header_img{
		width: 100%;
		margin: 0 0%;/*　トリミングしたい枠の幅（固定にしたい場合はサイズを入力）　*/
		/*
		overflow: hidden;*//*　画像が枠からはみ出た部分はトリミング（非表示）する　*/
		/*text-align: center;*/
		height: auto;
	}
	.w_1200 img{
 		height: 100%;
		width: 150%;
   	 	margin: 0 -50%;
	}
	
	.pc {
		display: none !important; 
	}
	.sp {
		display: block !important; 
    }
	.footer {
    font-size: small;
    text-align: center;
    background-color: #fff;
	}
	.footer .footer-menu {
		padding: 0;
	}
	.footer .footer-menu p {
    	font-weight: bold;
    	font-size: 14px;
    	line-height: 1.5em;
    	padding: 13px 10px;
    	color: #555;
    	background: -webkit-linear-gradient(top, #f8f8f8 0%, #e7e7e7 100%);
    	border-top: 1px solid #ccc;
	}
	.footer .copyright {
		position: absolute;
		width: 100%;
    	font-size: small;
    	font-weight: normal;
    	background: #000000;
    	color: #fff;
    	line-height: 1.4em;
    	padding: 6px 0;
	}
	/*追従ボタン*---------------------------------------*/
	
	#fixed_btn5{
		overflow: hidden;
		position: fixed;
		bottom: 0%;
		right: 0%;
		width: 120px;
		height: 120px;
		z-index: 9999999;
	}
	#fixed_btn_content5{
		position: relative;	
		width: 100%;
		height: 100%;
	}
	#move_btn7{	
		width: 90%;
		height: auto;
		position: absolute;
		bottom:0%;
		right: 0%;
		left: 0;
		margin: 0 auto;
		animation: animScale 1.3s linear infinite ;
		animation-play-state: running;
		transform-origin: center;
	}
	@keyframes animScale {	
		from,
		11.1%,
		to {
			transform: translate3d(0, 0, 0);
		}
		22.2% {
			transform: skewX(-12.5deg) skewY(-12.5deg);
		}
		33.3% {
			transform: skewX(6.25deg) skewY(6.25deg);
		}
		44.4% {
			transform: skewX(-3.125deg) skewY(-3.125deg);
		}
		55.5% {
			transform: skewX(1.5625deg) skewY(1.5625deg);
		}
		66.6% {
			transform: skewX(-0.78125deg) skewY(-0.78125deg);
		}
		77.7% {
			transform: skewX(0.390625deg) skewY(0.390625deg);
		}
		88.8% {
			transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
		}
	}	
	/*追従ボタン*---------------------------------------*/
	.absolute_button {
		position: absolute;
		top: 0%;
		left: 25%;
	}
	#offer{
		padding-top: 35px;
		margin-top: -35px;
	}
}


/*220307追加*/
/* --------------------------------
		追従バナー
-------------------------------- */
.sticky {
    position: fixed;
    bottom: 0px;
    width: 100%;
    max-width: 1200px;
    z-index: 11;
    cursor: pointer;
}
.sticky img {
    width: 100%;
}
.sticky a {
    display: block;
}
#fix_btn {
    position: relative;
    z-index: 10;
}
.fade_off {
    opacity: 0;
	pointer-events: none;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -ms-transition: all 1s;
    transition: all 1s;
}

.fade_on {
    opacity: 1;
}
.absolute_sticky {
	position: absolute;
    width: 26%;
    top: 16%;
    left: 55%;
}
.absolute_sticky2 {
	position: absolute;
    width: 26%;
    top: 16%;
    left: 50%;
}
@media screen and (max-width: 800px) {
.absolute_sticky,.absolute_sticky2{
 	width: 41%;
    top: 12%;
    left: 56%;
}
}

/* --------------------------------
		全体css
-------------------------------- */
video.mainvid {
    width: 100%;
}
video.mainvid2 {
    width: 100%;
	max-width:800px;
	margin-bottom: 4%;
}
div#sec06 {
    margin-top: 4%;
}
.absolute-btn_4{
    position: absolute;
    top: 3%;
    left: 49%;
    width: 29%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-btn-5{
    position: absolute;
    width: 88%;
    top: 52%;
    left: 50%;
	max-width: 720px;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    margin: 0 auto;
    z-index: 1;
}
.absolute-btn_4 img,.absolute-btn-5 img{
  animation: anime2 1.1s ease 0s infinite alternate;
  transform-origin:center;
}
img.header_sp {
    width: 100%;
    margin: 0;
}
.video_img{
	position: relative;
	z-index:2;
}
.video_absolute{
	position: absolute;
    width: 44%;
    top: 37%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    margin: 0 auto;
    z-index: 1;
}
.video_absolute2{
	position: absolute;
	width: 38%;
    top: 48%;
    left: 19%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    margin: 0 auto;
    z-index: 1;
}
.video_absolute video{
	width: 100%;
}
.video_absolute2 video{
	width: 100%;
}
@media screen and (max-width: 800px) {
.video_absolute{
    width: 66%;
}
.video_absolute2{
    width: 50%;
    top: 47%;
    left: 23%;
}
video.mainvid2 {
	margin-bottom: 0;
}
}

/* 画面外にいる状態 */
.fadein {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 1000ms;
}
@media screen and (max-width: 800px) {
.fadein {
	transform : translate(0, 30px);
}
}

/* 画面内に入った状態 */
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
	}
@media screen and (max-width: 800px) {
.absolute-btn_4{
	position: absolute;
    top: 4%;
    left: 55%;
    width: 29%;
    margin: 0 auto;
    z-index: 1;
}
.absolute-btn-5{
    position: absolute;
    width: 88%;
    top: 52%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    margin: 0 auto;
    z-index: 1;
}
}

/*221005追加*/
.video_absolute3{
    position: absolute;
    width: 76%;
    top: 44%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    margin: 0 auto;
    z-index: 1;
}
.video_absolute3 video{
	width: 100%;
}
.pc_adjust{
    margin-top: -2%;
    z-index: 1;
}
.posi_02 {
	position: absolute;
    width: 16%;
    top: 22%;
    left: 4%;
    z-index: 10;
}
.posi_02 img{
    filter: drop-shadow(4px 2px 2px #0000004f);
}
@media screen and (max-width: 800px) {
.video_absolute3 {
    width: 100%;
    top: 23%;
    left: 50%;
}
.posi_02 {
	position: absolute;
    width: 18%;
    top: 20%;
    left: 76%;
    z-index: 10;
}
}