@import url('https://fonts.googleapis.com/css?family=Anton');

/* form
------------------------------------------------------------------------------*/
button,
input,
select,
textarea									{font-family: -apple-system-body, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans Japanese", "游ゴシック  Medium", "Yu Gothic Medium", "メイリオ", meiryo, sans-serif;font-size: 100%;vertical-align: middle;box-sizing: border-box;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="phone"],
input[type="tel"],
input[type="number"],
input[type="datetime"],
input[type="date"],
input[type="datetime-local"],
select[multiple="multiple"],
input[type="search"],
input[type="file"]							{position: relative;z-index: 2;width: 100%;height: 40px;padding: 5px 10px;border: 1px solid #BBB;line-height: 30px;}
select										{position: relative;z-index: 3;width: auto;height: 40px;padding: 5px 5px;border: 1px solid #BBB;line-height: 30px;text-transform: none;}
textarea									{position: relative;z-index: 2;width: 100%;padding: 10px;border: 1px solid #BBB;resize: vertical;}
input[type="radio"],
input[type="checkbox"]						{position: relative;top: -1px;z-index: 2;top: 0\9;margin-right: 2px;margin-right: 0\9;border: none;vertical-align: middle;}
button,
input[type=button],
input[type=submit]							{cursor: pointer;font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;}
input:focus,
select:focus,
textarea:focus								{border-color: #5ca9e4;box-shadow: 0 0 0 2px rgba(70,161,231,0.3),0 1px 2px rgba(0,0,0,0.2) inset;}
input::placeholder 							{color: #CCC;}

/* common
------------------------------------------------------------------------------*/
* 											{font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;line-height: 1.75;}
html 										{overflow: auto;}
body 										{overflow: hidden;font-size: 4.375vw;}
img 										{max-width: 100%;height: auto !important;vertical-align: bottom;}
.container 									{position: relative;}

/* component
------------------------------------------------------------------------------*/
.btn										{display: block;overflow: hidden;position: relative;width: 100%;margin: 1em auto;padding: 1em 0 1.25em;background-color: #009944;border: none;box-shadow: 0 -0.5em 0 rgba(0,0,0,0.2) inset;color: #fff !important;letter-spacing: 2px;text-align: center;text-decoration: none !important;text-shadow: 1px 1px 1px rgba(0,0,0,0.3);-webkit-border-radius: 0.5em;-moz-border-radius: 0.5em;border-radius: 0.5em;}
.btn:hover									{filter: alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}
[class~="btn"][class*="small"]				{font-size: 85%;}
[class~="btn"][class*="large"]				{font-size: 120%;}
[class~="btn"][class*="accent"]				{background-color: #00BCD1;}
[class~="btn"][class*="gray"]				{background-color: #999;color: #FFF;}
span.btn									{background-color: #CCC;box-shadow: 0 0 0 rgba(0,0,0,0);}
span.btn:hover								{filter: alpha(opacity=100);-moz-opacity: 1;opacity: 1;}
a.btn 										{color: #FFF !important;}
h2 											{margin: 1.5em -15px 1em -15px;padding: 0.5em 15px;background: #DF2A11;color: #FFF;font-size: 1.4em;font-weight: bold;line-height: 1.25;text-align: left;}
h2 a 										{color: #FFFF00;text-decoration: underline;}
h2 a:hover 									{color: #FFFF00;text-decoration: none;}
h3,
h4 											{margin: 1.5em auto 1em;color: #DF2A11;font-weight: bold;line-height: 1.25;}
h3 											{padding:0 0 0.3em 0;border-bottom: 5px solid #DF2A11;font-size: 1.3em;}
h4 											{font-size: 1.1em;}
p 											{margin: 1em auto;}
ul 											{}
table.table 								{background: #FFF;border: 1px solid #DFDFDF;border-top: none;}
table.table tbody th,
table.table tbody td 						{display: block;padding: 4%;border: none;vertical-align: baseline;}
table.table tbody th 						{border-top:1px solid #DFDFDF;border-bottom:1px solid #DFDFDF;vertical-align:middle;}
table.table tbody td 						{border-top:none;}
.req 										{display: inline-block;padding: 0 5px;background: #c00;color: #FFF;font-weight: normal;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.opt 										{display: inline-block;padding: 0 5px;background: #999;color: #FFF;font-weight: normal;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.resp 										{position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden;max-width:100%;height:auto;}
.resp iframe,
.resp object,
.resp embed									{position:absolute;top:0;left:0;width:100%;height:100%;}

/* contents
------------------------------------------------------------------------------*/
header 										{padding: 10px 0 0 0;background: #DF2A11;}
header nav 									{margin: 0 0 30px 0;padding: 0 15px;}
header .logo 								{height: 40px;margin: 0 !important;padding: 0;}
header .logo a 								{line-height: 1;}
header .logo img 							{height: 100% !important;}
header h1.slab 								{margin: 0.5em 0;padding: 0;color: #FFF;font-weight: bold;line-height: 1;}
header .patent 								{position: absolute;top: 5px;right: 0px;border: 1px solid #FFF;line-height: 1;height: 30px;padding: 8px;font-size: 12px;color: #FFF;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.containerAction 							{position: relative;width:100%;height: 0;margin: 1em 0;padding-top: 120%;background: url(../images/bgActionSP.png?ver=11111) no-repeat 0 0;background-size: contain;}
.containerAction a.btnTrial 				{position: absolute;top: 60%;left: 7.5%;display: block;width: 85%;height: 16.66666%;background: none: contain;text-indent: -9999px;}
.containerAction a.btnTrial:hover 			{background-image: none;}
.containerAction .number 					{position: absolute;top: 80%;left: 5%;width: 90%;text-align: center;}
.containerAction .number a.btnNumber 		{display: block;color: #318111;font-family: 'Anton', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans Japanese", "游ゴシック  Medium", "Yu Gothic Medium", "メイリオ", meiryo, sans-serif;font-size: 2em;letter-spacing: 0;line-height: 1;text-decoration: none;}
.containerAction .number a.btnNumber span 	{display: inline-block;margin: 0 0.5em 0 0;padding: 0.5em;background: #318111;border-radius: 5px;color: #FFF;font-size: 0.5em;line-height: 1;vertical-align: bottom;}
.containerAction .number .time 				{display: block;margin: 1% 0 0 0;font-size: 0.75em;}
.containerEntry 							{margin: 2em 0 0;padding: 2em 0 4em;background: #FADFDB;}
.containerEntry .containerForm 				{}
.containerEntry .containerForm table.table 	{margin-bottom: 0;}
footer 										{padding: 5em 0;background: #DF2A11;color: #FFF;}

/* customize
------------------------------------------------------------------------------*/
.slab 										{display: block;width: 100%;margin-right: auto;margin-left: auto;padding-right: 0px;padding-left: 0px;}
.lead 										{font-size: 125%;}
.recaptcha > div							{margin: 0 auto;}
.g-recaptcha								{transform:scale(0.675);-webkit-transform:scale(0.675);transform-origin:0 0;-webkit-transform-origin:0 0;}

@media (max-width:768px) {
	header 										{position: relative;min-height: 60px;padding: 10px 0 0 0;background: #DF2A11;}
	header nav 									{position: absolute;top: 10px;left: 0;width: 100%;margin: 0;padding: 0 15px;}
	header > .container 						{padding-top: 60px;}
	.priceTable									{overflow-x: auto;width: 100%;font-size: 0.7em;}
	.priceTable table							{width: 170%;padding: 0;margin: 0;background: #fff;border-collapse: separate;border-spacing: 0;border-top: 1px solid #ddd;}
	.priceTable table th 						{font-weight: bold;}
	.priceTable table td,
	.priceTable table th						{width: 16.66666%;padding: 5px 0;background-color: #fff;border-right: 1px solid #ddd;border-bottom: 1px solid #ddd;}
	.priceTable table td:first-child,
	.priceTable table th:first-child 			{position: -webkit-sticky;position: sticky;z-index: 9999;left: 0;min-width: 16.66666%;max-width: 16.66666%;width: 16.66666%;border-left: 1px solid #ddd;font-weight: bold;}
	.priceTable table td:nth-child(2),
	.priceTable table th:nth-child(2)			{position: -webkit-sticky;position: sticky;z-index: 9999;left: 28.5%;min-width: 16.66666%;max-width: 16.66666%;width: 16.66666%;font-weight: bold;}
	.priceTable table th,
	.priceTable table td						{text-align: center;}
	.priceTable table tr:nth-of-type(odd) td,
	.priceTable table tr:nth-of-type(odd) th 	{background-color: #f6f6f6;}
	.priceTable table tr:first-child th 		{background: #DF2A11;color: #FFF;}
	a.bannerManga 								{display:block;position: fixed;left: 5px;bottom: 5px;z-index: 9999;width: 30%;}
	a.bannerManga img 							{width: 100%;}
	footer 										{padding: 2em 0 5em;background: #DF2A11;color: #FFF;}
	.nav 										{display: none;}

}

@media (min-width:769px) {

	/* common
	------------------------------------------------------------------------------*/
	body 										{overflow: hidden;font-size: 18px;}

	/* component
	------------------------------------------------------------------------------*/
	.btn										{display: block;overflow: hidden;position: relative;width: 100%;margin: 1em auto;padding: 1em 0 1.25em;background-color: #009944;border: none;box-shadow: 0 -0.5em 0 rgba(0,0,0,0.2) inset;color: #fff !important;letter-spacing: 2px;text-align: center;text-decoration: none !important;text-shadow: 1px 1px 1px rgba(0,0,0,0.3);-webkit-border-radius: 0.5em;-moz-border-radius: 0.5em;border-radius: 0.5em;}
	.btn:hover									{margin: 1.25em auto 1em;padding: 1em 0 1em;box-shadow: 0 3.5em 0 rgba(0,0,0,0.5) inset;}
	[class~="btn"][class*="small"]				{font-size: 85%;}
	[class~="btn"][class*="large"]				{font-size: 150%;}
	[class~="btn"][class*="accent"]				{background-color: #00BCD1;}
	[class~="btn"][class*="gray"]				{background-color: #999;color: #FFF;}
	span.btn									{background-color: #CCC;box-shadow: 0 0 0 rgba(0,0,0,0);}
	span.btn:hover								{filter: alpha(opacity=100);-moz-opacity: 1;opacity: 1;}
	a.btn 										{color: #FFF !important;}
	h2 											{margin: 1em 0;padding: 30px;background: #DF2A11;color: #FFF;font-size: 2.5em;font-weight: bold;text-align: center;}
	h3,
	h4,
	h5 											{margin: 1.5em auto 1em;color: #DF2A11;font-weight: bold;}
	h3 											{padding:0 0 15px 0;border-bottom: 5px solid #DF2A11;font-size: 2em;}
	h4 											{font-size: 1.5em;}
	h5 											{font-size: 1.2em;}
	p 											{margin: 1em auto;}
	ul 											{}
	table.table 								{background: #FFF;border: 1px solid #DFDFDF;}
	table.table tbody th,
	table.table tbody td 						{display: table-cell;padding: 20px;vertical-align: baseline;}
	table.table tbody th 						{border: 1px solid #DFDFDF;}
	table.table tbody td 						{border: 1px solid #DFDFDF;}
	.req 										{display: inline-block;padding: 0 5px;background: #c00;color: #FFF;font-weight: normal;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
	.opt 										{display: inline-block;padding: 0 5px;background: #999;color: #FFF;font-weight: normal;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}

	/* contents
	------------------------------------------------------------------------------*/
	header 										{padding: 10px 0 0 0;background: #DF2A11;}
	header nav 									{margin: 0;padding:0 0 10px 0;}
	header .logo 								{height: 50px;margin: 0 !important;padding: 0;}
	header .logo a 								{line-height: 1;}
	header .logo img 							{height: 100% !important;}
	header .call 								{height: 50px;padding: 0 0 0 35px;background: url(../images/bgCall.png) no-repeat left top;background-size: contain;}
	header .call .number 						{color: #FFF;font-family: Impact;font-size: 36px;letter-spacing: 1px;line-height: 38px;vertical-align: top;}
	header .call .time 							{color: #FFF;font-size: 12px;line-height: 12px;vertical-align: top;}
	header h1.slab 								{margin: 10px 0 0 0;padding: 0;color: #FFF;font-weight: bold;line-height: 1;}
	header .patent 								{position: absolute;top: 5px;left: 230px;right: auto;height: 35px;padding: 10px;border: 1px solid #FFF;color: #FFF;font-size: 15px;line-height: 1;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
	header > .container 						{padding-top: 30px;}
	.containerAction 							{position: relative;height: 0;margin: 50px 0;padding-top: 40%;background: url(../images/bgActionPC.png?ver=111111) no-repeat 0 0;background-size: contain;}
	.containerAction a.btnTrial 				{position: absolute;top: 37%;left: 50%;display: block;width: 46%;height: 32.5%;background: url(../images/bgBtnTrialOff.png?ver=1111) no-repeat 0 0;background-size: contain;text-indent: -9999px;}
	.containerAction a.btnTrial:hover 			{background-image: url(../images/bgBtnTrialOn.png?ver=11111);}
	.containerAction .number 					{position: absolute;top: 75.5%;left: 50%;width: 46%;text-align: center;}
	.containerAction .number a.btnNumber 		{display: block;color: #318111;font-family: Impact;font-size: 2em;line-height: 1;text-decoration: none;}
	.containerAction .number a.btnNumber span 	{display: inline-block;margin: 0 10px 0 0;padding: 0.5em;background: #318111;border-radius: 5px;color: #FFF;line-height: 1;vertical-align: bottom;}
	.containerAction .number .time 				{display: block;margin: 0.5% 0 0 0;font-size: 0.8em;}
	.containerEntry 							{margin: 50px 0 0;padding: 50px 0 100px;background: #FADFDB;}
	.containerEntry .containerForm 				{padding: 30px;background: #FFF;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
	.containerEntry .containerForm table.table 	{margin-bottom: 0;}
	.containerEntry .containerForm table th 	{width: 30%;}

	/* customize
	------------------------------------------------------------------------------*/
	.slab 										{display: block;width: 750px;}
	.lead 										{font-size: 200%;}
	.priceTable									{overflow-x: auto;width: 100%;font-size: 0.7em;}
	.priceTable table							{width: 100%;padding: 0;margin: 0;background: #fff;border-collapse: separate;border-spacing: 0;border-top: 1px solid #ddd;}
	.priceTable table th 						{font-weight: bold;}
	.priceTable table td,
	.priceTable table th						{width: 16.66666% !important;padding: 10px;background-color: #fff;border-right: 1px solid #ddd;border-bottom: 1px solid #ddd;}
	.priceTable table td:first-child,
	.priceTable table th:first-child			{position: -webkit-sticky;position: sticky;z-index: 9999;left: 0;border-left: 1px solid #ddd;font-weight: bold;}
	.priceTable table th,
	.priceTable table td						{text-align: center;}
	.priceTable table tr:nth-of-type(odd) td,
	.priceTable table tr:nth-of-type(odd) th 	{background-color: #f6f6f6;}
	.priceTable table tr:first-child th 		{background: #DF2A11;color: #FFF;}
	.bannerManga 								{position: fixed;right: 10px;bottom: 60px;z-index: 9999;width: 150px;height: 150px;}
	.bannerManga img 							{width: 100%;height: 100%;}
	.nav 										{background: #b9230e;color: #FFF;}
	.nav.is-fixed 								{position: fixed;top: 0;left: 0;z-index: 99999;width: 100%;}
	.nav .innerNav 								{max-width: 1000px;margin: 0 auto;display: table;table-layout: fixed;text-align: center;width: 100%;}
	.nav .innerNav .navLink 					{list-style: none;display: table-cell;vertical-align: middle;}
	.nav .innerNav .navLink a 					{display: block;padding: 1em 0;color: #FFF;}
	.nav .innerNav .navLink a:hover 			{background: #901b0b;text-decoration: none;}
	.blank 										{height: 2em;}
}


@media (min-width:992px) {

	/* customize
	------------------------------------------------------------------------------*/
	.slab 										{width: 970px;}
	h2 span 									{width: 970px;}

}

@media (min-width:1200px) {

	.container {position: relative;width: 1000px;}

	/* customize
	------------------------------------------------------------------------------*/
	.slab 										{width: 1000px;}
	h2 span 									{width: 1000px;}

}

