/*
Theme Name: tomosankaku-review
Theme URI: https://www.tomosankaku.com
Version:2.2.1
*/

/*
 * リセット
 * ----------------------------------------------------------------------------*/
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
}
article,aside,details,
figcaption,figure,
footer,header,nav,
section,summary {
	display: block;
}
audio,canvas,video {
	display: inline-block;
}
audio:not([controls]) {
	display: none;
	height: 0;
}
[hidden] {
	display: none;
}
html {
	font-size: 100%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
html,button,input,select,textarea {
	font-family:"ヒラギノ角ゴシック","ヒラギノ角ゴ Pro", "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic","游ゴシック",YuGothic,"游ゴシック体",メイリオ,Meiryo,"ＭＳ Ｐゴシック",Osaka,"MS PGothic",Arial,Helvetica,Verdana,sans-serif;;
}
body {
	background-color:#000;
	color: #bfbfbf;
	line-height: 1.5;
	margin: 0;
}
a {
	color: #bfbfbf;
	text-decoration: none;
}
a:visited {
	color: #70593f;
}
a:focus {
	outline: thin dotted;
}
a:active,
a:hover {
	color: #ea9629;
	outline: 0;
}
a:hover {
	text-decoration: underline;
}
h1,h2,h3,h4,h5,h6 {
	clear: both;
	line-height: 1;
	margin:0;
	padding: 0;
}
abbr[title] {
	border-bottom: 1px dotted;
}
b,strong {
	font-weight: bold;
}
dfn {
	font-style: italic;
}
mark {
	background: #ff0;
	color: #000;
}
p {
	margin: 0 0 24px;
}
pre {
	background: #f5f5f5;
	color: #666;
	font-family: monospace;
	font-size: 14px;
	margin: 20px 0;
	overflow: auto;
	padding: 20px;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}
blockquote,q {
	quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}
blockquote {
	font-size: 15px;
	margin: 20px;
}
blockquote blockquote {
	margin-right: 0;
}
blockquote cite,
blockquote small {
	font-size: 14px;
	font-weight: normal;
	text-transform: uppercase;
}
blockquote em,
blockquote i {
	font-style: normal;
	font-weight: 300;
}
blockquote strong,
blockquote b {
	font-weight: 400;
}
small {
	font-size: smaller;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {
	top: -0.5em;
}
sub {
	bottom: -0.25em;
}
dl {
	margin: 0 20px;
}
dt {
	font-weight: bold;
}
dd {
	margin: 0 0 20px;
}
menu,ol,ul {
	padding:0;
	margin:0;
}
ul {
	list-style-type: square;
}
nav ul,
nav ol {
	list-style: none;
	list-style-image: none;
}
li > ul,
li > ol {
	margin: 0;
}
img {
	border: 0;
	vertical-align: middle;
}
svg:not(:root) {
	overflow: hidden;
}
figure {
	margin: 0;
}
form {
	margin: 0;
}
fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}
legend {
	border: 0;
	padding: 0;
	white-space: normal;
}
button,input,select,textarea {
	font-size: 100%;
	margin: 0;
	max-width: 100%;
	vertical-align: baseline;
}
button,input {
	line-height: normal;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}
button[disabled],
input[disabled] {
	cursor: default;
}
input[type="checkbox"],
input[type="radio"] {
	padding: 0;
}
input[type="search"] {
	-webkit-appearance: textfield;
	padding-right: 2px;
	width: 270px;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}
textarea {
	overflow: auto;
	vertical-align: top;
}
table {
	border-bottom: 1px solid #ededed;
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 14px;
	line-height: 2;
	margin: 0 0 20px;
	width: 100%;
}
caption,th,td {
	font-weight: normal;
	text-align: left;
}
caption {
	font-size: 16px;
	margin: 20px 0;
}
th {
	font-weight: bold;
	text-transform: uppercase;
}
td {
	border-top: 1px solid #ededed;
	padding: 6px 10px 6px 0;
}
del {
	color:#70593f;
}
ins {
	background: #fff9c0;
	text-decoration: none;
}
/*
button,
input,
textarea {
	border: 2px solid #d4d0ba;
	font-family: inherit;
	padding: 5px;
}
input,
textarea {
	color: #333333;
}
input:focus,
textarea:focus {
	border: 2px solid #c3c0ab;
	outline: 0;
}
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	background: #e05d22;
	border: none;
	border-bottom: 3px solid #b93207;
	border-radius: 2px;
	color: #fff;
	display: inline-block;
	padding: 11px 24px 10px;
	text-decoration: none;
}
button:hover,
button:focus,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus {
	background: #ed6a31;
	outline: none;
}
button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
	background: #d94412;
	border: none;
	border-top: 3px solid #b93207;
	padding: 10px 24px 11px;
}
*/
embed,
iframe,
object,
video {
	max-width: 100%;
}

#header {
	position: relative;
	max-width: 980px;
	margin:0 auto 5px;
	overflow: hidden;
}
#review {
	max-width: 580px;
	background-color:#1f1f1f;
	border-radius:10px;
	margin: 20px auto;
	overflow: hidden;
}
.rh {
	text-align: center;
}
h1 {
	text-align: center;
	color: #e8e8e8;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	margin: 1.5em 0;
}
#review h2 {
	color: #e8e8e8;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	margin: 1.5em 0 0;
	text-align: center;
}
#review .rh p {

}

.review-form,
.formwrap {
	width:90%;
	margin: 0 auto;
}
.review-form span {
	width:100%;
	display: block;
	background-color:#151515;
	margin-bottom:.5em;
	padding:.5em 1em;
}
.review label {
	display: block;
	font-size:15px;
}
.review input[type="radio"] {
	margin-right:.25em;
}
.review-submit {
	overflow: hidden;
	text-align:right;
	margin:15px 0 20px;
}
.review input[type="submit"],
.review input[type="button"],
.review input[type="reset"] {
	float: right;
	font-size: 14px;
	color: #8ab4f8;
	width: 40%;
  display: inline-block;
  background-color:#1f1f1f;
  border: 1px solid #5F6368;
  border-radius: 4px;
  text-decoration: none;
  padding:.5em 0;
}
.review input[type="submit"]:hover,
.review input[type="button"]:hover {
	color:#a5c7fd;
	border: 1px solid #6F757B;
}

.review-link {
	display: block;
	overflow: hidden;
	text-align:center;
	margin:15px 0 20px;
}
.review-link a {
	float: right;
	font-size: 14px;
	color: #8ab4f8;
	width: 60%;
  display: inline-block;
  background-color:#1f1f1f;
  border: 1px solid #5F6368;
  border-radius: 4px;
  text-decoration: none;
  padding:.5em 0;
}
.review-link a:hover {
	color:#a5c7fd;
	border: 1px solid #6F757B;
}



table#rating {
  border: none;
  font-size: 20px;
  line-height:1;
}
#rating tr {
}
#rating td,
#rating th {
  border: none;
  margin: 0;
  padding:0;
}
#rating th {
  width: 50%;
  font-size:20px;
  font-weight: 400;
  padding: 20px 0;
}
#rating td {
	position: relative;
  padding: 20px 0;
  font-weight: 400;
  text-align: left;
}

#starA,
#starB,
#starC  {
  position: relative;
}
#starA .wpcf7-list-item,
#starB .wpcf7-list-item,
#starC .wpcf7-list-item {
  position: absolute;
  top: 0;
  left: 0;
}
#starA input[type='radio'],
#starB input[type='radio'],
#starC input[type='radio'] {
  position: absolute;
  opacity: 0;
}
#starA .wpcf7-list-item-label,
#starB .wpcf7-list-item-label,
#starC .wpcf7-list-item-label  {
  color: #ccc;
  font-size:30px;
  letter-spacing: .5em;
  cursor: pointer;
}
#starA .wpcf7-list-item:hover .wpcf7-list-item-label,
#starA .wpcf7-list-item:hover ~ .wpcf7-list-item .wpcf7-list-item-label,
#starA .wpcf7-list-item.checked .wpcf7-list-item-label,
#starA .wpcf7-list-item.checked ~ .wpcf7-list-item .wpcf7-list-item-label,
#starB .wpcf7-list-item:hover .wpcf7-list-item-label,
#starB .wpcf7-list-item:hover ~ .wpcf7-list-item .wpcf7-list-item-label,
#starB .wpcf7-list-item.checked .wpcf7-list-item-label,
#starB .wpcf7-list-item.checked ~ .wpcf7-list-item .wpcf7-list-item-label,
#starC .wpcf7-list-item:hover .wpcf7-list-item-label,
#starC .wpcf7-list-item:hover ~ .wpcf7-list-item .wpcf7-list-item-label,
#starC .wpcf7-list-item.checked .wpcf7-list-item-label,
#starC .wpcf7-list-item.checked ~ .wpcf7-list-item .wpcf7-list-item-label {
  color: #fc0;
}
.rating-textarea textarea {
	width: 100%;
  margin-bottom:1em;
  background-color:#1f1f1f;
  border: 1px solid #6F757B;
  border-radius: 4px;
  color: #bfbfbf;
  padding: 1em;
}
#review .wpcf7-list-item {
	margin: 0;
}
#review .wpcf7-not-valid-tip {
	color: #dc3232;
  font-size: 12px;
  font-weight: normal;
  display: block;
  position: absolute;
  width:200px;
  bottom: -25px;
}
#review .wpcf7 form .wpcf7-response-output {
	margin: 2em 0 1em;
}
#review .wpcf7 form.invalid .wpcf7-response-output {
	border-color:#8ab4f8;
}



.popup {
display: none;
width: 100%;
height: 100%;
overflow: auto;
}
.content {
background-color: #fefefe;
margin: 5% auto;
padding: 20px;
border: 1px solid #888;
border-radius: 10px;
width: 85%;
}
.content p {
  color: #555;
}
.content img {
  width: 100%;
  height: auto;
}
.content .time {
  text-align: center;
}
.closebox {
  width: 50%;
  margin: 0 auto;
  text-align: center;
  border: 1px solid #ddd;
  border-radius: 4px;
  cursor: pointer;
}
.close {
text-align: center;
display: block;
padding: .5em;
}
#thanksPopup h2 {
  color:#ff5050;
  font-size: 20px;
  margin-block: 1em;
}





/**
 * フッター
 * ----------------------------------------------------------------------------
 */
#footer {
	clear: both;
	width: 100%;
}
.copyright address {
	text-align: center;
	font-size: 10px;
	font-style: normal;
	margin:5rem 0 1rem;
}


/**
 * 8.0 Media Queries
 * ----------------------------------------------------------------------------
 */
@media screen and (max-width: 767px) {
body,
#header {
  min-width:100%;
  width: 100%;
}
h1,
#review h2 {
	font-size: 15px;
}
#review {
	max-width: 94%;
}
p {
	font-size:16px;
}
table#rating {
	font-size: 18px;
}
#rating th {
	width: 30%;
	font-size: 18px;
}
#starA .wpcf7-list-item-label, #starB .wpcf7-list-item-label, #starC .wpcf7-list-item-label {
	font-size: 24px;
}
.rating-textarea textarea {
	font-size: 16px;
	padding: .5em;
}
}