/*
Theme Name: Generic
Theme URI: https://generic.tools/
Author: Web Guy
Author URI: https://webguy.io/
Description: A fully responsive, SEO-ready, schema-ready, social-media-ready, accessibility-ready, translation-ready, and jQuery-ready starter theme for designers and developers, which comes with its own built-in, lightweight CSS grid (https://generic.tools/grid/). This generic/starter/clean/simple/bare/blank/minimalist/example/cheatsheet/white-label/HTML5/CSS3/base/foundation/framework/skeleton/boilerplate/whatever theme was created specifically as a tool to assist you with building client sites virtually from scratch or building your own themes. It's updated to reflect new standards and trends in web design to provide a solid foundation for features that every website is expected to support nowadays, but please post bug reports, suggestions for improvement, or support requests on GitHub (https://github.com/webguyio/generic-theme/issues) if you're getting jammed up. The biggest point of discussion would be the semi-minification of Generic's code. This simplicity, like the omission of comments in the code is intentional. If you prefer formatting, you're welcome to format the code any way you like. If I was able to help you out, consider making a donation (https://webguy.io/donate). Thank you and enjoy!
Tags: accessibility-ready, one-column, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready, blog, e-commerce, portfolio
Version: 2.0.2
Requires at least: 5.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v3 or Later
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: generic

Generic WordPress Theme © 2015-2025 GenericTools
Generic is distributed under the terms of the GNU GPL
*/

#wrapper{
 margin: 0px; !important
}

#overlay{
  /*オーバーレイのCSS*/  
  position: fixed;
  top: 0;
  z-index: 100;
  width: 100vw;
  height:100vh;
  display: none;
  background: rgba(0,0,0,0.7);
}
.flex{
  /*オーバーレイ内の要素を上下・左右中央揃え*/
  width: 100%;
  height:100%;
  display: flex;
  justify-content: center;
  align-items: center; 
}
.overlay-inner{
  padding:10px 60px;
  background-color:#FFF;
  text-align:center;
}
.rakuten-info{	
	min-width:170px;
	padding:10px;
}
.rakuten-image{
}
a:link .rakuten-button{
	text-decoration:none;
} 

.rakuten-button{
	max-width:85%;
}
img{
	max-width:45vw;
}
#page{
	min-height:50vh;
}
a:visited{
}
a:link{
	color:#000;
}

a{
	text-indent:1em;
}
input:focus::-webkit-input-placeholder {
	color: transparent;
}
input:focus::-moz-placeholder {
	color: transparent;
}
input:focus::-ms-input-placeholder {
}
input:focus::placeholder {
	color: transparent;
}

html{
overflow-y: scroll;
overflow-x: hidden;
}
html,body{
min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-size:4vw;line-height:1.4em;margin:0
}
body{
	background-color: #f5f5f5; background-size:cover;
}
.site-title-bg{
	background:#006633;color:#fff;padding:5px
}
.site-description{
	    margin-top: 0px;
}
.site-title h1,.site-title p{
	display:inline-block;
	padding:0;
	margin:10 0 0 0;
}

.site-title h1 a{
	color:#fff;
	font-weight:700;
	text-decoration:none;
}
.custom-logo{
	display:block;
	position:absolute;
	left:50%;top:50%;
	-ms-transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
	max-width:100%;height:auto;
}
#colophon{
	width:100%;left:0;bottom:0; margin-top:2vh; padding:3vh 0;
	line-height: 3.5vh;
	text-align:center;color:#333;background-color:#666;}
#colophon a{text-decoration:none; color: #f0f0f0;}
/************************************
** 入力フォーム（Form）
************************************/
#from-ac0,#from-ac1,#from-ac2,#from-ac3,#from-ac4{
 width:57vw;
}

input[type="text"],
input[type="url"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="tel"],
textarea, select {
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
  color: #333;
  font-size: 4.5vw;
  line-height: 1.42857;
  padding: 6px 12px;
  transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
  box-sizing: border-box;
}
input[type="text"]{
  width:100%;
}
select{
	margin-right:2vw;
	display:inline;
}

input#author,
input#email,
input#url{
  max-width: 360px;
}

.gsc-search-box input[type="text"]{
  background-color:#FFF;
  border-radius: 0px;
}

#comment-area input[type="text"],
#comment-area textarea{
  display: block;
}

textarea {
  overflow: auto;
  width:100%;
  box-sizing: border-box;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
textarea:focus {
  border: 1px solid #ff69b4;
  background: #fff;
  box-shadow:  0 0 3px rgba(255,105,180,1);
   color: #444;
}

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  margin-bottom: 20px;
  padding: 8px 12px;
  border: 1px solid #777;
  border-radius: 20px;
  background: #fff;
  color: #333;
  text-decoration: none;
  font-weight: bold;
  line-height: normal;
  cursor: pointer;
  /* Old browsers */
}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
  background: #eee;

}

select, option{
  padding: 5px;
}

select:disabled{
	color:#ccc;
}

select{
  display:inline;
}

/*
select, option {
  margin: 0.5em 1px;
  padding: 3px 5px;
  vertical-align: middle;
}
#sidebar select{
  width: 100%;
}
*/
/*.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
  position: relative;
  top:1px;
}*/


ul,
li {
  list-style: none;
  display:inline;
  padding: 0;
}

/*
Pure CSS toggle buttons　Light
Copyright (c) 2018 Mauricio Allende　@mallendeo
Released under the MIT license
http://opensource.org/licenses/mit-license.php
*/

.tg-list {
  text-align: center;
  display: flex;
  align-items: center;
}

.tg-list-item {
  margin: 0 1vw;
}
.tgl {
  display: none;
}
.tgl, .tgl:after, .tgl:before, .tgl *, .tgl *:after, .tgl *:before, .tgl + .tgl-btn {
  box-sizing: border-box;
}
.tgl::-moz-selection, .tgl:after::-moz-selection, .tgl:before::-moz-selection, .tgl *::-moz-selection, .tgl *:after::-moz-selection, .tgl *:before::-moz-selection, .tgl + .tgl-btn::-moz-selection {
  background: none;
}
.tgl::selection, .tgl:after::selection, .tgl:before::selection, .tgl *::selection, .tgl *:after::selection, .tgl *:before::selection, .tgl + .tgl-btn::selection {
  background: none;
}
.tgl + .tgl-btn {
  display: block;
  width: 4em;
  height: 2em;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.tgl + .tgl-btn:after, .tgl + .tgl-btn:before {
  position: relative;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
}
.tgl + .tgl-btn:after {
  left: 0;
}
.tgl + .tgl-btn:before {
  display: none;
}
.tgl:checked + .tgl-btn:after {
  left: 50%;
}

.tgl-light + .tgl-btn {
  background: #999999;
  border-radius: 2em;
  padding: 2px;
  transition: all .4s ease;
}
.tgl-light + .tgl-btn:after {
  border-radius: 50%;
  background: #fff;
  transition: all .2s ease;
}
.tgl-light:checked + .tgl-btn {
  background: #9FD6AE;
}
.flex{
	display:flex;
}

#rt-over,#like-over{
	font-size:5vw;
	margin-left:0.5vw;
	line-height:8vw;
}
.only{
	font-size:4vw;
	margin-left:0.5vw;
	line-height:7vw;
}

#from-ac, #from-ac0, #from-ac1, #from-ac2, #from-ac3, #from-ac4, #to-ac{
	color:#999;
}
.from-ac:focus, #to-ac:focus{
	color:#222;
}

#lang-select{	
}
.center{
	margin: 0 auto;
	text-align:center;
	display: block;
}
.site-info{
	color:#f0f0f0;
}
.caution{
	font-size:3vw;
	text-align:center;
}

h4{
	font-size: 2vw;	
}

#search,#book-search{
	font-size:7vw;
	width:60vw;
	height:18vw;
	margin:3vh auto;
}

#share-url{
	font-size:3.2vw;
	color:#f0f0f0;
	width:60vw;
	height:18vw;
	margin:3vh auto;
	background-color:#009966
}
.rakuten{
	font-size:4vw;
	height:14vw;
	margin:2vh auto;
	width:85%;
	text-decoration:none;
}

#another{
	font-size:4vw;
	width:70vw;
	height:14vw;
	margin:3vh auto;
}

#isbn-copy{
	font-size:3.2vw;
	width:45vw;
	height:12vw;
	margin:3vh auto;
	color: #f0f0f0;
	background-color:#999;
}

#qHis,#oHis,#mHis{
	margin: 1.8em 0;
	font-size: 3.5vw;
}

#qHis-list, #oHis-list, #mHis-list{
	margin: 1vh 0;
}

#q-edit,#o-edit,#m-edit{
	font-size: 3vw;
	margin: 1vh 0;
}
.none{
	text-decoration:none;
}

@media screen and (min-aspect-ratio: 4/3) {
.rakuten{
	text-decoration:none;
} 
img{
	max-width:230px;
}
	
html,body{
min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-size:18px;line-height:1.4em;margin:0
}
#wrapper{
	width: 100%;
	margin: 0;
}
	
h4{
	font-size: 20px;	
}
	
input[type="text"],
input[type="url"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="tel"],
textarea, select {
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
  color: #333;
  display: block;
  font-size: 1.2em;
  line-height: 1.42857;
  padding: 6px 12px;
  transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
  box-sizing: border-box;
}
input[type="text"]{
  width:100%;
}

#from-ac0,#from-ac1,#from-ac2,#from-ac3,#from-ac4{
  width:55%;
}
select{
	margin-right:0.5em;
	margin-left:0.5em;
	display:inline;
	font-size:1em;
}
	
.only{
	font-size: 1.1em;
	margin-left: 0.6em;
	line-height:1.7em;
	}
#search,#book-search{
	font-size:32px;
	margin:30px auto;
	width:400px;
	height: 90px;
	}
	
#share-url{
	font-size:22px;
	margin:30px auto;
	width:400px;
	height: 90px;
	}
.rakuten{
	font-size:20px;
	margin:10px auto;
	width:80%;
	height: 60px;
}

#another{
	font-size:22px;
	margin:10px auto;
	width:440px;
	height: 70px;
	}
	
#isbn-copy{
	font-size:22px;
	margin:10px auto;
	width:300px;
	height: 60px;
	color: #f0f0f0;
	background-color:#999;
}
#rt-over,#like-over{
	font-size:1.2em;
	margin-left:0.5em;
	line-height:1.8em;
}
.caution{
	font-size:14px;
	text-align:center;
}
.site-title h1,.site-title p{
	font-size:3vh;
}
#qHis,#oHis,#mHis{
	font-size: 0.8em;
}	
#q-edit,#o-edit,#m-edit{
	font-size: 0.8em;
	margin: 1vh 0;
}