@charset "utf-8";
/*++++++++++++++++++++++++++++++
+++++++++++++++
++++++

==不動産格差本用スタイル==

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




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

^111
==スタイルリセット==
（CSSスタイルのデフォルトリセット）
normalize.css 使用

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


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary {display: block}

/* Corrects inline-block display not defined in IE8/9. */
audio,canvas,video {display: inline-block;}

/* Prevents modern browsers from displaying 'audio' without controls */
audio:not([controls]) { display: none; height: 0;}

/* Addresses styling for 'hidden' attribute not present in IE8/9. */
[hidden] {display: none;}


/* =============================================================================
   Base
   ========================================================================== */

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;}

/* Removes default margin. */
body { margin: 0;}

h1,h2,h3,h4,h5,h6,p,ul,ol,dl,table,pre { margin: 0;}


/* =============================================================================
   Links
   ========================================================================== */

/* Addresses `outline` inconsistency between Chrome and other browsers. */
a:focus { outline: thin dotted;}

/* Improves readability when focused and also mouse hovered in all browsers. */
a:hover,a:active { outline: 0;}


/* =============================================================================
   Typography
   ========================================================================== */

/* Addresses `h1` font sizes within `section` and `article` in Firefox 4+, Safari 5, and Chrome. */
h1,h2,h3,h4,h5 { line-height:1.25em; margin:0.3em 0 0.15em 0;}

/* 禁則処理の追加 */
p,li,dt,dd,th,td,pre{
	-ms-line-break: strict;
	line-break: strict;
	-ms-word-break: break-strict;
	word-break: break-strict}

/*Addresses styling not present in IE 8/9, Safari 5, and Chrome.*/
abbr[title] { border-bottom : 1px dotted;}

/* Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.*/
b, strong { font-weight : bold;}

/*Addresses styling not present in Safari 5 and Chrome.*/
dfn { font-style: italic;}

/*Addresses styling not present in IE 8/9.*/
mark { background: #ff0; color: #000;}

/* Corrects font family set oddly in Safari 5 and Chrome.*/
code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em;}

/*Improves readability of pre-formatted text in all browsers.*/
pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;}


/*Sets consistent quote types.*/
q { quotes: “\201C” “\201D” “\2018” “\2019”;}

/*Addresses inconsistent and variable font size in all browsers.*/
small { font-size: 80%;}

/*Prevents `sub` and `sup` affecting `line-height` in all browsers.*/
sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;}

sup { top: -0.5em;}
sub { bottom: -0.25em;}


/*=================================================================
   Embedded content
=================================================================*/

/*Removes border when inside `a` element in IE 8/9.*/
img {
	max-width :100%;
	height:auto;
	vertical-align: middle;
	border: 0;}

/* IE8 max-widthバグへの対応 uaにてie8時はbodyにクラス名を付ける */
/* .ie8 img{width: auto; height: auto} */

/* Corrects overflow displayed oddly in IE 9.*/
svg:not(:root) { overflow: hidden;}


/* =============================================================================
   Figures
   ========================================================================== */

/*Addresses margin not present in IE6/7/8/9, S5, O11*/
figure {margin: 0}


/* =============================================================================
   Forms
   ========================================================================== */

/* Define consistent border, margin, and padding*/
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;}

/* 1. Corrects color not being inherited in IE 8/9.
 2. Remove padding so people aren’t caught out if they zero out fieldsets. */
legend {
    border: 0; /* 1 */
    padding: 0; /* 2 */}

/* 1. Corrects font family not being inherited in all browsers.
 * 2. Corrects font size not being inherited in all browsers.
 * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome */
button, input, select, textarea {
	font-family: inherit;
	font-size: 100%;
	margin: 0;}

/*Addresses Firefox 4+ setting `line-height` on `input` using `!important` in  the UA stylesheet.*/
button,input {line-height: normal;}

/* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`  and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type `input` and others. */
button,
input[type="button"],  /* 1 */
input[type="reset"], 
input[type="submit"] {
	-webkit-appearance: button; /* 2 */
	cursor: pointer; /* 3 */}

/*Re-set default cursor for disabled elements. */
button[disabled],
input[disabled] {cursor: default;}

/* 1. Addresses box sizing set to content-box in IE8/9
 * 2. Removes excess padding in IE8/9*/
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */}

/* 1. Addresses appearance set to searchfield in S5, Chrome
 * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof) */
input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;}

/* Removes inner padding and search cancel button in Safari 5 and Chrome
 * on OS X. */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none}

/* Removes inner padding and border in Firefox 4+. */
button::-moz-focus-inner,
input::-moz-focus-inner { border: 0; padding: 0;}

/* 1. Removes default vertical scrollbar in IE 8/9.
 * 2. Improves readability and alignment in all browsers. */
textarea {
	overflow: auto; /* 1 */
	vertical-align: top; /* 2 */}


/* =============================================================================
   Tables
   ========================================================================== */

/* Remove most spacing between table cells */
table {
    border-collapse: collapse;
    border-spacing: 0;}







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

^222
==初期スタイル記述==
（初期スタイルを記述しなおす）

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


/* =============================================================================
   Typography
   ========================================================================== */

html {
	font-size: 100%;
	color: #0a0406;
    font-family: 'ヒラギノ角ゴ Pro W3',"Hiragino Kaku Gothic Pro","Yu Gothic","Meiryo",sans-serif;}

h1 { font-size: 1.75em;}
h2 { font-size: 1.6em;}
h3 { font-size: 1.35em;}
h4 { font-size: 1.25em;}
h5 { font-size: 1em;}
h6 { font-size: 1em;}

p,dt,dd,li,th,td,caption{ font-size:1em; line-height:1.75em; letter-spacing:0.05em;}

p { padding:0.5em 0;}

a { color:#007fe0; text-decoration:underline; }
a:hover { color:#0066b3; text-decoration:none; }
a:focus { color:#0066b3; }

a.decoChg { text-decoration:underline; }
a.decoChg:hover { text-decoration:none; }


a[href$=".pdf"]:before{
	content: '\f1c1';
	font-size:18px;
	color:#D30003;
	display:inline-block;
	font-family: "FontAwesome";
	margin-right:10px;
	top:1px;
    position: relative;}

a.imgOver:hover img{
	zoom: 1;  
    opacity: .50; /* Standard: FF gt 1.5, Opera, Safari */
    filter: alpha( opacity=50 ); /* IE lt 8 */
    -ms-filter: "alpha(opacity=50)"; /* IE 8 */
    -khtml-opacity: .50; /* Safari 1.x */
    -moz-opacity: .50; /* FF lt 1.5, Netscape */
}

a.imgOver2:hover img{
	zoom: 1;  
    opacity: .80; /* Standard: FF gt 1.5, Opera, Safari */
    filter: alpha( opacity=80 ); /* IE lt 8 */
    -ms-filter: "alpha(opacity=80)"; /* IE 8 */
    -khtml-opacity: .80; /* Safari 1.x */
    -moz-opacity: .80; /* FF lt 1.5, Netscape */
}

a.bgOver:hover {
	zoom: 1;  
    opacity: .50; /* Standard: FF gt 1.5, Opera, Safari */
    filter: alpha( opacity=50 ); /* IE lt 8 */
    -ms-filter: "alpha(opacity=50)"; /* IE 8 */
    -khtml-opacity: .50; /* Safari 1.x */
    -moz-opacity: .50; /* FF lt 1.5, Netscape */
}

ul,ol { padding:0.5em 0 0.5em 2%; list-style:inside;}
ul {}
ol {}

dl { padding:0 0 0.5em 0;}
dt { font-size:1.25em; font-weight:bold; border-bottom:2px solid #E8E8E8; display:inline-block; padding-top:0.5em; padding-bottom:0.1em; margin-bottom:0.5em;}
dd { margin-left:0;}

hr { background-color: #ddd; border: 0; clear:both;	height: 1px; margin:2em 1em 3em 1em;}

.video-container { position:relative; margin:0 0 0.5em 0; padding-bottom: 56.25%; padding-top:30px; height:0; overflow:hidden;}
.video-container iframe,
.video-container object,
.video-container embed { position:absolute; top:0; left:0; width:100%; height:100%;}

span.under { padding: 0 5px; margin: 0 5px; font-weight:bold; background:linear-gradient(transparent 65%, #ffb2c8 65%);}
span.under2 { padding: 0 5px; margin: 0 5px; font-weight:bold; background:linear-gradient(transparent 65%, #fe3a3a 65%);}



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

^333
==レイアウトスタイル==
（ヘッダー・フッター等のスタイル）

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

/* =============================================================================
   汎用スタイル
   ========================================================================== */

body {}
.clear:after {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearbefore {
	clear:both;}
.wrap {
	width:1400px;
	margin:0 auto;}
.smpBr { display:none;}
.smpBox { display:none;}
.smphide {}
.dispMobi { display:none;}
@media only screen and (max-width: 1399px) {
	body {
		font-size:90%;}
	.wrap {
		width:92%;
		margin:0 4%;}
}
@media only screen and (max-width: 768px) {
	.wrap {
		width:100%;
		margin: 0 auto;}
	.dispMobi {
		display:block;}
	.smphide {
		display:none;}
}

.fontyumin {
    font-family: 游明朝, YuMincho, 'Yu Mincho', "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}

/*
fonticon
a:before {
	font-family: FontAwesome;
	content:"\f1fa";
	text-indent:1px;}
*/

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

^444
==コンテンツスタイル==
（コンテンツの基本スタイル）

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




.mainHead {
	background: #000;}
.mainHead figure img {
	display: block;
  margin: auto;}
.mainHead figure img:nth-child(-n+2) {
	max-width: 16%;
  padding: 20px 0;}
@media only screen and (max-width: 768px) {
.mainHead figure img:nth-child(-n+2) {
    max-width: 25%;
  padding: 10px 0;}
}



section h2.title {
	background: url(img/content/warau-book/sos2.png) repeat center center;
	text-align: center;
	margin: 0;
	line-height: 1.0;
	padding: 40px 0;
	font-size: 3em;
	color: #FFF;}
section.sec02 h2.title {
	background: url(img/content/warau-book/sos.png) repeat center center;
	color: #c33;
  letter-spacing: 0.125em;}
section.sec03 header {
  background: url(img/content/warau-book/sos2.png) repeat center center;
	text-align: center;
	margin: 0;
	line-height: 1.0;
	padding: 40px 0;
  font-weight: normal;
  letter-spacing: 0.25em;
  color: #FFF;}
section.sec03 header .inner {
    padding: 0;}
section.sec03 header h2.title {
  font-weight: normal;
  letter-spacing: 0.25em;
  background: none;
  padding: 0;}
section.sec03 header figure img {
    padding: 20px 0 10px 0;}

section.sec06,section.sec06 h2.title {
	background: url(img/content/warau-book/sos3.png) repeat center center;
  padding-bottom: 40px;}
section.sec06 .inner {
	background: #fff;
  margin-bottom: 30px;}
section.sec06 .inner:last-child {
  margin-bottom: 0;}
section h2.title span {
	font-size: 0.6em;}
section .inner {
	width: 1120px;
	margin: 0 auto;
	padding: 40px 0;}
@media only screen and (max-width: 1399px) {
	section h2.title {
		padding: 30px 0;}
	section .inner {
		width: 92%;
		padding: 30px 0;}
}
@media only screen and (max-width: 768px) {
	section h2.title,section.sec03 header h2.title {
		font-size: 2.4em;}
}
@media only screen and (max-width: 426px) {
	section h2.title,section.sec03 header {
		padding: 15px 0;}
	section h2.title {
		font-size: 1.3em;}
	section h2.title,section.sec03 header h2.title {
    font-size: 2em;
    letter-spacing: 0.125em;}
  section.sec03 header figure img:first-child {
    max-width: 25%;}
  section.sec03 header figure img:last-child {
    max-width: 50%;}
	section h2.title span {
		font-size: 0.8em;}
	section .inner {
		padding: 15px 0;}
}



.catch {
	background: url(img/content/warau-book/bg_catch.jpg) repeat center center;
	font-size: 1.6em;
	padding: 40px 0;
	text-align: center;}
.catch h1 {
	text-shadow: 2px 2px 8px rgba(0, 0 , 0, 0.2);
	margin: 0;
	line-height: 200%;}
.catch h1 span.second {
	font-size: 1.2em;}
.catch h1 span.third {
	font-size: 1.4em;}
@media only screen and (max-width: 1399px) {
	.catch h1 span.third {
		font-size: 1.2em;}
}
@media only screen and (max-width: 768px) {
	.catch {
		padding: 30px 0;
		font-size: 1.2em;}
}
@media only screen and (max-width: 426px) {
	.catch {
		padding: 15px 0;
		font-size: 1.0em;}
	.catch h1 {
		font-size: 1.0em;}
	.catch h1 span.second {
		font-size: 1.2em;}
	.catch h1 span.third {
		font-size: 1.1em;}
}




.snsarea {}
.snsarea .btn {
	padding: 35px 0;}
.snsarea .btn a {
	display: block;
	background: #eab000;
	border-radius: 10px;
	padding: 20px 0;
	color: #FFF;
	width: 80%;
	margin: 0 auto;
	font-size: 1.4em;
	font-weight: bold;
	text-decoration: none;
	text-align: center;}
.snsarea .btn a:before {
	font-family: FontAwesome;
	content: "\f078";
	font-weight: normal;
	font-size: 1em;
	margin-right: 0.7em;}
.snsarea .btn a:after {
	font-family: FontAwesome;
	content: "\f078";
	font-weight: normal;
	font-size: 1em;
	margin-left: 0.7em;}
.snsarea .sns.servicesns {
	border-top:1px solid #DDD;
	background: #FFF;}
.snsarea nav.sns ul {
    list-style:none;
    margin: 0;
    padding: 0;}
.snsarea nav.sns ul li {
	float: left;
	padding: 0;
	border:1px solid #DDD;
	border-right:none;
	border-top: none;
	line-height:1;
    color: #666;
	width: 33.3%;
	box-sizing: border-box;
    text-align:center;
    letter-spacing: normal;}
.snsarea nav.sns ul li:last-child{
	width: 33.4%;
	border-right:1px solid #DDD;}
.snsarea nav.sns ul li a{
	text-decoration:none;
    color:#FFF;
    padding:16px 0 20px 0;
    display:block;}
.snsarea nav.sns ul li.twitter a{ color:#33ccff;}
.snsarea nav.sns ul li.twitter a:hover{ color:#FFF; background-color:#33ccff;}
.snsarea nav.sns ul li.facebook a{ color:#3b5998;}
.snsarea nav.sns ul li.facebook a:hover{ color:#FFF; background-color:#3b5998;}
.snsarea nav.sns ul li.googleplus a{ color:#da4c36;}
.snsarea nav.sns ul li.googleplus a:hover{ color:#FFF; background-color:#da4c36;}
.snsarea nav.sns ul li a i{
	font-style:normal;
	font-size:1.5em;
	vertical-align: -2px;
	margin-right:5px;}
.snsarea nav.sns ul li a span{
	font-size: 0.9em;}
.snsarea nav.sns ul li a:hover span{
	color:#FFF;}
.snsarea nav.sns ul li.hatebu a i:before{
	line-height:1;
	content: "B!";
	font-family:Verdana;
	font-weight:bold;}
@media only screen and (max-width: 768px) {
	.snsarea nav.sns ul li a{
		padding:16px 0;}
	.snsarea .btn a {
		padding: 15px 0;}
	.snsarea .btn a:before {
		content: "";}
	.snsarea .btn a:after {
		content: "";}
}
@media only screen and (max-width: 426px) {
	.snsarea .btn {
		padding: 20px 0;}
	.snsarea .btn a {
		padding: 15px 0;
		width: 96%;
		font-size: 1em;}
}




.sec02 {
	background: #efefef;}
.sec02 figure {
	width: 300px;
	float: left;}
.sec02 .text {
	width: 780px;
	float: right;}
.sec02 .text header {}
.sec02 .text header h3 {
	font-size: 4em;
	margin: 0;
	padding-bottom: 5px;
	border-bottom: 2px solid #0a0406;}
.sec02 .text header p {
	font-size: 3em;
	font-weight: bold;
	line-height: 1.4;
	padding: 0;}
.sec02 .text .release {
	font-size: 3em;
	color: #cb0006;
	font-weight: bold;}
.sec02 .text footer {
	display: table;
	width: 100%;}
.sec02 .text footer p {
	display: table-cell;
	vertical-align: middle;}
.sec02 .text footer .btn {
	display: table-cell;
	text-align: right;
	vertical-align: middle;}

.sec02 .text .sns.servicesns {
	border-top:1px solid #DDD;
	background: #FFF;
	margin-top: 15px;}
.sec02 .text nav.sns ul {
    list-style:none;
    margin: 0;
    padding: 0;}
.sec02 .text nav.sns ul li {
	float: left;
	padding: 0;
	border:1px solid #DDD;
	border-right:none;
	border-top: none;
	line-height:1;
    color: #666;
	width: 33.3%;
	box-sizing: border-box;
    text-align:center;
    letter-spacing: normal;}
.sec02 .text nav.sns ul li:last-child{
	width: 33.4%;
	border-right:1px solid #DDD;}
.sec02 .text nav.sns ul li a{
	text-decoration:none;
    color:#FFF;
    padding:16px 0 20px 0;
    display:block;}
.sec02 .text nav.sns ul li.twitter a{ color:#33ccff;}
.sec02 .text nav.sns ul li.twitter a:hover{ color:#FFF; background-color:#33ccff;}
.sec02 .text nav.sns ul li.facebook a{ color:#3b5998;}
.sec02 .text nav.sns ul li.facebook a:hover{ color:#FFF; background-color:#3b5998;}
.sec02 .text nav.sns ul li.googleplus a{ color:#da4c36;}
.sec02 .text nav.sns ul li.googleplus a:hover{ color:#FFF; background-color:#da4c36;}
.sec02 .text nav.sns ul li.pocket a{ color:#c0392b;}
.sec02 .text nav.sns ul li.pocket a:hover{ color:#FFF; background-color:#c0392b;}
.sec02 .text nav.sns ul li.hatebu a{ color:#008fde;}
.sec02 .text nav.sns ul li.hatebu a:hover{ color:#FFF; background-color:#008fde;}
.sec02 .text nav.sns ul li.line a{ color:#25af00;}
.sec02 .text nav.sns ul li.line a:hover{ color:#FFF; background-color:#25af00;}
.sec02 .text nav.sns ul li.rss a{ color:#ffb53c;}
.sec02 .text nav.sns ul li.rss a:hover{ color:#FFF; background-color:#ffb53c;}
.sec02 .text nav.sns ul li.feedly a{ color:#87c040;}
.sec02 .text nav.sns ul li.feedly a:hover{ color:#FFF; background-color:#87c040;}
.sec02 .text nav.sns ul li a i{
	font-style:normal;
	font-size:1.5em;
	vertical-align: -2px;
	margin-right:5px;}
.sec02 .text nav.sns ul li a span{
	font-size: 0.9em;}
.sec02 .text nav.sns ul li a:hover span{
	color:#FFF;}
.sec02 .text nav.sns ul li.hatebu a i:before{
	line-height:1;
	content: "B!";
	font-family:Verdana;
	font-weight:bold;}

@media only screen and (max-width: 1399px) {
	.sec02 figure {
		width: 40%;}
	.sec02 .text {
		width: 57%;}
	.sec02 .text .release {
		line-height: 1.4;
		padding: 10px 0;}
}
@media only screen and (max-width: 768px) {
	.sec02 .text header h3 {
		font-size: 3.0em;}
	.sec02 .text header p {
		font-size: 2.0em;}
	.sec02 .text .release {
		font-size: 2.4em;}
	.sec02 .text footer .btn {
		width: 30%;}
	.sec02 .text .sns.servicesns {
		margin-top: 10px;}
	.sec02 .text nav.sns ul li a{
		padding:16px 0;}
}
@media only screen and (max-width: 426px) {
	.sec02 figure {
		width: 50%;
		float: none;
		margin: 0  auto 10px auto;}
	.sec02 .text {
		width: 100%;
		float: none;}
	.sec02 .text header h3 {
		font-size: 2em;}
	.sec02 .text header p {
		font-size: 1.6em;}
	.sec02 .text .release {
		font-size: 1.6em;}
	.sec02 .text footer .btn {
		width: 30%;}
	.sec02 .text footer {
		display: block;}
	.sec02 .text footer p {
		display: block;}
	.sec02 .text footer .btn {
		display: block;
		width: 60%;
		padding: 10px 0;
		margin: 0 auto;}
}





.sec03 {}
.sec03 h3 {
	font-size: 2.4em;
	margin: 0 0 10px 0;
	display: table;
	text-align: center;
	white-space: nowrap;}
.sec03 h3:after, .sec03 h3:before {
	content: '';
	display: table-cell;
	width: 50%;
	background: -webkit-linear-gradient(transparent 50%, currentColor 50%, currentColor -webkit-calc(50% + 1px), transparent -webkit-calc(50% + 1px));
	background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, currentColor), color-stop(currentColor calc(50% + 1px)), to(transparent calc(50% + 1px)));
	background: linear-gradient(transparent 50%, currentColor 50%, currentColor calc(50% + 1px), transparent calc(50% + 1px));
	-webkit-background-clip: padding;
	background-clip: padding;}
.sec03 h3:after {
	border-left: 1em solid  transparent;}
.sec03 h3:before {
	border-right: 1em solid transparent;}
.sec03 table {
	font-size: 1.4em;}
.sec03 table th {
	padding: 10px 30px;
	width: 40%;
	text-align: right;}
.sec03 table td {
	padding: 10px 30px;
	width: 60%;}
.sec03 .tit {
	font-weight: bold;
	font-size: 2em;
	margin-top: 20px;
	padding-bottom: 0;
	text-align: center;}
.sec03 .tit span {
	font-weight: bold;
	color: #cb0006;}
@media only screen and (max-width: 768px) {
	.sec03 table {
		font-size: 1.2em;}
	.sec03 table th {
		padding: 5px 20px;
		width: 30%;}
	.sec03 table td {
		padding: 5px 20px;
		width: 70%;}
	.sec03 .tit {
		margin-top: 10px;
		font-size: 1.8em;}
}
@media only screen and (max-width: 426px) {
	.sec03 h3 {
		font-size: 1.8em;
		margin: 0 0 5px 0;}
	.sec03 table {
		font-size: 0.95em;}
	.sec03 table th {
		padding: 5px 0;
		width: auto;
		text-align: left;}
	.sec03 table td {
		padding: 5px 0;
		width: 80%;}
	.sec03 .tit {
		margin-top: 5px;
		font-size: 0.95em;}
}

.sec03 .readbox .inner {
	width: 900px;
	padding-bottom: 60px;}
.sec03 .readbox .inner h4 {
	font-size: 1.6em;
	margin: 1.8em 0 0.4em 0;}
.sec03 .readbox .inner h4:first-child {
	margin-top: 0.5em;}
.sec03 .readbox .inner figure {
	text-align: center;
	padding: 20px 0;}
@media only screen and (max-width: 1399px) {
	.sec03 header h2 {
		font-size: 4em;}
}
@media only screen and (max-width: 768px) {
	.sec03 header h2 {
		font-size: 3.4em;}
	.sec03 .viewbtn {
		padding: 10px 0;}
	.sec03 .viewbtn .btn span {
		font-size: 2.0em;}
	.sec03 .readbox .inner {
		width: 92%;
		padding-bottom: 50px;}
}
@media only screen and (max-width: 426px) {
	.sec03 header .inner {
		padding: 10px 0;}
	.sec03 header h3 {
		font-size: 1.8em;}
	.sec03 header h2 {
	margin: 0;
		font-size: 2.4em;}
	.sec03 .viewbtn .btn span {
		font-size: 1.2em;}
	.sec03 .viewbtn .btn span:before {
		font-size: 0.8em;
		margin-right: 0.5em;}
	.sec03 .viewbtn .btn span:after {
		font-size: 0.8em;
		margin-left: 0.5em;}
	.sec03 .readbox .inner {
		width: 96%;
		padding-bottom: 30px;}
	.sec03 .readbox .inner h4 {
		font-size: 1.4em;
		margin: 1.8em 0 0.2em 0;}
	.sec03 .readbox .inner figure {
		padding: 10px 0;}
}



.sec04 {}
section.sec04 h2.title {
	background: url(img/content/warau-book/sos5.png) repeat center center;}
section.sec04 .inner {
	padding: 60px 0 40px 0;}
.sec04 .inbox {
	background: url(img/content/warau-book/sos6.png) repeat center center;
	border-radius: 5px;
	font-size: 1.2em;
	color: #FFF;
	margin-bottom: 50px;
	position: relative;
	padding: 30px;}
.sec04 .inbox:last-child {
	margin-bottom: 0;}
.sec04 .inbox .ico {
	position: absolute;
	right: -40px;
	text-align: right;
	top: -20px;}
.sec04 .inbox h3 {
	font-size: 2em;
	margin: 0 0 20px 0;}
.sec04 .inbox h3 span {
	margin-right: 30px;}
.sec04 .inbox h3 span em {
	font-size: 1.6em;
	vertical-align: -10px;}
.sec04 .inbox h5 {
	text-align: center;
	margin-top: 15px;}
.sec04 .inbox h5 a {
	padding: 0 5px;
	color: #FFF;}
.sec04 .inbox figure {
	float: left;
	width: 340px;}
.sec04 .inbox .text {
	float: right;
	width: 660px;}
.sec04 .inbox .text h4 {
	font-size: 1.6em;
	margin: 0 0 10px 0 ;}
.sec04 .inbox .text .address {
	line-height: 1.8;
	border-top: 1px solid #FFF;}
.sec04 .inbox .text .address strong {
	font-size: 1.2em;
	margin-left: 15px;
	vertical-align: -3px;}
.sec04 .inbox .text .examle_soudan {
	font-size: 0.8em;}
.sec04 .inbox .gmap {
	clear: both;
	padding-top: 20px;
	width: 100%;}
.sec04 .inbox .gmap iframe {
	width: 100%;}

.sec04 .inbox .balloon {
	position: relative;
	display: inline-block;
	padding: 30px 0;
	border-radius: 60%;
	margin-bottom: 30px;
	line-height: 2;
	width: 100%;
	box-sizing: border-box;
	color: #0a0406;
	border: 5px solid #da1a1a;
	text-align: center;
	background: #FFF;
	z-index: 0;}
.sec04 .inbox .balloon:before {
	content: "";
	position: absolute;
	bottom: -21px; left: 50%;
	margin-left: -22px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 22px 30px 0 30px;
	border-color: #FFF transparent transparent transparent;
	z-index: 0;}
.sec04 .inbox .balloon:after {
	content: "";
	position: absolute;
	bottom: -28px; left: 50%;
	margin-left: -28px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 28px 36px 0 36px;
	border-color: #da1a1a transparent transparent transparent;
	z-index: -1;}
.sec04 .inbox .navlink {
	padding-top: 20px;}
.sec04 .inbox .navlink a {
	display: block;
	background: #eab000;
	border-radius: 10px;
	padding: 20px 0;
	color: #FFF;
	width: 80%;
	border: 2px solid #FFF;
	margin: 0 auto;
	font-size: 1.4em;
	font-weight: bold;
	text-decoration: none;
	text-align: center;}

.sec04 .inbox .tokuten {
	border: 2px solid #FFF;
	font-size: 2.4em;
	font-weight: bold;
	color: #FFF;
	text-align: center;}
.sec04 .inbox .tokuten span {
	font-size: 0.7em;
    vertical-align: 5px;
    margin-right: 10px;}
.sec04 .inbox .tokuten strong {
	font-size: 1.4em;
    vertical-align: -5px;
    margin-left: 10px;}
@media only screen and (max-width: 1399px) {
	.sec04 .inbox figure {
		float: left;
		width: 32%;}
	.sec04 .inbox .text {
		float: right;
		width: 65%;}
	.sec04 .inbox .ico img {
		width: 70%;}
}
@media only screen and (max-width: 769px) {
	section.sec04 .inner {
		padding: 30px 0 20px 0;}
	.sec04 .inbox {
		padding: 15px;}
	.sec04 .inbox h3 {
		font-size: 1.8em;}
	.sec04 .inbox figure {
		float: left;
		width: 25%;}
	.sec04 .inbox .text {
		float: right;
		width: 72%;}
	.sec04 .inbox .ico {
		right: -20px;
		top: -10px;}
	.sec04 .inbox .ico img {
		width: 40%;}
	.sec04 .inbox .balloon {
		padding: 30px 15px;
		border-radius: 60px;}
	.sec04 .inbox .tokuten {
		font-size: 1.8em;}
}
@media only screen and (max-width: 426px) {
	section.sec04 .inner {
		width: 96%;}
	.sec04 .inbox {
		font-size: 1em;
		margin-bottom: 30px;}
	.sec04 .inbox .ico {
		right: 0;
		top: -15px;}
	.sec04 .inbox .ico img {
		width: 30%;}
	.sec04 .inbox figure {
		float: none;
		width: 50%;
		margin: 0 auto 10px auto;}
	.sec04 .inbox .text {
		float: none;
		width: 100%;}
	.sec04 .inbox .text .address strong {
		font-size: 1.0em;
		margin-left: 5px;
		vertical-align: 0;}
	.sec04 .inbox .balloon {
		padding: 15px 10px;
		border-radius: 30px;}
	.sec04 .inbox h3 {
		font-size: 1.6em;
		margin: 0 0 10px 0;}
	.sec04 .inbox h3 span {
		margin-right: 10px;
		display: block;}
	.sec04 .inbox h3 span em {
		font-size: 1.4em;
		vertical-align: -3px;}
	.sec04 .inbox .tokuten {
		font-size: 1.6em;}
	.sec04 .inbox .tokuten span {
		vertical-align: 0;
		margin-right: 5px;}
	.sec04 .inbox .tokuten strong {
		vertical-align: 0;
		margin-left: 5px;
		font-size: 1.2em;}
}






.sec05 {}
section.sec05 h2.title {
	background: url(img/content/warau-book/sos3.png) repeat center center;}
.sec05 figure {
	width: 400px;
	float: left;}
.sec05 .text {
	width: 680px;
	float: right;}
.sec05 .text header {}
.sec05 .text header h3 {
	font-size: 3em;
	margin: 0 0 15px 0;
	padding-bottom: 5px;
	border-bottom: 2px solid #0a0406;}
.sec05 .text header h3 span {
	font-size: 0.7em;
	font-weight: normal;}
.sec05 .text header p {
	font-size: 3em;
	font-weight: bold;
	padding: 0;}
@media only screen and (max-width: 1399px) {
	.sec05 figure {
		width: 37%;}
	.sec05 .text {
		width: 60%;}
}
@media only screen and (max-width: 768px) {
	.sec05 figure {
		width: 50%;
		margin: 0 auto 20px auto;
		float: none;}
	.sec05 .text {
		width: 100%;
		float: none;}
	.sec05 .text header h3 {
		font-size: 2.4em;}
}
@media only screen and (max-width: 426px) {
	.sec05 figure {
		width: 60%;}
	.sec05 .text header h3 {
		font-size: 1.8em;
		margin: 0 0 5px 0;}
}





.sec06 {}
.sec06 header {
	background: url(img/content/warau-book/sos3.png) repeat center center;}
.sec06 header .inner {
	padding: 20px 0;}
.sec06 header h3 {
	color: #FFF;
	font-size: 2.4em;
	margin: 0 0 10px 0;
	display: table;
	text-align: center;
	white-space: nowrap;}
.sec06 header h3:after, .sec06 header h3:before {
	content: '';
	display: table-cell;
	width: 50%;
	background: -webkit-linear-gradient(transparent 50%, currentColor 50%, currentColor -webkit-calc(50% + 1px), transparent -webkit-calc(50% + 1px));
	background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, currentColor), color-stop(currentColor calc(50% + 1px)), to(transparent calc(50% + 1px)));
	background: linear-gradient(transparent 50%, currentColor 50%, currentColor calc(50% + 1px), transparent calc(50% + 1px));
	-webkit-background-clip: padding;
	background-clip: padding;}
.sec06 header h3:after {
	border-left: 1em solid  transparent;}
.sec06 header h3:before {
	border-right: 1em solid transparent;}
.sec06 header h2 {
	margin: 0 15%;
	text-shadow: 2px 2px 8px rgba(0, 0 , 0, 0.6);
	color: #FFF;
	font-size: 5em;}
.sec06 .viewbtn {
	padding: 10px 0;
	background: url(img/content/warau-book/sos4.png) repeat center center;}
.sec06 .viewbtn .inner {
	padding: 5px 0;}
.sec06 .viewbtn .btn {
	text-align: center;}
.sec06 .viewbtn .btn.selected {
	display: none;}
.sec06 .viewbtn .btn span {
	cursor: pointer;
	border: 1px solid #FFF;
	font-size: 2.4em;
	display: block;
	padding: 5px 0;
	color: #FFF;}
.sec06 .viewbtn .btn span:before {
	font-family: FontAwesome;
	content: "\f078";
	font-weight: normal;
	font-size: 1em;
	margin-right: 0.7em;}
.sec06 .viewbtn .btn span:after {
	font-family: FontAwesome;
	content: "\f078";
	font-weight: normal;
	font-size: 1em;
	margin-left: 0.7em;}
.sec06 .viewbtn p {
	color: #FFF;
	padding: 5px 0 0 0;
	text-align: center;}

.sec06 .quiz{
    color: #c00;
    font-size: 2em;
}

.sec06 .inner .inbox .quiz3taku{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -o-flex;
    display: flex;
    padding: 30px 0px;}
.sec06 .inner .inbox .quiz3taku:after{
    clear: both;
    display: block;
    content: "";}
.sec06 .inner .inbox .quiz3taku p{
    background: #c00;
    color: #fff;
    font-weight: bold;
    font-size: 1.75em;
    border-radius: 5px;
    width: 32%;
    text-align: center;
    float: left;
    margin-right: 2%;
    border: 5px solid #c00;
    box-sizing: border-box;}
.sec06 .inner .inbox .quiz3taku p:active,.sec06 .inner .inbox .quiz3taku p.selected{
    background: #fff;
    color: #c00;}
.sec06 .inner .inbox .quiz3taku p:last-child{
    margin-right: 0;}
.sec06 .inner .inbox .quiz3taku p.selected

.sec06 .inner .inbox .quiz3taku p.selected.correct {
    background: #ddd;
}

.mes_wrong ,.mes_correct{
    text-align: center;
    font-weight: bold;
    font-size: 1.5em;
}
.mes_wrong:before ,.mes_correct:before{
    margin: 0 0 0 20px;
    content: " ";
    display: inline-block;
    width: 66px;
    height: 66px;
    background-size: contain;
    vertical-align: middle;
    position: relative;
    top: -2px;
}

.mes_wrong:before{
	  background: url(img/content/warau-book/X.png) no-repeat top left;}
.mes_correct:before{
	  background: url(img/content/warau-book/O.png) no-repeat left center;}

.sec06 .readbox {}
.sec06 .inner .readbox, .sec06 .inner .inbox:first-child {
    width: 90%;
  	max-width: 900px;
    margin: auto;}
.sec06 .inner .readbox h4 {
	font-size: 1.6em;
	margin: 1.8em 0 0.4em 0;}
.sec06 .inner .readbox h4:first-child {
	margin-top: 0.5em;}
.sec06 .inner .readbox h4 span {
  font-size: 0.75em;}
.sec06 .inner .readbox figure {
	text-align: center;
	padding: 20px 0;}
@media only screen and (max-width: 1399px) {
	.sec06 header h2 {
		font-size: 4em;}
  .sec06 .quiz{
    font-size: 1.5em;
    }
}
@media only screen and (max-width: 768px) {
	.sec06 header h2 {
		font-size: 3.4em;}
	.sec06 .viewbtn {
		padding: 10px 0;}
	.sec06 .viewbtn .btn span {
		font-size: 2.0em;}
	.sec06 .inner .readbox {
		width: 92%;
		padding-bottom: 50px;}
  .sec06 .inner .inbox .quiz3taku p{
    font-size: 1.25em;}
   .sec06 .inner .inbox:first-child{
    width: 92%;}
.sec06 .quiz{
    font-size: 1.35em;
    }
}
@media only screen and (max-width: 426px) {
	.sec06 header .inner {
		padding: 10px 0;}
	.sec06 header h3 {
		font-size: 1.8em;}
	.sec06 header h2 {
	margin: 0;
		font-size: 2.4em;}
	.sec06 .viewbtn .btn span {
		font-size: 1.2em;}
	.sec06 .viewbtn .btn span:before {
		font-size: 0.8em;
		margin-right: 0.5em;}
	.sec06 .viewbtn .btn span:after {
		font-size: 0.8em;
		margin-left: 0.5em;}
	.sec06 .inner .readbox {
		width: 96%;
		padding-bottom: 30px;}
   .sec06 .inner .inbox:first-child{
        width: 96%;}
	.sec06 .inner .readbox h4 {
		font-size: 1.4em;
		margin: 1.8em 0 0.2em 0;}
	.sec06 .inner .readbox figure {
		padding: 10px 0;}  
  .sec06 .inner .inbox .quiz3taku p{
    font-size: 1em;}
}




/*特典映像*/
.sec04 {}
.sec04 .passarea {
	border-radius: 5px;
	background: #f8f5eb;
	border: 2px solid #E30003;
	padding: 10px 20px 20px 20px;}
.sec04 .passarea input[type=text] {
	width: 40% !important;
	float: left;}
.sec04 .passarea input[type=submit] {
	width: 20% !important;
	float: left;}
.sec04 .iframeWrapper{
	position: relative;
	width: 80%;
	padding-top: 48%;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom:40px;}
.sec04 .iframeWrapper iframe,
.sec04 .iframeWrapper video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;}





.sec07 {
	background: url(img/content/warau-book/motif.jpg) repeat;}
.sec07 h2 {
	margin: 0 0 20px 0;
	text-align: center;
	font-size: 3em;}
.sec07 .letter {
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 28px;
    position: relative;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 15px;}
.sec07 .letter .cornerTop {
    background-image: url(img/content/warau-book/bord_haut.png);
    background-repeat: no-repeat;
    width: 123px;
    height: 71px;
    position: absolute;
    top: -20px;
    right: -35px;}
.sec07 .letter .cornerBottom {
    background-image: url(img/content/warau-book/bord_bas.png);
    background-repeat: no-repeat;
    width: 123px;
    height: 71px;
    position: absolute;
    bottom: -20px;
    left: -35px;}
.sec07 .letter .datas {}
.sec07 .letter .datas p {
	font-size: 1.2em;}
.sec07 .letter .datas p.name {
	text-align: right;
	font-weight: bold;}
@media only screen and (max-width: 768px) {
.sec07 {
	background: url(img/content/warau-book/motif.jpg) repeat;
	background-size: 100px auto;}
.sec07 h2 {
	font-size: 2.4em;}
.sec07 .letter {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 14px;
    padding-bottom: 14px;}
.sec07 .letter .cornerTop {
    background-image: url(img/content/warau-book/bord_haut.png);
	background-size: 62px auto;
    background-repeat: no-repeat;
    width: 61px;
    height: 35px;
    position: absolute;
    top: -10px;
    right: -18px;}
.sec07 .letter .cornerBottom {
    background-image: url(img/content/warau-book/bord_bas.png);
	background-size: 62px auto;
    background-repeat: no-repeat;
    width: 61px;
    height: 35px;
    position: absolute;
    bottom: -10px;
    left: -18px;}
.sec07 .letter .datas p {
	font-size: 1em;}

}
@media only screen and (max-width: 426px) {
.sec07 h2 {
	font-size: 1.3em;}
.sec07 .letter {
	margin-top: 15px;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;}

}






#globalFoot {
	padding:30px 0 40px 0;
	border-top:5px solid #0066b3;}
#globalFoot .wrap {
	display:table;}
#globalFoot h4 {
	vertical-align:middle;
	display:table-cell;}
#globalFoot h4 a {
	display:block;
	text-indent:-9999px;
	background:url(img/content/warau-book/logo_sakura.png) no-repeat left center;
	background-size:190px auto;
	width:200px;
	height:30px;}
#globalFoot p.copy {
	font-size:0.725em;
	vertical-align:middle;
	display:table-cell;}
#globalFoot ul.subNav {
	display:table-cell;
	vertical-align:middle;
	margin:0;
	padding:0;
	list-style:none;}
#globalFoot ul.subNav li {
	float:right;
	padding:0 5px;}
#globalFoot ul.subNav li a {
	font-size:0.8em;}
@media only screen and (max-width: 768px) {
	#globalFoot ul.subNav {
		display: none;}
}
@media only screen and (max-width: 426px) {
	#globalFoot {
		padding:15px 0 20px 0;}
	#globalFoot .wrap {
		display:block;}
	#globalFoot h4 {
		text-align: center;
		display:block;}
	#globalFoot h4 a {
		margin: 0 auto;}
	#globalFoot p.copy {
		text-align: center;
		display:block;}
}










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

^555
==汎用スタイル==
（よく使うであろうスタイルを記述）

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


/* float 指定
------------------------------------------*/
.imgLeft {
    float: left;
	margin:0.5em 1em 2em 0;}
.imgRight {
    float: right;
	margin:0.5em 0 2em 1em;}

/* padding 指定
------------------------------------------*/
.noPad { padding:0 !important;}
.pad5 { padding:5px !important;}
.pad10 { padding:10px !important;}
.pad15 { padding:15px !important;}
.pad20 { padding:20px !important;}
.padT5 { padding-top:5px !important;}
.padT10 { padding-top:10px !important;}
.padT15 { padding-top:15px !important;}
.padT20 { padding-top:20px !important;}
.padT30 { padding-top:30px !important;}
.padT40 { padding-top:40px !important;}
.padT50 { padding-top:50px !important;}
.padR5 { padding-right:5px !important;}
.padR10 { padding-right:10px !important;}
.padR15 { padding-right:15px !important;}
.padR20 { padding-right:20px !important;}
.padR30 { padding-right:30px !important;}
.padR40 { padding-right:40px !important;}
.padR50 { padding-right:50px !important;}
.padB5 { padding-bottom:5px !important;}
.padB10 { padding-bottom:10px !important;}
.padB15 { padding-bottom:15px !important;}
.padB20 { padding-bottom:20px !important;}
.padB30 { padding-bottom:30px !important;}
.padB40 { padding-bottom:40px !important;}
.padB50 { padding-bottom:50px !important;}
.padL5 { padding-left:5px !important;}
.padL10 { padding-left:10px !important;}
.padL15 { padding-left:15px !important;}
.padL20 { padding-left:20px !important;}
.padL30 { padding-left:30px !important;}
.padL40 { padding-left:40px !important;}
.padL50 { padding-left:50px !important;}

/* margin 指定
------------------------------------------*/
.noMar { margin:0 !important;}
.mar5 { margin:5px !important;}
.mar10 { margin:10px !important;}
.mar15 { margin:15px !important;}
.mar20 { margin:20px !important;}
.marT5 { margin-top:5px !important;}
.marT10 { margin-top:10px !important;}
.marT15 { margin-top:15px !important;}
.marT20 { margin-top:20px !important;}
.marR5 { margin-right:5px !important;}
.marR10 { margin-right:10px !important;}
.marR15 { margin-right:15px !important;}
.marR20 { margin-right:20px !important;}
.marB5 { margin-bottom:5px !important;}
.marB10 { margin-bottom:10px !important;}
.marB15 { margin-bottom:15px !important;}
.marB20 { margin-bottom:20px !important;}
.marL5 { margin-left:5px !important;}
.marL10 { margin-left:10px !important;}
.marL15 { margin-left:15px !important;}
.marL20 { margin-left:20px !important;}

/* font style
------------------------------------------*/
.fontRed { color:crimson;}
.fontRed2 { color:red;}
.fontBlue { color:#0066CC;}
.fontBlue2 { color:blue;}
.fontGreen { color:green;}
.fontYellow { color:gold;}
.fontYellow2 { color:yellow;}
.fontRem8 { font-size:12px; font-size:0.9rem;}
.fontRem10 { font-size:14px; font-size:1.0rem;}
.fontRem11 { font-size:15px; font-size:1.1rem;}
.fontRem12 { font-size:16px; font-size:1.2rem;}
.fontRem14 { font-size:18px; font-size:1.4rem;}
.fontRem16 { font-size:20px; font-size:1.6rem;}
.fontRem18 { font-size:22px; font-size:1.8rem;}
.fontBold { font-weight:bold;}
.textLeft { text-align:left;}
.textRight { text-align:right;}
.textCenter { text-align:center;}

/* フォームスタイル
------------------------------------------*/
form .inp100 { width:97%;}
form .inp90 { width:95%;}
form .inp70 { width:70%;}
form .inp50 { width:50%;}
form .inp30 { width:30%;}
form .inp10 { width:10%;}
form .imeActive { ime-mode: active; /* 全角モード */}
form .imeInactive { ime-mode: inactive; /* 半角モード */}
form input[type=text], form input[type=email], form input[type=number], form input[type=search], form input[type=tel], form input[type=url], form textarea{
	-webkit-appearance: none;
	font-size:16px;
	width:100%;
	box-sizing: border-box;
	line-height: 1.5em;
	font-family:"Lucida Grande","Lucida Sans Unicode","Lucida Sans",Arial,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',Osaka,"メイリオ",Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	border:1px solid #DDD;
	padding:3px;}
form input[type=number]{
	width:10%;}
form label{
	display:block;
	padding:2px 0;}
form input[type=checkbox], form input[type=radio]{
	vertical-align:0;
	margin-right:5px;}
form .btn{
	text-align:center;}
form .btn input[type=submit]{
	cursor:pointer;
	margin:0 auto;}
form input[type=text].inpDisabled {
	border:none;
	padding:0;
	background:none;
	font-weight:bold;}

form tr.hiddenTr {
	display:none;}

form.sent table {
	display:none;}

.ui-timepicker-div dl dt {
	font-size: 0.825em;
	font-weight: normal;
	border-bottom: none;
	padding: 0 0 0 5px;
	margin-bottom: 0;}



.formbox {
	border-radius: 5px;
	background: #efe9d8;
	padding: 30px;}
.formbox h3 {
	text-align: center;
	margin-top: 0;
	margin-bottom: 20px;
	font-size: 1.8em;}
.formbox p.text {
	display: block;
	border: 1px solid #cb0006;
	background: #FFF;
	padding: 10px;
	margin-bottom: 10px;
	font-weight: bold;}
.formbox p.text strong {
	color: #cb0006;}

.formbox table { width: 100%;}
.formbox table th, .formbox table td { vertical-align:middle; padding:10px 15px; box-sizing: border-box; border:1px solid #c4c4c4; background:#FFF;}
.formbox table thead th, .formbox table thead td { text-align:center; background:#EDEDED; font-weight:bold;}
.formbox table th { background:#f2f2fb;}
.formbox table th span { font-size: 0.8em;}


@media only screen and (max-width: 426px) {
.formbox {
	padding: 30px 15px;}
.formbox h3 {
	margin-bottom: 15px;
	font-size: 1.4em;}
	.formbox table {
	border-bottom : 1px solid #c4c4c4;}
	.formbox table th,.formbox table td{
		text-align:left;
		width:auto;
		border-bottom: 0;
		display:block;}
}


.mouse {
  animation: mouse_frame 5s linear 0s infinite;
}


@keyframes mouse_frame {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    1.25% {transform: translate(1px, 1px) rotateZ(8deg)}
    2.5% {transform: translate(0px, 1px) rotateZ(0deg)}
    3.75% {transform: translate(1px, 0px) rotateZ(-8deg)}
    5% {transform: translate(1px, 1px) rotateZ(8deg)}
    6.25% {transform: translate(0px, 1px) rotateZ(-8deg)}
    7.5% {transform: translate(0px, 0px) rotateZ(0deg)}
    8.75% {transform: translate(1px, 1px) rotateZ(8deg)}
    13.75% {transform: translate(0px, 0px) rotateZ(0deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}