@charset "utf-8";
/* CSS Document */

/*========================================================================================================================================

ボタン定義

------------------------------------------------------------------------------------------------------------------------------------------
対応ファイル
	LP2/index.html

========================================================================================================================================*/

.eta .btn{display:inline-block;margin:6px;font-size:inherit;line-height:1.42;padding:0.5em 1.8em;font-weight:normal;border-width:2px;border-style:solid;background:transparent;border-radius:0.2em;cursor:pointer;font-family:"Booster Next FY", "Avenir Next", Avenir, sans-serif;user-select:none;vertical-align:bottom;position:relative;overflow:hidden;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.2);transition:box-shadow 0.4s cubic-bezier(0.23, 1, 0.32, 1)}
.eta .btn:active{text-shadow:0 1px 0 rgba(255, 255, 255, 0.2);transition-duration:0.2s}
.eta .btn:active:after{background-image:linear-gradient(-90deg, rgba(255, 255, 255, 0.02) 20%, rgba(255, 255, 255, 0))}
.eta .btn:after{content:'';display:block;position:absolute;top:0;left:0;height:100%;width:100%;transform:rotate(-19deg) translateY(-1.3em) scale(1.05);filter: blur(1px);background-image:linear-gradient(-90deg, rgba(255, 255, 255, 0.12) 20%, rgba(255, 255, 255, 0))}

.eta .btn-primary{padding:30px; width: 80%; background-color:#52C11F;color:#E6EAEF;border-color:#439e19;border-bottom-color:#347b14;box-shadow:0 1px 1px -1px rgba(255, 255, 255, 0.9) inset, 0 40px 20px -20px rgba(255, 255, 255, 0.15) inset, 0 -1px 1px -1px rgba(0, 0, 0, 0.7) inset, 0 -40px 20px -20px rgba(0, 0, 0, 0.06) inset, 0 9px 8px -4px rgba(0, 0, 0, 0.4), 0 2px 1px -1px rgba(0, 0, 0, 0.3), 7px 7px 8px -4px rgba(0, 0, 0, 0.1), -7px 7px 8px -4px rgba(0, 0, 0, 0.1), 0 -4px 12px 2px rgba(91, 215, 35, 0.2)}
.eta .btn-primary:hover{background-color:#59d322}
.eta .btn-primary:active{box-shadow:0 -1px 1px -1px rgba(255, 255, 255, 0.4) inset, 0 -40px 20px -20px rgba(255, 255, 255, 0.1) inset, 0 1px 1px -1px rgba(0, 0, 0, 0.7) inset, 0 40px 20px -20px rgba(0, 0, 0, 0.06) inset, 0 7px 8px -4px rgba(0, 0, 0, 0.4), 0 2px 1px -1px rgba(0, 0, 0, 0.2), 7px 7px 8px -4px rgba(0, 0, 0, 0.05), -7px 7px 8px -4px rgba(0, 0, 0, 0.05), 0 -4px 12px 2px rgba(91, 215, 35, 0.1);background-color:#4baf1c;color:#307212}



/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++


高齢者向けLP


+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* -----------------------------------------------------------

type1 レッド

----------------------------------------------------------- */
.button-type1-red .moreOuter{
	padding: 3px;
	border-radius: 6px;
	background-image: url(../n_img/buttonBg-red.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;		
}
.button-type1-red .outer{
	padding: 1px;
	background: #FFF;
	border-radius: 4px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}	
.button-type1-red .inner{
	background-image: url(../n_img/buttonBg-red.png);
	background-repeat: repeat-x;
	border-radius: 2px;
	display: inline-block; 
	width: 100%;
	color: #fff;
	text-shadow: 1px 1px 0 #222;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: bold;
}
.button-type1-red .inner::before,
.button-type1-red .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type1-red .inner,
.button-type1-red .inner::before,
.button-type1-red .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type1-red .inner:hover {
	color: #e30017;
}
.button-type1-red .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type1-red .inner:hover::after {
	background: #FFF;
	border-radius: 1px;
	-webkit-transform: scale(1);
	transform: scale(1);
}

/* -----------------------------------------------------------

type1 オレンジ	orange

----------------------------------------------------------- */
.button-type1-orange .moreOuter{
	padding: 2px;
	border-radius: 6px;
	background-image: url(../n_img/buttonBg-orange.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}
.button-type1-orange .outer{
	padding: 2px;
	background: #FFF;
	border-radius: 4px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}	
.button-type1-orange .inner{
	background-image: url(../n_img/buttonBg-orange.png);
	background-repeat: repeat-x;
	border-radius: 2px;
	display: inline-block; 
	width: 100%;
	color: #fff;
	/*text-shadow: 1px 1px 0 #222;*/
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: bold;
	font-family: "游ゴシック";
}

/*@media screen and (max-width: 767px){
.button-type1-orange .inner{
	font-family: sans-serif !important; 
}
}*/

.button-type1-orange .inner::before,
.button-type1-orange .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type1-orange .inner,
.button-type1-orange .inner::before,
.button-type1-orange .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type1-orange .inner:hover {
	color: #db5100;
}
.button-type1-orange .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type1-orange .inner:hover::after {
	background: #FFF;
	border-radius: 1px;
	-webkit-transform: scale(1);
	transform: scale(1);
}


@media screen and (max-width:768px) {	
.button-type1-orange .inner:hover::after {
	background: none;

}
.button-type1-orange .inner:hover {
	color: #fff;
}
}



/* -----------------------------------------------------------

type1 グレー	小柳追加

----------------------------------------------------------- */
.button-type1-grayt1 .moreOuter{
	padding: 2px;
	border-radius: 6px;
	background-image: url(../n_img/buttonBg-grayt1.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}
.button-type1-grayt1 .outer{
	padding: 2px;
	background: #FFF;
	border-radius: 4px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}	
.button-type1-grayt1 .inner{
	background-image: url(../n_img/buttonBg-grayt1.png);
	background-repeat: repeat-x;
	border-radius: 2px;
	display: inline-block; 
	width: 100%;
	color: #fff;
	/*text-shadow: 1px 1px 0 #222;*/
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: bold;
	font-family: "游ゴシック";
}

/*@media screen and (max-width: 767px){
.button-type1-grayt1 .inner{
	font-family: "游ゴシック";
}
}*/
.button-type1-grayt1 .inner::before,
.button-type1-grayt1 .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type1-grayt1 .inner,
.button-type1-grayt1 .inner::before,
.button-type1-grayt1 .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type1-grayt1 .inner:hover {
	color: #333333;
}
.button-type1-grayt1 .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type1-grayt1 .inner:hover::after {
	background: #FFF;
	border-radius: 1px;
	-webkit-transform: scale(1);
	transform: scale(1);
}
@media screen and (max-width:768px) {	
.button-type1-grayt1 .inner:hover::after {
	background: none;

}
	.button-type1-grayt1 .inner:hover {
	color: #fff;
}
}



/* -----------------------------------------------------------

type1 ブルー

----------------------------------------------------------- */
.button-type1-blue .moreOuter{
	padding: 3px;
	border-radius: 6px;
	background-image: url(../n_img/buttonBg-blue.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}
.button-type1-blue .outer{
	padding: 1px;
	background: #FFF;
	border-radius: 4px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}	
.button-type1-blue .inner{
	background-image: url(../n_img/buttonBg-blue.png);
	background-repeat: repeat-x;
	border-radius: 2px;
	display: inline-block; 
	width: 100%;
	color: #fff;
	text-shadow: 1px 1px 0 #005790;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: bold;
}
.button-type1-blue .inner::before,
.button-type1-blue .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type1-blue .inner,
.button-type1-blue .inner::before,
.button-type1-blue .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type1-blue .inner:hover {
	color: #0071bc;
}
.button-type1-blue .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type1-blue .inner:hover::after {
	background: #FFF;
	border-radius: 1px;
	-webkit-transform: scale(1);
	transform: scale(1);
}



/* -----------------------------------------------------------

type2（ゴージャスタイプ）グリーン

----------------------------------------------------------- */
.button-type2-green .outer{
	padding: 1px;
	border-radius: 10px;/*12px;*/
	background-image: url(../n_img/buttonBg-green.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border: 2px solid #00843a;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.button-type2-green .inner{
	background-image: url(../n_img/buttonBg-green.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border-radius: 8px;/*10px;*/
	display: inline-block;
	width: 100%;
	color: #fff;
	text-shadow: 1px 1px 0 #006c2f;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: bold;
}
.button-type2-green .inner::before,
.button-type2-green .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type2-green .inner,
.button-type2-green .inner::before,
.button-type2-green .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .15s ease-out;
	transition: all .15s ease-out;
}	
.button-type2-green .inner:hover {
	 -webkit-filter: invert(35%) brightness(1.5);
	 -moz-filter: invert(35%) brightness(1.5);
	 -o-filter: invert(35%) brightness(1.5);
	 -ms-filter: invert(35%) brightness(1.5);
	 filter: invert(35%) brightness(1.5);	
}
.button-type2-green .inner::after {
	/*top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);*/
}
.button-type2-green .inner:hover::after {
	/*background: #FFF;
	border-radius: 1px;
	-webkit-transform: scale(1);
	transform: scale(1);*/
}

/* -----------------------------------------------------------

type2（ゴージャスタイプ）オレンジ

----------------------------------------------------------- */
.button-type2-orange .outer{
	padding: 1px;
	border-radius: 10px;/*12px;*/
	background-image: url(../n_img/buttonBg-orange.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border: 2px solid #c53200;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.button-type2-orange .inner{
	background-image: url(../n_img/buttonBg-orange.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border-radius: 8px;/*10px;*/
	display: inline-block;
	width: 100%;
	color: #fff;
	text-shadow: 1px 1px 0 #b12d00;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: bold;
}
.button-type2-orange .inner::before,
.button-type2-orange .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type2-orange .inner,
.button-type2-orange .inner::before,
.button-type2-orange .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .15s ease-out;
	transition: all .15s ease-out;
}	
.button-type2-orange .inner:hover {
	 -webkit-filter: invert(35%) brightness(1.5);
	 -moz-filter: invert(35%) brightness(1.5);
	 -o-filter: invert(35%) brightness(1.5);
	 -ms-filter: invert(35%) brightness(1.5);
	 filter: invert(35%) brightness(1.5);	
}
.button-type2-orange .inner::after {
	/*top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);*/
}
.button-type2-orange .inner:hover::after {
	/*background: #FFF;
	border-radius: 1px;
	-webkit-transform: scale(1);
	transform: scale(1);*/
}

/* -----------------------------------------------------------

ハイライト

----------------------------------------------------------- */
.hilight-100{
	background-image: url( ../n_img/button-hilight.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.hilight-50{
	background-image: url( ../n_img/button-hilight.png);
	background-size: 100% 50%;
	background-repeat: no-repeat;
}

.addBorder{
	border: 1px solid #FFF;
}


/* -----------------------------------------------------------

type3 オレンジ	.button-type3-orange

----------------------------------------------------------- */
.button-type3-orange .outer{
	padding: 3px;
	border-radius: 10px;
	background-image: url( ../n_img/buttonBg-orange.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.button-type3-orange .inner{
	background-image: url(../n_img/buttonBg-revOrange.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border-radius: 8px;
	display: inline-block;
	width: 100%;
	color: #fff;
	text-shadow: 0px 1px 0 #a92e01;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: normal;
}
.button-type3-orange .inner::before,
.button-type3-orange .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type3-orange .inner,
.button-type3-orange .inner::before,
.button-type3-orange .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type3-orange .inner:hover {
	color: #f17300;
}
.button-type3-orange .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type3-orange .inner:hover::after {
	background: #FFF;
	border-radius: 8px;
	-webkit-transform: scale(1);
	transform: scale(1);
}

/* -----------------------------------------------------------

type3 グレー	.button-type3-gray

----------------------------------------------------------- */
.button-type3-gray .outer{
	padding: 3px;
	border-radius: 10px;
	background-image: url(../n_img/buttonBg-gray.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.button-type3-gray .inner{
	background-image: url(../n_img/buttonBg-revGray.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border-radius: 8px;
	display: inline-block;
	width: 100%;
	color: #fff;
	text-shadow: 0px 1px 0 #3c3c3c;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: normal;
}
.button-type3-gray .inner::before,
.button-type3-gray .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type3-gray .inner,
.button-type3-gray .inner::before,
.button-type3-gray .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type3-gray .inner:hover {
	color: #777;
}
.button-type3-gray .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type3-gray .inner:hover::after {
	background: #FFF;
	border-radius: 8px;
	-webkit-transform: scale(1);
	transform: scale(1);
}


/* -----------------------------------------------------------

type3 ブルー	.button-type3-blue

----------------------------------------------------------- */
.button-type3-blue .outer{
	padding: 3px;
	border-radius: 10px;
	background-image: url(../n_img/buttonBg-blue.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.button-type3-blue .inner{
	background-image: url(../n_img/buttonBg-revBlue.png);
	background-repeat: repeat-x;
	background-size: 100% 100%;
	border-radius: 8px;
	display: inline-block;
	width: 100%;
	color: #fff;
	text-shadow: 0px 1px 0 #005085;
	position: relative;
	z-index: 2;
	font-size: 22px;
	font-weight: normal;
}
.button-type3-blue .inner::before,
.button-type3-blue .inner::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-type3-blue .inner,
.button-type3-blue .inner::before,
.button-type3-blue .inner::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
}	
.button-type3-blue .inner:hover {
	color: #0071bc;
}
.button-type3-blue .inner::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale(.5);
	transform: scale(.5);
}
.button-type3-blue .inner:hover::after {
	background: #FFF;
	border-radius: 8px;
	-webkit-transform: scale(1);
	transform: scale(1);
}



/*-------------------------------------------------------------------------

ハック

-------------------------------------------------------------------------*/
/* Chrom */
@media screen and (-webkit-min-device-pixel-ratio:0){
	#upperSpace1{ height: 40%; }
	#upperSpace2{ height: 40%; }
	#upperSpace3{ height: 40%; }
	#upperSpace4{ height: 40%; }
	#upperSpace5{ height: 40%; }
}
/* FireFox */
@-moz-document url-prefix(){
	#upperSpace1{ height: 30% !important; }
	#upperSpace2{ height: 30% !important; }
	#upperSpace3{ height: 30% !important; }
	#upperSpace4{ height: 30% !important; }
	#upperSpace5{ height: 15% !important; }	
}
/* IE */
@media all and (-ms-high-contrast: none){
	#upperSpace1{ height: 35% !important; }
	#upperSpace2{ height: 35% !important; }
	#upperSpace3{ height: 40% !important; }
	#upperSpace4{ height: 40% !important; }
	#upperSpace5{ height: 40% !important; }	
}