html{
	font-size: 62.5%;		
}

h2 {
font-weight: inherit;
font-size: inherit;
text-align: inherit;
margin: 0;
line-height: inherit;
}


.no-scroll{
	position: fixed;
	overflow: scroll;
}
.no-scroll-body{
	position: fixed;
	overflow: hidden;
}

body{
	font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo, sans-serif;
}



@media screen and (min-width: 769px) {

	.sp{
		display: none;
	}
	.ignore-pc{
		display: none;
	}
	body{
		font-size: 1.4rem;
	}

	#wrap{
		position: relative;
		background: #f1f1f1;
	}

	#gfooter{
		padding: 0 0 78px;
	}
	#gfooter a, footer small {
	font-size: 1.2rem;
	}
	section + section{
		margin: 65px 0 0;
	}


	/* kv
	--------------------------------------------------------------- */

	#kv{
		position: relative;
		background: #fff200;
		z-index: 100;
	}
	#kv .kv-set{
		position: relative;
		height: 585px;
	}
	#kv .kv-box{
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 100%;
	}

	#kv h1{
		position: absolute;
		top: 50px;
		width: 100%;
		text-align: center;
		line-height: 1;
	}

	#kv h1 span{
		position: relative;
		display: inline-block;
		font-size: 3.6rem;
		font-weight: bold;
		letter-spacing: 2px;
		opacity: 0;

		-webkit-transform: translateY(10px);
		-ms-transform: translateY(10px);
		-o-transform: translateY(10px);
		transform: translateY(10px);

		-webkit-transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

	}
	#kv h1 span.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);

	}

	#kv h1 span:after,
	#kv h1 span:before{
		position: absolute;
		content: "";
		display: inline-block;
		width: 4px;
		height: 35px;
		background: #000;
	}
	#kv h1 span:after{
		right: -30px;
		-webkit-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
		-o-transform: rotate(30deg);
		transform: rotate(30deg);
	}
	#kv h1 span:before{
		left: -30px;
		-webkit-transform: rotate(-30deg);
		-ms-transform: rotate(-30deg);
		-o-transform: rotate(-30deg);
		transform: rotate(-30deg);
	}


	#kv h1 strong{
		margin: 20px 0 0;
		display: block;
		font-size: 7rem;
		font-weight: bold;
		color: #004098;

		opacity: 0;

		-webkit-transition: opacity 400ms ease;
		-o-transition: opacity 400ms ease;
		transition: opacity 400ms ease;		
	}
	#kv h1 strong.on{
		opacity: 1;
	}
	#kv figure{
		position: absolute;
		bottom: -150px;
		width: 100%;
		text-align: center;

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

		opacity: 0;
		-webkit-transform: translateY(100px);
		-ms-transform: translateY(100px);
		-o-transform: translateY(100px);
		transform: translateY(100px);

	}
	#kv figure.on{
		opacity: 1;

		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);

	}	



	.kv-inner{
		position: relative;
		margin: auto;
		height: 585px;
		max-width: 900px;

		-webkit-transform-origin: top center;
		-moz-transform-origin: top center;
		-ms-transform-origin: top center;
		-o-transform-origin: top center;
		transform-origin: top center;

	}


	.bal-box{
		position: absolute;
		left: 50%;
		margin: 0 0 0 -390px;
		width: 780px;
		height: 360px;
		bottom: 0;
	}
	.bal-box-inner{
		position: relative;
		height: 360px;
	}
	.bal-box .bal span{
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

	}


	.bal-box .bal-l{
		position: absolute;
		left: 0;
		width: 50%;
	}
	.bal-box .bal-r{
		position: absolute;
		right: 0;
		width: 50%;
	}
	.bal-box .bal-l span:nth-child(1){
		top: 35px;
		left: 60px;
		width: 96.5px;
		height: 90px;
		background: url(../img/bal_l_1.png) 0 0 no-repeat;
		background-size: 100% 100%;
		
		-webkit-transform: translate(20px,20px);
		-ms-transform: translate(20px,20px);
		-o-transform: translate(20px,20px);
		transform: translate(20px,20px);		

	}
	.bal-box .bal-l span:nth-child(2){
		top: 140px;
		left: 10px;
		width: 102px;
		height: 90.5px;
		background: url(../img/bal_l_2.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translateX(30px);
		-ms-transform: translateX(30px);
		-o-transform: translateX(30px);
		transform: translateX(30px);	

	}
	.bal-box .bal-l span:nth-child(3){
		top: 245px;
		left: 60px;
		width: 97px;
		height: 90px;
		background: url(../img/bal_l_3.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translate(20px,-20px);
		-ms-transform: translate(20px,-20px);
		-o-transform: translate(20px,-20px);
		transform: translate(20px,-20px);		

	}
	.bal-box .bal-r span:nth-child(1){
		top: 35px;
		right: 60px;
		width: 96.5px;
		height: 90px;
		background: url(../img/bal_r_1.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translate(-20px,20px);
		-ms-transform: translate(-20px,20px);
		-o-transform: translate(-20px,20px);
		transform: translate(-20px,20px);		

	}
	.bal-box .bal-r span:nth-child(2){
		top: 140px;
		right: 10px;
		width: 102px;
		height: 90.5px;
		background: url(../img/bal_r_2.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translateX(-30px);
		-ms-transform: translateX(-30px);
		-o-transform: translateX(-30px);
		transform: translateX(-30px);	

	}
	.bal-box .bal-r span:nth-child(3){
		top: 245px;
		right: 60px;
		width: 97px;
		height: 90px;
		background: url(../img/_r4vp_bal_r_3.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translate(-20px,-20px);
		-ms-transform: translate(-20px,-20px);
		-o-transform: translate(-20px,-20px);
		transform: translate(-20px,-20px);		


	}

	.bal-box .bal span.on{
		opacity: 1;
		-webkit-transform: translate(0);
		-ms-transform: translate(0);
		-o-transform: translate(0);
		transform: translate(0);
	}



	.bal-txt{
		position: absolute;
		bottom: -65px;
		left: 10px;
		width: 268px;
		height: 253px;
		z-index: 20;

		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
		box-sizing: border-box;
	

	}
	.bal-txt-inner{
		width: 268px;
		height: 253px;
		z-index: 20;
		opacity: 0;

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

		-webkit-transform: translate(20px,-20px);
		-ms-transform: translate(20px,-20px);
		-o-transform: translate(20px,-20px);
		transform: translate(20px,-20px);


		background: url(../img/txt_baloon.png) 0 0 no-repeat;


	}

	.bal-txt.on .bal-txt-inner{
		opacity: 1;
		-webkit-transform: translate(0);
		-ms-transform: translate(0);
		-o-transform: translate(0);
		transform: translate(0);
	}
	



	.bal-txt-inner p{
		position: absolute;
		top: 50%;
		left: 0;
		width: 253px;
		text-align: center;
		font-size: 18px;
		font-weight: bold;
		line-height: 1;

		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.bal-txt-inner p strong{
		margin: 20px 0;
		display: block;
		text-align: center;
		font-size: 55px;
		font-weight: bold;
		letter-spacing: -4px;
		color: #004098;
	}


	/* app nav
	--------------------------------------------------------------- */
	#app-nav{
		position: relative;
		background: #004098;
		text-align: center;
		height: 150px;
	}

	#app-nav .app-nav-inner{
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}

	#app-nav ul{
		font-size: 0;
	}
	#app-nav ul li{
		display: inline-block;
		width: 195px;
	}
	#app-nav ul li + li{
		margin: 0 0 0 10px;
	}


	#app-nav ul li img{
		width: 100%;
		height: auto;
	}
	#app-nav ul li a{
		display: block;
		background: #fff;
		border-radius: 10px;
	}
	#app-nav ul li a img{
		-webkit-transition: opacity 200ms ease;
		-o-transition: opacity 200ms ease;
		transition: opacity 200ms ease;
	}
	#app-nav ul li a:hover img{
		opacity: 0.75;
	}
	#app-nav p{
		margin: 20px 0 0;
		color: #fff;
	}



	.fix-nav{
		position: fixed;
		padding: 10px 0;
		width: 100%;
		left: 0;
		bottom: 0;
		background: #004098;
		text-align: center;
		z-index: 1000;

		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		-o-transform: translateY(100%);
		transform: translateY(100%);

		-webkit-transition: transform 300ms ease;
		-o-transition: transform 300ms ease;
		transition: transform 300ms ease;

	}

	.fix-nav.on{
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}

	.fix-nav ul{
		font-size: 0;
	}
	.fix-nav ul li{
		display: inline-block;
		width: 195px;
	}
	.fix-nav ul li + li{
		margin: 0 0 0 10px;
	}
	.fix-nav ul li img{
		width: 100%;
		height: auto;
	}
	.fix-nav p{
		margin: 20px 0 0;
		color: #fff;
	}
	.fix-nav ul li a{
		display: block;
		background: #fff;
		border-radius: 10px;
	}
	.fix-nav ul li a img{
		-webkit-transition: opacity 200ms ease;
		-o-transition: opacity 200ms ease;
		transition: opacity 200ms ease;
	}
	.fix-nav ul li a:hover img{
		opacity: 0.75;
	}



	.mode-android #app-nav li:nth-child(1),
	.mode-android .fix-nav li:nth-child(1){
		display: none;
	}
	.mode-android #app-nav li,
	.mode-android .fix-nav li{
		margin: 0;
	}
	.mode-ios #app-nav li:nth-child(2),
	.mode-ios .fix-nav li:nth-child(2){
		display: none;
	}



	/* contents
	--------------------------------------------------------------- */

	.col{
		margin: 0 auto;
		max-width: 960px;
	}
	.contents{
		padding: 70px 60px;
		-webkit-transition: opacity 300ms ease;
		-o-transition: opacity 300ms ease;
		transition: opacity 300ms ease;
	}
	.contents .contents-inner + .contents-inner{ 
		padding: 140px 0 0;
	}
	.contents .inner-title{
		text-align: center;
		opacity: 0;
		-webkit-transform: translateY(50px);
		-ms-transform: translateY(50px);
		-o-transform: translateY(50px);
		transform: translateY(50px);

	}
	.contents .inner-title.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
		-webkit-transition: transform 300ms ease,opacity 300ms ease;
		-o-transition: transform 300ms ease,opacity 300ms ease;
		transition: transform 300ms ease,opacity 300ms ease;
	}

	.contents .inner-title strong{
		position: relative;
		font-size: 5.4rem;
		font-weight: bold;
		display: inline-block;
		color: #074296;
	}
	.contents .inner-title strong:before,
	.contents .inner-title strong:after{
		content: "";
		display: block;
		position: absolute;
		margin:auto;
		top: 0;
		bottom:0;
		width: 6px;
		height: 54px;
		background: #074296;
	}
	.contents .inner-title strong:before{
		left: -55px;
		-webkit-transform: rotate(-30deg);
		-ms-transform: rotate(-30deg);
		-o-transform: rotate(-30deg);
		transform: rotate(-30deg);
	}
	.contents .inner-title strong:after{
		right: -55px;
		-webkit-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
		-o-transform: rotate(30deg);
		transform: rotate(30deg);
	}

	.contents .inner-title + section{
		margin-top: 60px;
	}
	.contents section{
		background: #fff;
	}

	.contents-header{
		padding: 80px 0;
		box-sizing:content-box; 
	}
	.contents-header h2{
		font-weight: bold;
		text-align: center;
		font-size: 3.6rem;
		letter-spacing: 4px;
		line-height: 1;
	}
	.contents-header h2 span{
		display: block;
	}
	.contents-header h2 span + span{
		margin: 30px 0 0;
	}
	.contents-header h2 span i{
		position: relative;
		display: inline-block;
		padding: 0 0 10px;
	}
	.contents-header h2 span i:after{
		position: absolute;
		content: "";
		bottom: 0;
		left: -15px;
		display: block;
		height: 4px;
		width: 0;
		background: #000;

		-webkit-transition: width 200ms ease;
		-o-transition: width 200ms ease;
		transition: width 200ms ease;

	}

	.contents-header h2 span.on i:after{
		width: calc(100% + 15px);
	}

	/*---- detail-1 ----*/
	.col .detail-1{
		display: flex;
		padding: 0 30px;
		box-sizing: border-box;
		flex-direction: row-reverse;
		justify-content: space-between;
	}
	.col .detail-1 .txt-box{
		position: relative;
		width: 410px;
		box-sizing: border-box;
	}
	.col .detail-1 .fig-box {
		position: relative;
		width: 450px;
		box-sizing: border-box;
	}
	

	.col .detail-1 .fig-box .fig-elm{
		position: absolute;
		bottom: 0;
		padding: 0 80px 0 0;
		width: 450px;

		-webkit-transform-origin: left bottom;
		-moz-transform-origin: left bottom;
		-ms-transform-origin: left bottom;
		-o-transform-origin: left bottom;
		transform-origin: left bottom;

		box-sizing: border-box;
	}

	.col .detail-1 .fig-box figure span{
		position: absolute;
		top: 145px;
		right: 0;
		display: block;
		width: 146px;
		height: 146px;

		opacity: 0;
		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		-o-transform: translateX(-20px);
		transform: translateX(-20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}

	.col .detail-1 .fig-box figure span:before{
		content: "";
		position: absolute;
		top: 50%;
		left: -18px;
		margin: -18px 0 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 18px 36px 18px 0;
		border-color: transparent #074296 transparent transparent;
	}
	.col .detail-1 .txt-box h3{
		position: relative;
		padding: 40px 0 30px;
		font-size: 5rem;
		font-weight: bold;
		text-align: center;
		color: #004098;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}

	/*---- detail-2 ----*/

	.col .detail-2{
		display: flex;
		padding: 0 30px;
		box-sizing: border-box;
		justify-content: space-between;
	}
	.col .detail-2 .txt-box{
		position: relative;
		width: 410px;
		box-sizing: border-box;
	}
	.col .detail-2 .fig-box {
		position: relative;
		width: 450px;
		box-sizing: border-box;
	}
	

	.col .detail-2 .fig-box .fig-elm{
		position: absolute;
		bottom: 0;
		padding: 0 0 0 80px;
		width: 450px;

		-webkit-transform-origin: left bottom;
		-moz-transform-origin: left bottom;
		-ms-transform-origin: left bottom;
		-o-transform-origin: left bottom;
		transform-origin: left bottom;

		box-sizing: border-box;
	}
	.col .detail-2 .fig-box figure span{
		position: absolute;
		display: block;
		width: 146px;
		height: 146px;

		opacity: 0;
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		-o-transform: translateX(20px);
		transform: translateX(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}

	.col .detail-2 .fig-box figure span:before{
		content: "";
		position: absolute;
		top: 50%;
		right: -18px;
		margin: -18px 0 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 18px 0 18px 36px;
		border-color: transparent transparent transparent #074296 ;
	}
	.col .detail-2 .txt-box h3{
		position: relative;
		padding: 40px 0 30px;
		font-size: 5rem;
		font-weight: bold;
		text-align: center;
		color: #004098;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}



	/*---- detail-3 ----*/

	.col .detail-3 .txt-box{
		width: 100%;
		box-sizing: border-box;
	}

	.col .detail-3 .txt-box-title-inner{
		-webkit-transform-origin: top center;
		-moz-transform-origin: top center;
		-ms-transform-origin: top center;
		-o-transform-origin: top center;
		transform-origin: top center;
		box-sizing: border-box;
	}

	.col .detail-3 .fig-box{
		margin: 70px auto 0;
		width: 680px;
		position: relative;
		vertical-align: bottom;
	}
	.col .detail-3 .fig-elm{
		margin: auto;
		text-align: center;
		width: 680px;
		-webkit-transform-origin: top center;
		-moz-transform-origin: top center;
		-ms-transform-origin: top center;
		-o-transform-origin: top center;
		transform-origin: top center;
		box-sizing: border-box;
	}
	.col .detail-3 .fig-box figure span{
		position: absolute;
		display: block;
		width: 146px;
		height: 146px;

		opacity: 0;
		
		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}

	.col .detail-3 .fig-box figure span:nth-child(1){
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		-o-transform: translateX(20px);
		transform: translateX(20px);
	}
	.col .detail-3 .fig-box figure span:nth-child(2){
		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		-o-transform: translateX(-20px);
		transform: translateX(-20px);
	}

	.col .detail-3 .fig-box figure span:nth-child(1):before{
		content: "";
		position: absolute;
		top: 50%;
		right: -18px;
		margin: -18px 0 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 18px 0 18px 36px;
		border-color: transparent transparent transparent #074296;
	}
	.col .detail-3 .fig-box figure span:nth-child(2):before{
		content: "";
		position: absolute;
		top: 50%;
		left: -18px;
		margin: -18px 0 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 18px 36px 18px 0;
		border-color: transparent #074296 transparent transparent;
	}


	.col .detail-3 .txt-box h3{
		position: relative;
		padding: 0 0 30px;
		font-size: 5rem;
		font-weight: bold;
		text-align: center;
		color: #004098;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}



	/*---- detail common ----*/

	.col .detail .fig-box img{
		width: 100%;
		max-width: 370px;
	}

	.col .detail .fig-box figure span.on{
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);		
	}	

	.col .detail .icon-box{
		width: 410px;
		position: relative;
		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
		box-sizing: border-box;
	}

	.col .detail .icon-box figure:before{
		content: "";
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		-o-transform: translateX(20px);
		transform: translateX(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}
	.col .detail .icon-box figure:after{
		content: "";
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		-o-transform: translateX(-20px);
		transform: translateX(-20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}



	.col .detail .icon-box figure.on:before,
	.col .detail .icon-box figure.on:after{
		opacity: 1;

		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);		
	}

	.col .detail .icon-box figure img{
		width: 100%;
		height: auto;

		-webkit-transform: scale(0);
		-ms-transform: scale(0);
		-o-transform: scale(0);
		transform: scale(0);

		-webkit-transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.3);
		-o-transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.3);
		transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.3);
	}
	.col .detail .icon-box.on figure img{

		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);

	}


	.col .detail .txt-box h3 span{
		margin: 10px 0 0;
		display: block;
		font-size: 18px;
	}
	.col .detail .txt-box p{
		line-height: 1.8;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}



	.col .detail .txt-box h3.on,
	.col .detail .txt-box p.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);

	}

	
	.btn-list{
		padding: 25px 0;
		opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}
	.btn-list.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}


	.btn-list a{
		position: relative;
		display: block;
		margin:auto;
		width: 100%;
		height: 50px;
		background: #074296;
		border-radius: 25px;
		color: #fff;
		font-size: 1.8rem;
		text-align: center;
		line-height: 50px;
		font-weight: bold;
	}

	.btn-list a:after{
		position: absolute;
		content: "";
		margin:auto;
		top: 0;
		bottom: 0;
		right: 20px;
		display: block;
		width: 10px;
		height: 15px;
		background: url(../img/arrow_btn.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	.btn-list a:hover{
		text-decoration: none;
		opacity: 0.7;
		-webkit-transition: opacity 300ms ease;
		-o-transition: opacity 300ms ease;
		transition: opacity 300ms ease;
	}

	.btn-list2{
		display: flex;
	}
	.btn-list2 li{
		width: calc(50% - 8px);
	}
	.btn-list2 li + li{
		margin: 0 0 0 16px;
	}


	/* mbt
	--------------------------------------------------------------- */
	
	#mbt .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 355px;
	}
	#mbt .detail .fig-box figure span{
		top: 50px;
		left: 0;
		background: url(../img/_r4vp_bal_mbt.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#mbt .detail .icon-box figure:before{
		top: 135px;
		left: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#mbt .detail .icon-box figure:after{
		top: 135px;
		right: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	/* kisekae
	--------------------------------------------------------------- */
	
	#kisekae .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 355px;
	}
	#kisekae .detail .fig-box figure span{
		top: 63px;
		right: 0;
		background: url(../img/bal_kisekae.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#kisekae .detail .icon-box figure:before{
		top: 135px;
		left: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#kisekae .detail .icon-box figure:after{
		top: 135px;
		right: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}	

	/* t-money
	--------------------------------------------------------------- */
	
	#t-money .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 350px;
	}
	#t-money .detail .fig-box figure span{
		top: 50px;
		left: 0;
		background: url(../img/_r4vp_bal_mbt.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#t-money .detail .icon-box figure:before{
		bottom: 10px;
		left: 30px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#t-money .detail .icon-box figure:after{
		bottom: 10px;
		right: 30px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	/* t-receipt
	--------------------------------------------------------------- */
	
	#t-receipt .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 148px;
	}
	#t-receipt .detail .fig-box figure span{
		top: 110px;
		left: 0;
		background: url(../img/_r4vp_bal_t-receipt.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}


	#t-receipt .detail .icon-box figure:before{
		top: 40px;
		left: -70px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#t-receipt .detail .icon-box figure:after{
		top: 40px;
		right: -70px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	/* search
	--------------------------------------------------------------- */
	
	#search .col .detail .txt-box h3{
		padding-top: 80px;
	}
	#search .detail .icon-box figure{
		position: relative;
		margin: auto;
		padding-top: 40px;
		width: 206px;
	}
	#search .detail .fig-box figure span{
		top: 250px;
		right: 0;
		background: url(../img/bal_search.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#search .detail .icon-box figure:before{
		bottom: 10px;
		left: -60px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#search .detail .icon-box figure:after{
		bottom: 10px;
		right: -60px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}




	/* mb-order
	--------------------------------------------------------------- */
	

	#mb-order .detail .icon-box figure{
		position: relative;
		margin: auto;
/*		padding-top: 40px;
*/		width: 304px;
	}
	#mb-order .detail .fig-box figure span{
		top: 150px;
		left: 0;
		background: url(../img/bal_mb-order.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#mb-order .detail .icon-box figure:before{
		bottom: 10px;
		left: -15px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#mb-order .detail .icon-box figure:after{
		bottom: 10px;
		right: -15px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}




	/* coupon
	--------------------------------------------------------------- */
	
	#coupon .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 196px;
	}
	#coupon .detail .fig-box figure span{
		top: 145px;
		right: 0;
		background: url(../img/bal_coupon.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#coupon .detail .icon-box figure:before{
		top: 50%;
		left: -63px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#coupon .detail .icon-box figure:after{
		top: 50%;
		right: -63px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}



	/* stamp
	--------------------------------------------------------------- */
	
	#stamp .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 176px;
	}
	#stamp .detail .fig-box figure span{
		top: 115px;
		left: 0;
		background: url(../img/_r4vp_bal_stamp.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#stamp .detail .icon-box figure:before{
		bottom: 10px;
		left: -63px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#stamp .detail .icon-box figure:after{
		bottom: 10px;
		right: -63px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	/* linkray
	--------------------------------------------------------------- */
	
	#linkray .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 201px;
	}
	#linkray .detail .fig-box figure span{
		top: 185px;
		right: -10px;
		background: url(../img/bal_linkray.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#linkray .detail .icon-box figure:before{
		top: 50px;
		left: -40px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#linkray .detail .icon-box figure:after{
		top: 50px;
		right: -40px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}



	/* shopping
	--------------------------------------------------------------- */

	#shopping .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 254px;
	}
	#shopping .detail .fig-box figure span{
		top: 115px;
		right: 0;
		background: url(../img/bal_shopping.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#shopping .detail .icon-box figure:before{
		top: 50%;
		left: -63px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj2_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#shopping .detail .icon-box figure:after{
		top: 50%;
		right: -63px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj2_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}




	/* save-use
	--------------------------------------------------------------- */
	

	#save-use .icon-box-wrap{
		margin: 75px auto 0;
		width: 680px;
		box-sizing: border-box;
	}
	#save-use .icon-box-wrap:after{
		content: "";
		display: block;
		visibility: hidden;
		clear: both;

	}
	#save-use .col .detail .txt-box p {
		margin: 25px 0 0;
	}

	#save-use .txt-box .icon-box-elm:nth-child(1) .icon-box-inner-wrap{
		float: left;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2) .icon-box-inner-wrap{
		float: right;
	}
	#save-use .txt-box .icon-box{
		position: relative;
		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
		box-sizing: border-box;

	}
	#save-use .txt-box .icon-box-elm:nth-child(1) .icon-box{
		width: 340px;
		height: 180px;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2) .icon-box{
		width: 340px;
		height: 180px;
	}
	#save-use .txt-box .icon-box-elm:nth-child(1) p{
		width: 315px;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2) p{
		width: 222px;
	}

	#save-use .txt-box .icon-box-elm:nth-child(1){
		float: left;
		width: 340px;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2){
		float: right;
		width: 340px;
		box-sizing: border-box;
	}
	#save-use .txt-box .icon-box figure{
		-webkit-transform-origin: top center;
		-moz-transform-origin: top center;
		-ms-transform-origin: top center;
		-o-transform-origin: top center;
		transform-origin: top center;
	}
	#save-use .txt-box .icon-box-elm:nth-child(1) figure{
		position: relative;
		margin: auto;
		width: 159px;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2) figure{
		position: relative;
		width: 222px;
	}

	#save-use .detail .fig-box figure span:nth-child(1){
		top: 70px;
		left: 0;
		background: url(../img/bal_save.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#save-use .detail .fig-box figure span:nth-child(2){
		top: 165px;
		right: 0;
		background: url(../img/_r4vp_bal_use.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}


	#save-use .detail .icon-box-elm:nth-child(1) figure:before{
		top: 50%;
		left: -70px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#save-use .detail .icon-box-elm:nth-child(1) figure:after{
		top: 50%;
		right: -70px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	#save-use .col .detail .icon-box-elm:nth-child(2) figure:after{
		content: "";
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transform: translate(-20px,20px);
		-ms-transform: translate(-20px,20px);
		-o-transform: translate(-20px,20px);
		transform: translate(-20px,20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}
	#save-use .col .detail .icon-box-elm:nth-child(2) figure.on:after{
		opacity: 1;

		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}	

	#save-use .detail .icon-box-elm:nth-child(2) figure:after{
		top: 2px;
		right: -20px;
		width: 101px;
		height: 107px;
		background: url(../img/obj3_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}




	/* mypage
	--------------------------------------------------------------- */

	#mypage .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 198px;
	}
	#mypage .detail .fig-box figure span{
		top: 80px;
		right: 0;
		background: url(../img/bal_mypage.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#mypage .detail .icon-box figure:before{
		top: 50%;
		left: -40px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#mypage .detail .icon-box figure:after{
		top: 50%;
		right: -40px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}





	/* notification
	--------------------------------------------------------------- */
	
	#notification .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 297px;
	}
	#notification .detail .fig-box figure span{
		top: 115px;
		left: 0;
		background: url(../img/bal_notification.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	/* attention
	--------------------------------------------------------------- */
	
	#attention{
		padding: 0 60px 140px;
		background: #fff;
	}
	#attention .attention-header{
		padding: 80px 0;
	}
	#attention h3{
		text-align: center;
		font-size: 2.8rem;
		font-weight: bold;
	}
	#attention .attention-box{
		line-height: 1.8;
	}	
	#attention .attention-box li{
		text-indent: -1em;
		padding: 0 0 0 1em;
	}	
	#attention .attention-box li + li{
		margin: 10px 0 0;
	}	
	#attention .attention-box dl{
		margin: 50px 0 0;
	}	
	#attention .attention-box dl dt{
		position: relative;
		padding: 0 0 0 30px;
		font-size: 1.6rem;
		font-weight: bold;
	}
	#attention .attention-box dl dt:before{
		content:"";
		position: absolute;
		left: 0;
		top: 50%;
		margin: -10px 0 0;
		display: block;
		width: 20px;
		height: 20px;
		background: url(../img/icon_attention.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#attention .attention-box dl dd{
		margin: 20px 0 0;
		line-height: 1.8;
	}	
	#attention .attention-box dl dd a{
		color: #004098;
		font-weight: bold;
		text-decoration: underline;
	}	
	#attention .attention-box dl dd :hover{
		text-decoration: none;
	}
	#attention .attention-box .text-center{text-align: center;}




	.btn-pt{
		position: absolute;
		right: 10px;
		bottom: 10px;
		z-index: 900;
		opacity: 0;
		-webkit-transition: opacity ease 200ms;
		-o-transition: opacity ease 200ms;
		transition: opacity ease 200ms;

	}
	.btn-pt.on{
		opacity: 1;
	}

	.btn-pt a{
		position: relative;
		display: block;
		width: 60px;
		height: 60px;
		border-radius: 30px;
		text-indent: -9999px;
		background: #000;
	}
	.btn-pt a:after{
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -30px 0 0 -30px;
		display: block;
		width: 60px;
		height: 60px;
		border-radius: 30px;
		text-indent: -9999px;
		background: url(../img/arrow_pt.png) 50% 50% no-repeat;
		background-size: 22px 14px;

		-webkit-transition: transform ease 200ms;
		-o-transition: transform ease 200ms;
		transition: transform ease 200ms;

	}
	.btn-pt a:hover:after{
		-webkit-transform: translateY(-5px);
		-ms-transform: translateY(-5px);
		-o-transform: translateY(-5px);
		transform: translateY(-5px);
	}



}



@media screen and (min-width: 769px) and (max-width: 980px) {

	body{
		font-size: 1.2rem;
	}
	.contents{
		padding: 30px;
	}
	.btn-list{
		padding: 15px 0;
	}
	.btn-list a{
		height: 40px;
		font-size: 1.4rem;
		line-height: 40px;
	}
	.btn-list a:after{
		right: 10px;
		display: block;
		width: 10px;
		height: 15px;
		background: url(../img/arrow_btn.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
}





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


	.pc{
		display: none;
	}
	.ignore-sp{
		display: none;
	}

	#wrap{
		position: relative;
		background: #f1f1f1;
	}

	body{
		font-size: 1.2rem;
	}
	#gfooter a{
		font-size: 1.2rem;
	}
	#gfooter{
		padding: 0 0 62px;
	}


	section + section{
		margin: 15px 0 0;
	}



	/* kv
	--------------------------------------------------------------- */

	#kv{
		position: relative;
		background: #fff200;
		z-index: 100;
	}
	#kv .kv-set{
		position: relative;
		height: 769px;
	}


	#kv .kv-box{
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 100%;
	}

	#kv h1{
		position: absolute;
		top: 90px;
		width: 100%;
		text-align: center;
		line-height: 1;
	}
	#kv h1.on{
		opacity: 1;
	}

	#kv h1 span{
		position: relative;
		display: inline-block;
		font-size: 3.6rem;
		font-weight: bold;
		letter-spacing: 2px;
		opacity: 0;

		-webkit-transform: translateY(10px);
		-ms-transform: translateY(10px);
		-o-transform: translateY(10px);
		transform: translateY(10px);

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

	}
	#kv h1 span.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);

	}
	


	#kv h1 span:after,
	#kv h1 span:before{
		position: absolute;
		content: "";
		display: inline-block;
		width: 4px;
		height: 35px;
		background: #000;
	}
	#kv h1 span:after{
		right: -30px;
		-webkit-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
		-o-transform: rotate(30deg);
		transform: rotate(30deg);
	}
	#kv h1 span:before{
		left: -30px;
		-webkit-transform: rotate(-30deg);
		-ms-transform: rotate(-30deg);
		-o-transform: rotate(-30deg);
		transform: rotate(-30deg);
	}

	#kv h1 strong{
		margin: 20px 0 0;
		display: block;
		font-size: 7rem;
		font-weight: bold;
		color: #004098;

		opacity: 0;

		-webkit-transition: opacity 400ms ease;
		-o-transition: opacity 400ms ease;
		transition: opacity 400ms ease;		
	}
	#kv h1 strong.on{
		opacity: 1;
	}	

	#kv figure{
		position: absolute;
		bottom: -50px;
		left: 50%;
		margin: 0 0 0 -177px;
		width: 354px;
		text-align: center;

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

		opacity: 0;
		-webkit-transform: translateY(100px);
		-ms-transform: translateY(100px);
		-o-transform: translateY(100px);
		transform: translateY(100px);

	}
	#kv figure.on{
		opacity: 1;

		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}	
	#kv figure img{
		width: 100%;

	}

	.kv-inner{
		position: relative;
		margin: auto;
		width: 769px;
		height: 769px;
		
		-webkit-transform-origin: top left;
		-moz-transform-origin: top left;
		-ms-transform-origin: top left;
		-o-transform-origin: top left;
		transform-origin: top left;
	}


	.bal-box{
		position: absolute;
		left: 50%;
		margin: 0 0 0 -370px;
		width: 740px;
		height: 475px;
		bottom: 0;
	}
	.bal-box-inner{
		position: relative;
		height: 360px;
	}
	.bal-box .bal span{
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

	}


	.bal-box .bal-l{
		position: absolute;
		left: 0;
		width: 50%;
	}
	.bal-box .bal-r{
		position: absolute;
		right: 0;
		width: 50%;
	}
	.bal-box .bal-l span:nth-child(1){
		top: 0;
		left: 50px;
		width: 118px;
		height: 110px;
		background: url(../img/bal_l_1.png) 0 0 no-repeat;
		background-size: 100% 100%;
		
		-webkit-transform: translate(20px,20px);
		-ms-transform: translate(20px,20px);
		-o-transform: translate(20px,20px);
		transform: translate(20px,20px);		

	}
	.bal-box .bal-l span:nth-child(2){
		top: 145px;
		left: 0;
		width: 124px;
		height: 110px;
		background: url(../img/bal_l_2.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translateX(30px);
		-ms-transform: translateX(30px);
		-o-transform: translateX(30px);
		transform: translateX(30px);	

	}
	.bal-box .bal-l span:nth-child(3){
		top: 285px;
		left: 55px;
		width: 118px;
		height: 110px;
		background: url(../img/bal_l_3.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translate(20px,-20px);
		-ms-transform: translate(20px,-20px);
		-o-transform: translate(20px,-20px);
		transform: translate(20px,-20px);		

	}
	.bal-box .bal-r span:nth-child(1){
		top: 0;
		right: 50px;
		width: 118px;
		height: 110px;
		background: url(../img/bal_r_1.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translate(-20px,20px);
		-ms-transform: translate(-20px,20px);
		-o-transform: translate(-20px,20px);
		transform: translate(-20px,20px);		

	}
	.bal-box .bal-r span:nth-child(2){
		top: 145px;
		right: 0;
		width: 124px;
		height: 110px;
		background: url(../img/bal_r_2.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translateX(-30px);
		-ms-transform: translateX(-30px);
		-o-transform: translateX(-30px);
		transform: translateX(-30px);	

	}
	.bal-box .bal-r span:nth-child(3){
		top: 285px;
		right: 55px;
		width: 118px;
		height: 110px;
		background: url(../img/_r4vp_bal_r_3.png) 0 0 no-repeat;
		background-size: 100% 100%;

		-webkit-transform: translate(-20px,-20px);
		-ms-transform: translate(-20px,-20px);
		-o-transform: translate(-20px,-20px);
		transform: translate(-20px,-20px);		


	}

	.bal-box .bal span.on{
		opacity: 1;
		-webkit-transform: translate(0);
		-ms-transform: translate(0);
		-o-transform: translate(0);
		transform: translate(0);
	}



	.bal-txt{
		position: absolute;
		bottom: -32px;
		left: 0;
		width: 100%;
		height: 118px;
		z-index: 20;
	}
	.bal-txt-inner{
		margin: auto;
		width: 100%;
		max-width: 712px;
		height: 118px;
		border-radius: 59px;
		background: #fff;
		border: 3px solid #004098;
		z-index: 20;
		opacity: 0;

		-webkit-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		-o-transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;
		transition: transform 400ms cubic-bezier(0.175, 0.885, 0.32, 1.5), opacity 300ms ease;

		-webkit-transform: translateY(-20px);
		-ms-transform: translateY(-20px);
		-o-transform: translateY(-20px);
		transform: translateY(-20px);	

		box-sizing: border-box;

	}

	.bal-txt.on .bal-txt-inner{
		opacity: 1;
		-webkit-transform: translate(0);
		-ms-transform: translate(0);
		-o-transform: translate(0);
		transform: translate(0);
	}
	

	.bal-txt-inner:after{
		position: absolute;
		content: "";
		display: block;
		margin: 0 0 0 -6.5px;
		top: -23px;
		right: 50%;
		width: 26px;
		height: 30px;
		background: url(../img/arrow_bal_sp.png) 0 0 no-repeat;
		background-size: 100% 100%;

		z-index: 20;
	}

	.bal-txt-inner p{
		width: 100%;
		text-align: center;
		font-size: 2.8rem;
		font-weight: bold;

		height: 118px;
		line-height: 112px;
		vertical-align: middle;

	}
	.bal-txt-inner p strong{
		position: relative;
		top: -4px;
		margin: 0 8px;
		display: inline-block;
		text-align: center;
		font-size: 5rem;
		font-weight: bold;
		letter-spacing: -2px;
		vertical-align: middle;
		color: #004098;
	}



	/* app nav
	--------------------------------------------------------------- */

	#app-nav{
		position: relative;
		background: #004098;
		text-align: center;
		height: 258px;
	}

	#app-nav .app-nav-inner{
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	#app-nav ul{
		font-size: 0;
	}
	#app-nav ul li{
		display: inline-block;
		width: 145px;
	}
	#app-nav ul li + li{
		margin: 0 0 0 7.5px;
	}
	#app-nav ul li img{
		width: 100%;
		height: auto;
	}
	#app-nav ul li a{
		display: block;
		background: #fff;
		border-radius: 10px;
	}
	#app-nav ul li a img{
		-webkit-transition: opacity 200ms ease;
		-o-transition: opacity 200ms ease;
		transition: opacity 200ms ease;
	}
	#app-nav p{
		margin: 10px 0 0;
		color: #fff;
	}

	.fix-nav{
		position: fixed;
		padding: 10px 0;
		width: 100%;
		left: 0;
		bottom: 0;
		background: #004098;
		text-align: center;
		z-index: 1000;

		-webkit-transform: translateY(100%);
		-ms-transform: translateY(100%);
		-o-transform: translateY(100%);
		transform: translateY(100%);

		-webkit-transition: transform 300ms ease;
		-o-transition: transform 300ms ease;
		transition: transform 300ms ease;

	}

	.fix-nav.on{
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}

	.fix-nav ul{
		font-size: 0;
	}
	.fix-nav ul li{
		display: inline-block;
		width: 145px;
	}
	.fix-nav ul li + li{
		margin: 0 0 0 7.5px;
	}
	.fix-nav ul li img{
		width: 100%;
		height: auto;
	}
	.fix-nav ul li a{
		display: block;
		background: #fff;
		border-radius: 10px;
	}
	.fix-nav ul li a img{
		-webkit-transition: opacity 200ms ease;
		-o-transition: opacity 200ms ease;
		transition: opacity 200ms ease;
	}


	.mode-android #app-nav li:nth-child(1),
	.mode-android .fix-nav li:nth-child(1){
		display: none;
	}
	.mode-android #app-nav li,
	.mode-android .fix-nav li{
		margin: 0;
	}
	.mode-ios #app-nav li:nth-child(2),
	.mode-ios .fix-nav li:nth-child(2){
		display: none;
	}



	/* contents
	--------------------------------------------------------------- */

	.col{
		margin: 0 auto;
	}
	.contents{
		padding: 15px;
		-webkit-transition: opacity 300ms ease;
		-o-transition: opacity 300ms ease;
		transition: opacity 300ms ease;
		overflow: hidden;
	}

	.contents .contents-inner + .contents-inner{ 
		padding: 30px 0 0;
	}
	.contents .inner-title{
		text-align: center;
		opacity: 0;
		-webkit-transform: translateY(50px);
		-ms-transform: translateY(50px);
		-o-transform: translateY(50px);
		transform: translateY(50px);

	}
	.contents .inner-title.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
		-webkit-transition: transform 200ms ease,opacity 200ms ease;
		-o-transition: transform 200ms ease,opacity 200ms ease;
		transition: transform 200ms ease,opacity 200ms ease;
	}
	.contents .inner-title strong{
		position: relative;
		font-size: 2.8rem;
		font-weight: bold;
		display: inline-block;
		color: #074296;
	}
	.contents .inner-title strong:before,
	.contents .inner-title strong:after{
		content: "";
		display: block;
		position: absolute;
		margin:auto;
		top: 0;
		bottom:0;
		width: 3px;
		height: 27px;
		background: #074296;
	}
	.contents .inner-title strong:before{
		left: -20px;
		-webkit-transform: rotate(-30deg);
		-ms-transform: rotate(-30deg);
		-o-transform: rotate(-30deg);
		transform: rotate(-30deg);
	}
	.contents .inner-title strong:after{
		right: -20px;
		-webkit-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
		-o-transform: rotate(30deg);
		transform: rotate(30deg);
	}

	.contents .inner-title + section{
		margin-top: 15px;
	}
	.contents section{
		background: #fff;
	}


	.contents-header .contents-title{
		width: 769px;
		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
	}
	.contents-header h2{
		padding: 60px 0 80px;
		text-align: center;
		font-weight: bold;
		font-size: 3.2rem;
		line-height: 1.8;
		letter-spacing: 3px;
	}
	.contents-header h2 span{
		display: block;
	}
	.contents-header h2 span + span{
		margin: 15px 0 0;
	}
	.contents-header h2 span i{
		position: relative;
		display: inline-block;
	}
	.contents-header h2 span i:after{
		position: absolute;
		content: "";
		bottom: 1px;
		left: -15px;
		display: block;
		height: 4px;
		width: 0;
		background: #000;

		-webkit-transition: width 200ms ease;
		-o-transition: width 200ms ease;
		transition: width 200ms ease;

	}
	.contents-header h2 span.on i:after{
		width: calc(100% + 15px);
	}






	/*---- detail-1 ----*/
	.col .detail-1 .fig-box{
		position: relative;
		vertical-align: bottom;
	}
	.col .detail-1 .fig-box figure{
		padding: 170px 0 0;	
		margin: auto;
		width: 354px;
	}
	.col .detail-1 .fig-box .fig-elm{
		width: 769px;
		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
		box-sizing: border-box;

		box-sizing: border-box;
	}

	.col .detail-1 .fig-box figure span{
		content: "";
		position: absolute;
		top: 0;
		left: 50%;
		margin: 0 0 0 -90px;
		display: block;
		width: 180px;
		height: 180px;

		opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}

	.col .detail-1 .fig-box figure span:before{
		content: "";
		position: absolute;
		bottom: -20px;
		left: 50%;
		margin: 0 0 0 -18px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 36px 18px 0 18px;
		border-color: #074296 transparent  transparent transparent;
	}



	.col .detail-1 .fig-box.on figure span{
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);		
	}	
	.col .detail-1 .txt-box h3{
		position: relative;
		padding: 50px 0 60px;
		font-size: 5rem;
		font-weight: bold;
		text-align: center;
		color: #004098;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}


	/*---- detail-2 ----*/

	.col .detail-2 .fig-box{
		position: relative;
		vertical-align: bottom;
	}
	.col .detail-2 .fig-box figure{
		padding: 170px 0 0;	
		margin: auto;
		width: 354px;
	}
	.col .detail-2 .fig-box .fig-elm{
		width: 769px;

		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
		box-sizing: border-box;
	}

	.col .detail-2 .fig-box figure span{
		content: "";
		position: absolute;
		top: 0;
		left: 50%;
		margin: 0 0 0 -90px;
		display: block;
		width: 180px;
		height: 180px;
		opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}

	.col .detail-2 .fig-box figure span:before{
		content: "";
		position: absolute;
		bottom: -20px;
		left: 50%;
		margin: 0 0 0 -18px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 36px 18px 0 18px;
		border-color: #074296 transparent  transparent transparent;
	}

	.col .detail-2 .txt-box h3{
		position: relative;
		padding: 50px 0 60px;
		font-size: 5rem;
		font-weight: bold;
		text-align: center;
		color: #004098;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}




	/*---- detail-3 ----*/

	.col .detail-3 .txt-box{
		width: 100%;
		box-sizing: border-box;
	}

	.col .detail-3 .txt-box-title-inner{
		width: 769px;
		-webkit-transform-origin: top left;
		-moz-transform-origin: top left;
		-ms-transform-origin: top left;
		-o-transform-origin: top left;
		transform-origin: top left;
		box-sizing: border-box;
	}

	.col .detail-3 .fig-box .fig-elm{
		width: 769px;

		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
		box-sizing: border-box;
	}
	.col .detail-3 .fig-box{
		position: relative;
		margin: 45px auto 0;
		vertical-align: bottom;
	}
	.col .detail-3 .fig-box figure{
		padding: 0;	
		margin: auto;
		width: 354px;
	}

	.col .detail-3 .fig-box figure span{
		position: absolute;
		display: block;
		width: 180px;
		height: 180px;

		opacity: 0;
		
		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}

	.col .detail-3 .fig-box figure span:nth-child(1){
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		-o-transform: translateX(20px);
		transform: translateX(20px);
	}
	.col .detail-3 .fig-box figure span:nth-child(2){
		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		-o-transform: translateX(-20px);
		transform: translateX(-20px);
	}

	.col .detail-3 .fig-box figure span:nth-child(1):before{
		content: "";
		position: absolute;
		top: 50%;
		right: -20px;
		margin: -20px 0 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 18px 0 18px 36px;
		border-color: transparent transparent transparent #074296;
	}
	.col .detail-3 .fig-box figure span:nth-child(2):before{
		content: "";
		position: absolute;
		top: 50%;
		left: -20px;
		margin: -20px 0 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 18px 36px 18px 0;
		border-color: transparent #074296 transparent transparent;
	}


	.col .detail-3 .txt-box h3{
		position: relative;
		padding: 0 0 30px;
		font-size: 5rem;
		font-weight: bold;
		text-align: center;
		color: #004098;
		opacity: 0;

		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}



	/*---- detail common ----*/
	
	.col .detail .txt-box{
		box-sizing: border-box;
	}
	
	.col .detail .fig-box figure span.on{
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);		
	}

	.col .detail .icon-box{
		width: 769px;
		position: relative;

		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
	}

	.col .detail .icon-box figure img{
		width: 100%;
		height: auto;

		-webkit-transform: scale(0);
		-ms-transform: scale(0);
		-o-transform: scale(0);
		transform: scale(0);

		-webkit-transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.3);
		-o-transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.3);
		transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.3);
	}
	.col .detail .icon-box.on figure img{

		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);

	}

	.col .detail .icon-box figure:before{
		content: "";
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		-o-transform: translateX(20px);
		transform: translateX(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}
	.col .detail .icon-box figure:after{
		content: "";
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		-o-transform: translateX(-20px);
		transform: translateX(-20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}
	.col .detail .icon-box figure.on:before,
	.col .detail .icon-box figure.on:after{
		opacity: 1;

		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);		
	}

	.col .detail .fig-box img{
		width: 100%;
		max-width: 370px;
	}

	.col .detail .txt-box h3 span{
		margin: 10px 0 0;
		display: block;
		font-size: 18px;
	}
	.col .detail .txt-box p{
		margin: 0 auto 0;
		padding: 0 30px;
		max-width: 500px;
		opacity: 0;
		line-height: 1.8;
	
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}



	.col .detail .txt-box h3.on,
	.col .detail .txt-box p.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);

	}


	.btn-list{
		padding: 25px 30px 45px;
		opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;
	}
	.btn-list.on{
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}


	.btn-list a{
		position: relative;
		display: block;
		margin:auto;
		width: 100%;
		height: 45px;
		background: #074296;
		border-radius: 25px;
		color: #fff;
		font-size: 1.2rem;
		text-align: center;
		line-height: 45px;
		font-weight: bold;
	}

	.btn-list a:after{
		position: absolute;
		content: "";
		margin:auto;
		top: 0;
		bottom: 0;
		right: 15px;
		display: block;
		width: 7px;
		height: 11px;
		background: url(../img/arrow_btn.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	.btn-list a:hover{
		text-decoration: none;
		opacity: 0.7;
		-webkit-transition: opacity 300ms ease;
		-o-transition: opacity 300ms ease;
		transition: opacity 300ms ease;
	}

	.btn-list2{
		display: flex;
	}
	.btn-list2 li{
		width: calc(50% - 6px);
	}
	.btn-list2 li + li{
		margin: 0 0 0 12px;
	}




	/* mbt
	--------------------------------------------------------------- */
	
	#mbt .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 355px;
	}
	#mbt .detail .fig-box figure span{
		background: url(../img/_r4vp_bal_mbt.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#mbt .detail .icon-box figure:before{
		top: 135px;
		left: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#mbt .detail .icon-box figure:after{
		top: 135px;
		right: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	/* kisekae
	--------------------------------------------------------------- */
	
	#kisekae .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 355px;
	}
	#kisekae .detail .fig-box figure span{
		background: url(../img/bal_kisekae.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#kisekae .detail .icon-box figure:before{
		top: 135px;
		left: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#kisekae .detail .icon-box figure:after{
		top: 135px;
		right: 35px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}	

	/* t-money
	--------------------------------------------------------------- */
	
	#t-money .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 350px;
	}
	#t-money .detail .fig-box figure span{
		background: url(../img/_r4vp_bal_mbt.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#t-money .detail .icon-box figure:before{
		bottom: 10px;
		left: 30px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#t-money .detail .icon-box figure:after{
		bottom: 10px;
		right: 30px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	/* t-receipt
	--------------------------------------------------------------- */
	
	#t-receipt .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 148px;
	}
	#t-receipt .detail .fig-box figure span{
		background: url(../img/_r4vp_bal_t-receipt.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#t-receipt .detail .icon-box figure:before{
		top: 40px;
		left: -70px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#t-receipt .detail .icon-box figure:after{
		top: 40px;
		right: -70px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	/* search
	--------------------------------------------------------------- */
	
	#search .col .detail .txt-box h3{
		padding-top: 80px;
	}
	#search .detail .icon-box figure{
		position: relative;
		margin: auto;
		padding-top: 40px;
		width: 206px;
	}
	#search .detail .fig-box figure span{
		background: url(../img/bal_search.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#search .detail .icon-box figure:before{
		bottom: 10px;
		left: -60px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#search .detail .icon-box figure:after{
		bottom: 10px;
		right: -60px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}



	/* mb-order
	--------------------------------------------------------------- */
	

	#mb-order .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 340px;
	}
	#mb-order .detail .fig-box figure span{
		background: url(../img/bal_mb-order.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#mb-order .detail .icon-box figure:before{
		bottom: 10px;
		left: -10px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#mb-order .detail .icon-box figure:after{
		bottom: 10px;
		right: -10px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}




	/* coupon
	--------------------------------------------------------------- */
	

	#coupon .txt-box{
		box-sizing: border-box;
	}
	#coupon .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 201px;
	}
	#coupon .detail .fig-box figure span{
		background: url(../img/bal_coupon.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#coupon .detail .icon-box figure:before{
		top: 50%;
		left: -63px;
		margin: -32px 0 0;
		width: 34px;
		height: 67px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#coupon .detail .icon-box figure:after{
		top: 50%;
		right: -63px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}





	/* stamp
	--------------------------------------------------------------- */
	
	#stamp .txt-box{
		box-sizing: border-box;
	}
	#stamp .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 201px;
	}
	#stamp .detail .fig-box figure span{
		background: url(../img/_r4vp_bal_stamp.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}

	#stamp .detail .icon-box figure:before{
		top: 50%;
		left: -63px;
		margin: -32px 0 0;
		width: 34px;
		height: 67px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#stamp .detail .icon-box figure:after{
		top: 50%;
		right: -63px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	/* linkray
	--------------------------------------------------------------- */
	
	#linkray .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 201px;
	}
	#linkray .detail .fig-box figure span{
		background: url(../img/bal_linkray.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#linkray .detail .icon-box figure:before{
		top: 50px;
		left: -40px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#linkray .detail .icon-box figure:after{
		top: 50px;
		right: -40px;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}





	/* shopping
	--------------------------------------------------------------- */
	

	#shopping .txt-box{
		box-sizing: border-box;
	}
	#shopping .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 254px;
	}
	#shopping .detail .fig-box figure span{
		background: url(../img/bal_shopping.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#shopping .detail .icon-box figure:before{
		top: 50%;
		left: -70px;
		margin: -32px 0 0;
		width: 34px;
		height: 67px;
		background: url(../img/obj2_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#shopping .detail .icon-box figure:after{
		top: 50%;
		right: -70px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj2_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}





	/* save-use
	--------------------------------------------------------------- */
	


	#save-use .icon-box-wrap{
		margin: 60px auto 0;
	}

	#save-use .col .detail .txt-box p{
		margin-top: 15px;
	}
	#save-use .col .detail .txt-box p br{
		display: none;
	}
	#save-use .col .detail .fig-box{
		padding: 0;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2){
		margin: 60px 0 0;
	}
	#save-use .txt-box .icon-box-elm:nth-child(1) figure{
		position: relative;
		margin: auto;
		width: 190px;
	}
	#save-use .txt-box .icon-box-elm:nth-child(2) figure{
		position: relative;
		margin: auto;
		width: 282px;
	}

	#save-use .detail .fig-box figure span:nth-child(1){
		top: 54px;
		left: 20px;
		background: url(../img/bal_save.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#save-use .detail .fig-box figure span:nth-child(2){
		top: 145px;
		right: 20px;
		background: url(../img/_r4vp_bal_use.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}


	#save-use .detail .icon-box-elm:nth-child(1) figure:before{
		top: 50%;
		left: -70px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#save-use .detail .icon-box-elm:nth-child(1) figure:after{
		top: 50%;
		right: -70px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}


	#save-use .col .detail .icon-box-elm:nth-child(2) figure:after{
		content: "";
		position: absolute;
		display: block;
		opacity: 0;

		-webkit-transform: translate(-20px,20px);
		-ms-transform: translate(-20px,20px);
		-o-transform: translate(-20px,20px);
		transform: translate(-20px,20px);

		-webkit-transition: transform 300ms ease, opacity 300ms ease;
		-o-transition: transform 300ms ease, opacity 300ms ease;
		transition: transform 300ms ease, opacity 300ms ease;

	}
	#save-use .col .detail .icon-box-elm:nth-child(2) figure.on:after{
		opacity: 1;

		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}	

	#save-use .detail .icon-box-elm:nth-child(2) figure:after{
		top: 2px;
		right: 0;
		width: 101px;
		height: 107px;
		background: url(../img/obj3_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}





	/* mypage
	--------------------------------------------------------------- */
	

	#mypage .txt-box{
		box-sizing: border-box;
	}
	#mypage .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 198px;
	}
	#mypage .detail .fig-box figure span{
		background: url(../img/bal_mypage.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#mypage .detail .icon-box figure:before{
		top: 50%;
		left: -40px;
		margin: -32px 0 0;
		width: 34px;
		height: 67px;
		background: url(../img/obj_l.png) 0 0 no-repeat;
		background-size: 100% 100%;

	}
	#mypage .detail .icon-box figure:after{
		top: 50%;
		right: -40px;
		margin: -32px 0 0;
		width: 33px;
		height: 65px;
		background: url(../img/obj_r.png) 0 0 no-repeat;
		background-size: 100% 100%;
	}



	/* notification
	--------------------------------------------------------------- */
	
	#notification .detail .icon-box figure{
		position: relative;
		margin: auto;
		width: 297px;
	}
	#notification .detail .fig-box figure span{
		background: url(../img/bal_notification.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}



	/* attention
	--------------------------------------------------------------- */
	
	#attention{
		padding: 0 25px 85px;
		background: #fff;
	}
	#attention .attention-header{
		padding: 30px 0;
	}
	#attention h3{
		text-align: center;
		font-size: 1.6rem;
		font-weight: bold;
	}
	#attention .attention-box{
		line-height: 1.8;
	}
	#attention .attention-box li{
		text-indent: -1em;
		padding: 0 0 0 1em;
	}	
	#attention .attention-box li + li{
		margin: 10px 0 0;
	}	
	#attention .attention-box dl{
		margin: 50px 0 0;
	}	
	#attention .attention-box dl dt{
		position: relative;
		padding: 0 0 0 26px;
		font-weight: bold;
	}
	#attention .attention-box dl dt:before{
		content:"";
		position: absolute;
		left: 0;
		top: 50%;
		margin: -8px 0 0;
		display: block;
		width: 16px;
		height: 16px;
		background: url(../img/icon_attention.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
	#attention .attention-box dl dd{
		margin: 20px 0 0;	
	}	
	#attention .attention-box dl dd a{
		color: #004098;
		font-weight: bold;
		text-decoration: underline;
	}
	#attention .attention-box .text-center{text-align: center;}



	.btn-pt{
		position: absolute;
		right: 10px;
		bottom: 10px;
		z-index: 900;
		opacity: 0;
		-webkit-transition: opacity ease 200ms;
		-o-transition: opacity ease 200ms;
		transition: opacity ease 200ms;

	}
	.btn-pt.on{
		opacity: 1;
	}

	.btn-pt a{
		position: relative;
		display: block;
		width: 40px;
		height: 40px;
		border-radius: 20px;
		text-indent: -9999px;
		background: #000;
	}
	.btn-pt a:after{
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -20px 0 0 -20px;
		display: block;
		width: 40px;
		height: 40px;
		border-radius: 20px;
		text-indent: -9999px;
		background: url(../img/arrow_pt.png) 50% 50% no-repeat;
		background-size: 15px 9px;

		-webkit-transition: transform ease 200ms;
		-o-transition: transform ease 200ms;
		transition: transform ease 200ms;

	}


}


@media screen and (max-width: 374px) and (max-width: 768px) {
	.btn-list{
		padding: 25px 15px 45px;
	}
	.btn-list a:after{
		position: absolute;
		content: "";
		margin:auto;
		top: 0;
		bottom: 0;
		right: 10px;
		display: block;
		width: 7px;
		height: 11px;
		background: url(../img/arrow_btn.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}
}
@media screen and (min-width: 769px) {
	.movietoanchor{ position:absolute; right:12%; bottom:4.5%; z-index:100; }
	#movie{ padding: 0 60px 70px 60px; }
	#movie .movie-wrap{ text-align:center; background-color: #fff; padding: 60px; }
	.fix-nav .sp-movie-leadwire{ display: none; }
	#tpresent-content{ text-align: center; }
	#tpresent-content img{ display: inline-block; margin: 0 auto 7rem auto; }
	#tpresent-content img:not(:first-of-type){ margin-left: 1rem; }
	.kv-wrap{ position: relative; }
}
@media screen and (max-width: 768px) {
	.movietoanchor{ display: none; }
	#movie .movie-wrap iframe{ width: 100%; height: auto; margin: 1rem 0 2rem 0; }
	.fix-nav .sp-movie-leadwire{ display: block; background-color: #fff; margin: 1rem; padding: .5rem 1rem; border-radius: 15px; color: #004098; font-size: 1.5rem; }
	.fix-nav .sp-movie-leadwire:hover{ text-decoration: none; }
	.arrow{ position: relative; display: inline-block; padding: 0 0 0 16px; vertical-align: middle; text-decoration: none; font-size: 15px; left: 30px; }
	.arrow::before,
	.arrow::after{ position: absolute; top: 0; bottom: 0; left: 0; margin: auto ;content: ""; vertical-align: middle; }
	.triangle-right::before{ width: 18px; height: 18px; background: #004098; border-radius: 3px; }
	.triangle-right::after{ left: 5px; box-sizing: border-box; width: 5px; height: 5px; border: 5px solid transparent; border-left: 8px solid #fff; }
	#tpresent-content{ margin-bottom: 2rem; text-align: center; }
	#tpresent-content img:not(:first-of-type){ margin-top: 1rem; }
}