/*
	Theme Name: Simple Simple
	Description: Easy and Simple theme by <a href="http://webdesignrecipes.com/">Web Design Recipes</a>. WordPress 学習用のシンプルなテーマです。
	Theme URI: http://webdesignrecipes.com/first-time-wordpress-origin-theme/
	Author: Nori Takahashi
	Author URI: http://webdesignrecipes.com/
	Version: 1.0.1
	License: GNU General Public License
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	Tags: white, right-sidebar, two-columns

*/

/****************************************

          General Setting

*****************************************/
*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html, body {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    color: #333;
	font-size: 100%;
    font-family:
    	Verdana, Arial,
    	'ヒラギノ角ゴ Pro W3',
    	'Hiragino Kaku Gothic Pro',
    	Osaka,
    	'ＭＳ Ｐゴシック',
    	sans-serif;
    line-height: 160%;
}


/****************************************

          Typography

*****************************************/

h1, h2, h3, h4, h5, h6{
	font-weight: normal;
}

h1 {
	margin-left: 20px;
	margin-bottom: 10px;
	font-size: 100%;
	font-family: 'Josefin Sans', sans-serif;
}

blockquote{
	margin-bottom: 2em;
	margin-left: 20px;
	padding-left: 20px;
	border-left: 5px solid #ddd;
}


/****************************************

          List

*****************************************/

ul,ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul ul{
	margin-left: 1em;
}


/****************************************

          Link

*****************************************/




/****************************************

          Layout

*****************************************/

#container,
.wrapper {
	margin: 0 auto;
	width: 100%;
}

#header {
	display: block;
	width: 100%;
	margin-bottom: 20px;
	padding-top: 10px;

	background: rgba(255,255,255,0.7);
 
}
	#header .alignleft{
		width: 50%;
	}
	#header .alignright{
		width: 50%;
	}

#main {
	width: 100%;
	height:100%;
	display: table;
}

#sidebar {
	width: 250px;
}

#main,
#sidebar{

}

#footer {
	width: 100%;
	clear: both;
	background: #cb000b;
	color: #fff;
	text-align: center;

}


/****************************************

          header

*****************************************/

*:first-child+html #header > div{ /* IE7 */
	clear: both;
	zoom:1;
}

#logo img{
	width:33%;
}

#logo a{
	border: none;
}

#description {
	margin-top: 0;
	color: #777;
	padding-left: 20px;
	padding-bottom: 10px;
}

#searchform{
	position: relative;
	margin-top: 45px;
}
	#s{
		padding: 6px 20% 6px 5%;
		width: 75%;
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		border-radius: 25px; 
		font-size: 10px;
	}
	#searchsubmit{
		position: absolute;
		top: 0;
		right: 0;
		width: 30px;
		height: 26px;
		border: none;
		background: url(images/search.png) no-repeat 50% 50%;
	}


/****************************************

          Navigation

*****************************************/

#header .menu{
	position: relative;
	bottom: -1px;
	clear: both;
	margin-bottom: 0;
}
	#header div.menu > ul,
	#header ul.menu{
		border-left: 1px solid #ddd;
	}
	
	#header div.menu > ul > li,
	#header ul.menu > li{
		float: left;
	}

	#header .menu li{
		position: relative;
		border-top: 1px solid #ddd;
		border-right: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
	}
		#header .menu li a{
			display: block;
			padding: .5em 1em;
			border-bottom: none;
		}
		#header div.menu > ul > li.current_page_item,
		#header ul.menu > li.current_page_item{
			border-bottom: 1px solid #fff;
		}

		#header ul.sub-menu,
		#header ul.children{
			position: absolute;
			left:-1px;
			display: none;
			margin-left: 0;
			width: auto;
			width: 150px;
			border: 1px solid #ddd;
			background: #eee;
		}
			#header .sub-menu li,
			#header .children li{
				position: relative;
				border: none;
			}

			#header ul.sub-menu ul,
			#header ul.children ul {
				top:-1px;
				left:150px;
			}
				#header .menu li:hover > ul{
					display: block;
				}


/****************************************

          header image

*****************************************/

#header-image{
	margin-bottom: 40px;
}


/****************************************

          Breadcrumb

*****************************************/

#breadcrumb{
	margin-bottom: 20px;
}
#breadcrumb li{
	float: left;
	margin-right: .5em;
}


/****************************************

          Main

*****************************************/

#main .post,
#main .page{
	overflow: hidden;
	margin-bottom: 59px;
	border-bottom: 1px solid transparent;
}

.sticky{
	/* 先頭固定ポストのスタイル */
}

.post-meta{
	margin-bottom: 1.5em;
}
	.post-meta .post-date,
	.post-meta .category{
		padding-right: 1em;
	}
	.comment-num{ white-space: nowrap; }

.more-link{
	float: right;
}

.navigation{
	overflow: hidden;
	margin-bottom: 40px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	background: url(images/gray.gif) repeat-y 50% 0;
}
	.navigation > div{
		width: 50%;
	}

	.navigation .alignright{
		text-align: right;
	}

	.navigation a{
		display: block;
		padding: 1em;
		border: none;
	}
		.navigation a:hover{
			background: #ffeff7;
			color: #000;
		}
			.navigation .alignright a:hover{
				border-left: 1px solid #ddd;
			}

.footer-post-meta{
	margin-top: 40px;
	text-align: right;
}
	.post-author{ padding-left: 1em; }

.page-link{
	margin: 3em 0;
}
.comment-page-link{
	margin: 0 0 3em;
}

	.page-link span,
	.comment-page-link span,
	.comment-page-link a{
		display: inline-block;
		margin-right: 3px;
		padding: 5px 8px;
		border: 1px solid #ddd;
		background: #ddd;
	}
		.page-link a span,
		.comment-page-link a{
			background: #fff;
		}
	
	.page-link a{
		border-bottom: none;
		color: #000;
	}
	
	.page-link a span:hover,
	.comment-page-link a:hover{
		background: #ffeff7;
		color: #000;
	}

.item{
	border: 1px solid red;
}
/****************************************

          Comments Area

*****************************************/

#comment-area h3{
	font-size: 150%;
	font-family: 'Josefin Sans', sans-serif;
}

.required{ color: #fe56aa;}

.commets-list,
.trackback-list{
	overflow: hidden;
	margin-top: -20px;
	margin-bottom: 40px;
}
	.commets-list li,
	.trackback-list li{
		overflow: hidden;
		margin-top: -1px;
		padding: 20px 0 0;
		width: 100%;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid transparent;
	}
		.commets-list .avatar{
			float: left;
			margin-right: 10px;
			margin-bottom: 10px;
		}

		.comment-meta,
		.reply,
		.comment-notes,
		.form-allowed-tags,
		span.small{
			font-size: 80%;
		}

		.comment-body p{
			clear: both;
		}
		.reply{
			text-align: right;
		}

.bypostauthor{
	/* 記事投稿者のコメントのスタイル */
}

.children{
	padding-left: 2em;
}

#respond{
	margin-bottom: 40px;
}

/****************************************

          index.php Main

*****************************************/

.content-box{
	float: right;
	margin-top: -0.25em;
	width: 420px;
}
	.content-box .more-link{
		margin: 0;
	}

.thumbnail-box{
	float: left;
	width: 160px;
}
	.thumbnail-box img{
		width: 160px;
		height: 160px;
	}


/****************************************

          Sidebar

*****************************************/

#sidebar h2{
	margin-bottom: 10px;
	font-family: 'Josefin Sans', sans-serif;
}
.widget{
	margin-bottom: 60px;
}

#sidebar .widget ul{
	padding-left: 1.5em;
	list-style-position: outside;
	list-style-type: disc;
}

#sidebar-recent-posts li,
#sidebar-popular-posts li{
	margin:20px 0;
}

.sidebar-thumbnail-box{
	float: left;
	width: 75px;
}

.sidebar-recent-posts-title{
	float: right;
	width: 165px;
}
	#sidebar-recent-posts h3,
	#sidebar-recent-posts p,
	#sidebar-popular-posts h3,
	#sidebar-popular-posts p{
		margin: 0;
	}

.tagcloud a{
	white-space: nowrap;
}


/****************************************

          Footer

*****************************************/

#copyright{
	padding: 20px 0;
	font-size: 80%;
}
#footer .menu1 img,#footer .menu2 img,#footer .menu3 img,#footer .menu4 img,#footer .menu5 img{
	width: 100%;
}
.footer_contents{
	width: 100%;
	display: table;


}

	#footer .alignleft{
		width: 50%;
		text-align: left;
		padding-left: 20px;
		display: table-cell;
		vertical-align: middle;
	}
	#footer .alignright{
		width: 50%;
		text-align: right;
	padding-right: 20px;
		display: table-cell;
	}

	#footer .aligncenter{
		clear: both;
		width: 100%;
		display: inline-block;
	}
	
	.menu1{
		background: url(../../../images/menu1.jpg);
		background-size: 100% 100%;
	}
	.menu2{
		background: url(../../../images/menu2.jpg);
		background-size: cover;
	}
	.menu3{
		background: url(../../../images/menu3.jpg);
		background-size: cover;
	}
	.menu4{
		background: url(../../../images/menu4.jpg);
		background-size: cover;
	}
	#footer_logo{
		width: 33.333%;
	}
/****************************************

          Form

*****************************************/

input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
textarea {
	margin: 0;
	margin-bottom: 20px;
	padding: 6px 4px;
	max-width: 100%;
	width: 290px;
	outline: none;
	border: 1px solid #ddd;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background: #eee;
	color: #777;
	vertical-align: bottom;
	font-size: 13px;
}

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

textarea {
	overflow: auto;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
	border: 1px solid #ff69b4;
	background: #fff;
	-webkit-box-shadow: 0 0 3px rgba(255,105,180,1);
 	-moz-box-shadow: 0 0 3px rgba(255,105,180,1);
	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: 4px 12px;
	padding: 8px 10px;
	border: 1px solid #fe56aa;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background: #ff89c4;
	color: #333;
	text-decoration: none;
	text-shadow: 0 1px rgba(255, 255, 255, .75);
	font-weight: bold;
	font-size: 12px;
	line-height: normal;
	cursor: pointer;
	/* Old browsers */
}

	.button:hover,
	button:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover {
	  	border: 1px solid #fe56aa;
		background: #ff89c4;
		color: #fff;
	  	text-shadow: 0 -1px rgba(0, 0, 0, .4);

	}

	.button:active,
	button:active,
	input[type="submit"]:active,
	input[type="reset"]:active,
	input[type="button"]:active {
		position: relative;
		top:1px;
	}


/****************************************

          WordPress Misc

*****************************************/

.aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}



.wp-caption {
	margin: 10px;
	padding-top: 4px;
	border: 1px solid #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color: #f3f3f3;
	text-align: center;
}

.wp-caption-text,
.gallery-caption{
	font-size: 80%;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption-dd {
	margin: 0;
	padding: 0 4px 5px;
	font-size: 11px;
	line-height: 17px;
}

img.alignright {
    display: inline-block;
    margin: 0 0 1em 1.5em;
}

img.alignleft {
    display: inline-block;
    margin: 0 1.5em 1em 0;
}


/****************************************

          Clearfix

*****************************************/

#container:after,
#header .menu > ul:after,
#header ul.menu:after,
.clearfix:after {
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	content: " ";
	font-size: 0;
}

/* clearfix for ie7 */
#container,
#header .menu > ul,
#header ul.menu,
.clearfix {
	display: inline-block;
}

#container,
#header .menu > ul,
#header ul.menu,
.clearfix {
	display: block;
}

		.disable-mouse {
			pointer-events: none;
		}
		body.disable-scroll {
			overflow: hidden;
			height: 100%;
		}
		.btn, .tile {
			display: inline-block;
			text-decoration: none;
			color: white;
			opacity: 0.7;
			-moz-opacity: 0.7;
			-webkit-opacity: 0.7;
			cursor: pointer;
			transition: 0.85s ease;
		}
		.btn2 {
			display: inline-block;
			text-decoration: none;
			background: #ffffff;
			color: #3c9aff;
			opacity: 1;
			cursor: pointer;
			transition: 0.85s ease;
		}
		.download-btn {
			background: white;
			color: #3F51B5;
			font-size: 30px;
		}
		.btn--blue {
			background: #4A90E2;
		}

		.tile-container {
			overflow: hidden;
			margin-bottom: 20px;
			width: 100%;
			display: table;
			background: #ffffff;
		}
		.tile {
			width: 25%;
			height: 40%;
			display: table-cell;
			vertical-align: bottom;
		}
		
		.sidebar .tile {
			width: 90%;
			height: auto;
			display: block;
			vertical-align: bottom;
			margin: 3px auto;
		}

		.btn:hover,
		.tile:hover {
			opacity: 1;
		}


		.modal {
			position: fixed;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			padding-top: 40px;
			color: white;
			z-index: 1;
			visibility: hidden;
			background: rgba(0,0,0,0);
			pointer-events: none;
            transition: 0.2s ease;
			overflow: auto;
		}
		
		.aisatsu {
display: table-cell;
text-align: center;
			color: white;
			z-index: 1;
			visibility: hidden;
			pointer-events: none;

		}
		
		.modal-close-btn {
			display: block;
			position: absolute;
			top: 0;
			right: 0;
			background: url(../../../images/close.png) no-repeat center;
			width: 32px;
			height: 32px;
			padding: 32px;
			opacity: 0.8;
			-moz-opacity: 0.8;
			-webkit-opacity: 0.8;
			cursor: pointer;
			transition: 0.2s ease;
		}
		.modal-close-btn:hover {
			opacity: 1;
		}

		
		.modal.show {
		background: rgba(0,0,0,0.8);
			visibility: visible;
			pointer-events: auto;
		}

		.aisatsu.show {
			visibility: visible;
			pointer-events: auto;
		}
		.aisatsu.text {
		display: none;
		}
		.aisatsu.sp_show {
			visibility: visible;
			pointer-events: auto;
		display: none;
		}
				.aisatsu.show img {
		width:50%;
				}

		.dialog {
			background: #000000;
			min-width: 300px;
			left: 50%;
			right: auto;
			top: 30%;
			bottom: auto;
			box-shadow: 0 0 0 3000px rgba(0,0,0,0.4);
			-webkit-transform: translateX(-50%);
			transform: translateX(-50%);

		}
		.dialog.show {
		background: rgba(0,0,0,0.8);
			visibility: visible;
			pointer-events: auto;
		}
		.sidebar {
			left: auto;
			width: 300px;
			background: #000000;
			-webkit-transform: translateX(100%);
			transform: translateX(100%);
			background: rgba(0,0,0, 0.7);
			visibility: visible;
			text-align: center;
		}
		.sidebar.show {
			-webkit-transform: translateX(0);
			transform: translateX(0);
			background: rgba(0,0,0, 0.7);
		}
		.sidebar.show div{
			cursor: pointer;
		}

		.sidebar__block {
			background: #000000;
			margin-top: 32px;
		}
		
		.sidebar-close-btn {
			cursor: pointer;
		}
		.sidebar-close-btn:hover {
			opacity: 1;
		}
		.quote-box{
			text-align: center;
		}
		.quote-box__bubble {
			position: relative;
			background: rgba(255,255,255,.6);
			color: #555;
			border-radius: 5px;
			width:90%;
			margin: 0 auto 20px;
			text-align: left;
			-webkit-overflow-scrolling: touch;
		}
		.quote-box__bubble h2 a{
			display: none;
			}
		.menu_b{
			background-color: #CB000B;
			position: fixed;
			top: 10px;
			right:10px;
			width: 32px;
			height:32px;
			text-align: center;
		}
		.fa{
			margin-top: 4px;
			font-size: 24px;
		}
		.aisatsu.sp_show{
			display: none;
		}
		.title_img{
			width:300px;
		}
		.title_img2{
			width:80%;
		}
.wish_list {
border-collapse:separate;
width: 100%;
margin: 0 auto 18px;
padding: 0;
background-color: #ffffff;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border: 1px #313131 solid;
border-spacing: 0; }

.wish_list thead {
background-color: #5cc;
color: #fff; }

.wish_list th {
margin-bottom: 9px;
padding: 9px 15px;
border-left: 1px #4bb solid;
font-weight: normal; }

.wish_list th:first-child {
border-left-width: 0; }

.wish_list tbody {
vertical-align: top; }

.wish_list tbody td {
vertical-align:middle;
height:30px;
border-left: 1px #ddd solid; 
padding: 5px;}

.wish_list tbody td:first-child {
border-left-width: 0; 
width: 30%;}

@media screen and (max-width:1025px) {
		.aisatsu.show img{
		width: 90%;
		}
}
@media screen and (max-width:770px) {
		.aisatsu.sp_show{
		background: rgba(0,0,0,0.4);
		display: block;
		margin-top: 50px;
		margin-bottom: 50px;
		}
		.aisatsu.sp_show img{
width: 90%;
		}
		
		.aisatsu.show{
			display: none;
		}
	#logo img{
	width:50%;
	}
#header .alignleft{
	width: 100%;
	display: block;
	padding-left: 0px;
	text-align: center;
}
#header .alignright{
	width: 100%;
	display: block;
	padding-right: 0px;
}
#description {
    color: #777;
    margin-top: 0;
    padding-bottom: 0px;
    font-size: 10px;
    padding-left: 0px;
}
#footer .alignleft{
	margin-top: 20px;
	width: 100%;
	display: block;
	padding-left: 0px;
	text-align: center;
}
#footer .alignright{
	width: 100%;
	display: block;
	padding-right: 0px;
}
#footer .alignright p{
	margin-right: 20px;
	}
#footer_logo{
	width: 33.333%;
}
.aisatsu.show img {
    width: 90%;
}

}
@media screen and (max-width:450px) {
#header{
	padding-left: 0px;
}
h1 {
    font-family: "Josefin Sans",sans-serif;
    font-size: 100%;
    margin-bottom: 10px;
    margin-left: 0px;
}
#logo img{
	width:75%;
}
#header .alignleft{
	width: 100%;
	display: block;
	padding-left: 0px;
	text-align: center;
}
#header .alignright{
	width: 100%;
	display: block;
	padding-right: 0px;
}
#description {
    color: #777;
    margin-top: 0;
    margin-left: 0;
    padding-bottom: 0px;
}
#footer .alignleft{
	margin-top: 20px;
	width: 100%;
	display: block;
	padding-left: 0px;
	text-align: center;
}
#footer .alignright{
	width: 100%;
	display: block;
	padding-right: 0px;
}
#footer .alignright p{
	margin-right: 20px;
	line-height: 100%;
	}
#footer_logo{
	width: 50%;
}
.tile-container {
    background: #ffffff none repeat scroll 0 0;
    display: none;
    margin-bottom: 20px;
    overflow: hidden;
    width: 100%;
}
.tile {
    display: block;
    height: auto;
    vertical-align: bottom;
    width: 100%;
}
.wish_list tbody td:first-child {
border-left-width: 0; 
width: 100%;
height:30px;}
.wish_list {
width: 98%; }
.wish_list tbody tr {
display: block;
padding-bottom: 12px; }
.wish_list tbody td {
display: block;
width: 100%;
border-left-width: 0; 
height: auto;
}
.wish_list tbody td:before {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
margin-right: 5px;
color: #888;
font-weight: normal; }
.wish_list tbody .title {
width: 100%;
margin: 0;
padding-right: 0px;
padding-left: 0px;
margin-bottom: 9px;
background-color: #cc0000;
color: #fff;
text-align: center; }
}