@charset "UTF-8";
/*
Theme Name: inastudio
Text Domain: inastudio
Description: A greyscale theme that follows a nice grid system, and keeps typography in top priority.
Version: 25.4
Requires at least: 6.0
Tested up to: 6.0
Requires PHP: 8.1
License: GNU General Public License
License URI: license.txt
Author: inastudio
Author https://www.hara-ken.com/
Tags: two-columns, sticky-post
color:rgba(1,74,168,1)
*/

body {font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	
	margin:0;
	padding:0;
	color:#1A1A1A;
	text-align:left;
	line-height: 160%;
	-webkit-text-size-adjust: 100%;}
html {  scroll-behavior: smooth;scroll-padding-top: 120px;}

.mincho {font-family: "Noto Serif JP", serif;
  font-weight: 900;}

#breadcrumbs {background-color: #EDEDED;}
.breadcrumbs {max-width: 1200px; width: 100%; margin: 0 auto;}

.gallery .gallery-caption {}	
.commentlist .bypostauthor {}
/* Begin Settings and Classes */
a {
	color:#00F;
	}
a:hover img{
	opacity: 0.5;
	-moz-opacity: 0.5;
}	
a:hover {
	color:#F00;
	}
a:visited {
	color: #5A0087;
	}	
h1 a, h2 a, h3 a, #sitename {
	color:#4d4d4d;
	text-decoration: none;
	}
		
h1 a:hover, h2 a:hover, h3 a:hover, #sitename:hover {
	text-decoration:none;
	color:#F30;
	}
h1 {font-size: 150%;
	}
h1, h2, h3, h4, h5, h6 {line-height: 120%; color: #4d4d4d;
	}
#page h1 {background-color: rgba(0,0,0,0); padding: 2em 0 1em 0 ;text-align: center; border:rgba(0,0,0,.2) solid 2px; }
#page h2 {margin-top: 5em;}
/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}
#koukyoujigyouimage img {width:310px!important; height: 220px!important; }
form th, form td {border: none;}

	.entry h2 {
		margin-top:30px;
	}
	

	
.pagetitle {
	margin-bottom:20px;
	display:block;
	}
.cat_tittle {
	margin-bottom:20px;
	display:block;
    border: rgba( 240, 134, 0, 1 ) solid 1px;
    font-weight: normal;
	}
.cat_tittle span{
	display:block;
    float: right;
    width: 4em;
	}
.cat_tittle a:hover{
	background-color: #ededed;
	}
.cat_tittle a{
	display:block;
    padding: .5em;
	}
.category_description {}

.caps {text-transform:uppercase;margin-bottom:6px;display:block;}
code {font: 1.1em "Courier New", Courier, Fixed;}	
pre {font: 1.1em "Courier New", Courier, Fixed;margin:1.5em;padding:10px;background:#fafafa;border:1px solid #eee;}
acronym, abbr {font-size: 0.9em;letter-spacing: .07em;}
blockquote {margin-left:-21px;padding-left:21px;background:url(images/quote.gif) no-repeat 0 6px;color:#343434;}
.entry cite {font-style:italic;font-size:.9em;display:block;margin:0;text-align:right;}
.entry cite:before {content: "\2014 \0020";}

hr {
	clear:both;
	height:1px;
	border:none 0;
	color:#ccc;
	background-color:#ccc;
	margin:1.5em 0;
	}
	
img {
	border:none;
	max-width:100%;
	height: auto;
	}

.post dt {
	font-weight:bold;
	background:url(images/icons.gif) no-repeat 0 -141px;
	padding-left:10px;
	margin-left:-10px;
}

.post dd {
	padding-left:10px;
	padding-bottom:5px;
}

.clear { 
	clear:both;
	height:0;
	line-height:0;
	}
.nocomments {clear:both;height:0;line-height:0;
	}		


/* Begin Images */	
img.alignleft, .alignleft img {
	margin-right:10px;
    margin-bottom: 10px;
	}
	
img.alignright, .alignright img {
	margin-left:10px;
    margin-bottom: 10px;
	}

.wp-caption, .attachment img {text-align: center;}
.wp-caption p.wp-caption-text {font-size: .9em;color:#666666;margin: -.5em 0 1.5em 0;width: 80%; height: 3em;line-height: 120%;text-align: left;}
.attachment, .caption {text-align:center;}
.attachment img {}
/* End Images / End Settings and Classes */

/* Begin Structure */
body {
	margin:0;
	padding:0;
	color:#000000;
	text-align:left;
	font-family: ""メイリオ", Meiryo, ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 160%;
	-webkit-text-size-adjust: 100%;}
	



.slider-for div {
	display: block;
	width: 100%;
	background-position: center;
	background-repeat: no-repeat;
	text-align: center;
	}

.slider-for  {
	}

#slide {
	width:100%;
	}
.slider-for div img{width: 100%!important;height: auto;

	}





		
/* Begin Content */	

#contents {
	padding:30px 0;
    max-width: 960px;
    margin: 0 auto;
	width: 100%;
 }
#content,#content_arcive {
	width: 100%;
	padding:0px;
	}

.content  {
    clear: both;
	width:100%;
	display:block;
	padding:5px 0px}
.content h1, .post h1 {
	margin:15px 0px;
	padding:10px 0px 5px 0px;
	}
.content h2, .post h2 {
    text-align: center;
	}
.content h2 span, .post h2 span {
    text-align: center;
    display: block;
    font-size: 74%;
    color: #4d4d4d;
    font-weight: normal;
	}
.post {
		margin-bottom:40px;
    
		}
.top_haikei {width: 100%; padding: 20px 0 0 0; margin: 15px 0; background-color: #f2f2f2;}
.top_haikei h2 {padding: 0; margin: 0;}

.top_more {display: block; text-align: center; padding: 5px 0;}
.top_more a:hover {background-color: white;}
.top_more a{display: inline-block; padding: 5px; border: rgba(0,0,0,.6) solid 2px; color: rgba(0,0,0,.6) ; text-decoration: none;width: 10em;}


.content_middle {max-width: 1000px; margin: 15px auto;}
.top_hito a{display: block; text-decoration: none; color:#4d4d4d; }
.top_hito img{display: block; width: 200px; height: 203px; float: right; margin: 0 0 1em 1em;}
.top_hito {display: inline-block; max-width: 500px; width: 100%; text-align: left;padding: .5em 0 1em 0;}
.content_middle h2 {padding-bottom: 0; margin-bottom: 0;}
.top_entry {
		width:200px;
    padding: 12px;
    display: inline-block;
    vertical-align: top;
			}

.category-news .top_entry span {display: block; height: 5em; overflow: hidden;
			}
.top_entry img{
		width:200px;
		height:150px;
    line-height: 120%;
    display: inline-block;
		overflow:hidden;
			}
.top_entry a{text-decoration: none; color: #4d4d4d;
			}
.top_entry .top_more a{width: 7em; color: rgba(0,0,0,.6) ; padding: 0px; }
#youtube {max-width: 500px; width: 100%; padding: 0; margin: 0 auto; display: none;}

	
#sideb-r {
	float:right;
	width:200px;
	padding-right:30px;
}
#sideb-r  ul {
	margin:0px;
	padding:5px 0px;
}
#sideb-r  li {
	margin:0px;
	padding:0px;
	list-style:none;
}
#sideb-r  img {
	margin-bottom:10px;
}
#sideb-r  .cat-item {
	padding-left:1em}


		
.sticky, .byuser {border:5px solid #f9f9f9 !important;margin:-10px -10px 40px -50px;background:url(images/sticky.gif) no-repeat 597px 5px;padding:5px 5px 5px 45px;}
.byuser {margin-left:-52px;padding-left:47px;background:url(images/author.gif) no-repeat 599px 5px;}
.bubble  {display:none;float:left;margin:0px;background:#343434 url(images/comments.gif);width:30px;height:29px;line-height:19px;color:#fff;text-align:center;}
.bubble:hover {color:#666666;}




#index_tittle {max-width: 960px; width: 100%; margin: 0 auto;}
#index_tittle h1 {display: none;} 
#index_tittle h2 {font-size: 200%;} 
#header_chousei {height: 5.2em;}
#index_jisseki {width: 100%; max-width: 1200px; margin: 0 auto; padding: 3em 0; background-color: black;} 
#index_jisseki a span {display: block; width: 100%; min-width: 380px;max-width: 380px; margin: 2px; aspect-ratio: 656 / 467;}
    
#index_event {width: 100%; max-width: 1200px; margin: 0 auto; padding: 3em 0;} 
#index_event a span {display: block; width: 100%; min-width: 380px;max-width: 380px; margin: 2px; aspect-ratio: 656 / 467;}

#top-jisseki img {max-width: 100px; height: auto;}
       
 
@media screen and (min-width:960px)  {
    .content_event {color: white; max-width: 960px; margin: 0px auto;line-height: 160%; background-color: rgba(107,40,47,1)}
    .wide50 {width: 50%;display: inline-block;vertical-align: top;}
    .wide50-left {display: block; float: left;}
    .wide50_inner{padding: 30px;display: block;background-image: url(https://www.hara-ken.com/simple-note/images/check.svg);background-position:top left; background-repeat: no-repeat;background-size: 100px auto;}
    .wide50_inner h3 {color: rgba(251,176,59,1)}
    #top-event-mousikomi {display: block; padding: 150px 0;float: right;}
}
@media screen and (max-width:959px){
    .content_event {color: white; margin: 0px auto;line-height: 160%;padding: 1em;}
    .wide50 {width: 100%; }.wide50_inner{padding: 20px; background-color: rgba(107,40,47,1)}
    .wide50_inner h3 {color: rgba(251,176,59,1)}
    #top-event-mousikomi {display: block;text-align: center;padding: 20px 0;}
}


.entry {
			}
.entry p {
clear:both;
width:100%;
display:block;

			}
.child_nav {
	display: block;
	text-align:right;
	border-bottom:#EDEDED solid 1px;
	margin-bottom:2em}		
	.navigation {
	margin:10px 0px;
	text-transform:uppercase;
		}
		
	.post .navigation {
	border:solid #e6e6e6;
	border-width:1px 0px 0px 0px;
	padding:30px 0;
	}
	
	.attachment .navigation {
		height:150px;
	}
		
		.navigation .alignleft a {
			background:url(images/icons-back.gif) no-repeat ;
            background-position: left center;
			padding-left:22px;
			padding-right:22px;
			display:block;
			float:left;
		}
		
		.navigation .alignright a {
			background:url(images/icons-next.gif) no-repeat ;
            background-position: right center;
			padding-right:22px;
			padding-left:22px;
			display:block;
			float:right;
		}

/* ナビゲーション */
.tablenav {
    color: rgba( 0, 133, 188, 1 );
	font-size:1.1em;
    background:white;
    margin: 1em auto;
    line-height:1.2em;
    text-align: center;
	}
 a.page-numbers, .tablenav .current {
    color: rgba( 0, 133, 188, 1  );
    padding: 0px .3em;
    border:solid 1px rgba( 0, 133, 188, 1  );
    text-decoration:none;
    font-size:smaller;
	font-weight:bold;
	border-radius: 3px;        /* CSS3草案 */  
	-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 3px;   /* Firefox用 */
}
 a.page-numbers:hover {
    color:white;
    background: rgba( 0, 133, 188, 1 );
}
 .tablenav .current {
    color: white;
    background: rgba( 0, 133, 188, 1 );
    border-color: rgba( 0, 133, 188, 1  );
    font-weight:bold;
	border-radius: 3px;        /* CSS3草案 */  
	-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 3px;   /* Firefox用 */
}
 .tablenav .next, .tablenav .prev {
    border:0 none;
    background:transparent;
    text-decoration:underline;
    font-size:smaller;
    font-weight:bold;
}

/* Begin Comments */		
.commentlist {margin-top:20px;}
.commentlist li {list-style:none;margin-bottom:30px;border-bottom:1px solid #e6e6e6;}
.commentlist li.alt {}
.commentmetadata, .comment-author {font-size:.9em;}
.comment-author {}
.avatar {float:left;display:block;margin:0px;}
#commentform {padding-bottom:10px;}
#commentform input, #commentform textarea {width:147px;border:1px solid #e6e6e6;background:#f9f9f9;font-size:11px;padding:2px 3px 3px;}
#commentform textarea {width:500px;}
#commentform #submit {width:150px;border:none;background:#343434;font-size:11px;padding:0;color:#fff;font-size:12px;cursor:pointer;padding:2px 0 3px;}
/* End Comments / End Content */


/* Begin Page List */		
#nav {
	margin-right: auto;
	margin-left: auto;
	text-align:center;
	}
#nav ul{
        display: inline-block;
        margin: 0 ; padding: 0;
		}
	#nav li {
	display:inline-block; 
	list-style:none;
        margin: 0; padding: 0;
		}
#nav li a:hover {
	text-decoration: underline;
			}		
		#nav li a {
            display: block;
			color:white;
			text-decoration:none;
			padding:5px 1.2em;
            
			}
			
		#nav li a:hover, #nav li.current_page_item a, #nav li.current_page_parent a {
			
			}
/* End Page List */


.page_item {
	padding: 2px;	
}

/* Begin Footer */
.link a:hover {text-decoration: underline; color: blue;}
.link a {text-decoration: none; color: #4D4D4D;}

#footer {color: rgba(255,255,255,1);margin: 0px; background-color: rgba(0,0,0,1); padding: 30px;}
#footer td{border-top: none;border-left: none;border-right: none;}
.footer50 {width: 50%; float: left;}
#copyright {background-color: rgba(0,0,0,.5); color: white; padding: 1em;  margin-top: 0px; text-align: center;}
#copyright span{display: inline-block;}

@media screen and (max-width:900px){
.footer50 {width: 100%; float: inherit;}
#contents {width: auto; padding: 1em;}
}





/* End Footer / End Structure */
			

/* Begin Calendar */
#wp-calendar {empty-cells: show;margin: 10px auto 0;width: 260px;}
#wp-calendar th {text-align:center;color:#343434;}
#wp-calendar caption {text-decoration: none;font-weight:bold;font-size:1.1em;text-align: center;width: 100%;color:#343434;}
#wp-calendar #prev a, #wp-calendar #next a {font-size: 9pt;}
#wp-calendar #next a {padding-right: 10px;text-align: right;}
#wp-calendar #prev a {padding-left: 10px;text-align: left;}
#wp-calendar a {text-decoration: none;display: block;}
#wp-calendar th {font-style: normal;text-transform: capitalize;}
#wp-calendar td {padding: 3px 0;text-align: center;}
#wp-calendar td.pad:hover { /* Doesn't work in IE */
background-color: #fff; }
/* End Calendar */

.clearmain {
	clear:both;
	height:0;
	line-height:0;
}
.widgettitle{display: none;	}
.textwidgetbox {float: left;padding: 0px 0px 10px 0px;}
.w100 {
	clear:both;
	width:100%;
	padding-bottom:15px;
	float: left}



/*--------------------------------------------------------------
6.0 Forms
--------------------------------------------------------------*/

.kakunin {display: block; padding: 1em 0; text-align: center;}
label {
	color: #333;
	display: block;
	font-weight: 800;
	margin-bottom: 0.5em;
}

fieldset {
	margin-bottom: 1em;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	background: #fff;
	background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
	border: 1px solid #bbb;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	display: block;
	padding: 0.7em;
	width: 90%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #222;
	border-color: #333;
}

select {
	border: 1px solid #bbb;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	height: 3em;
	max-width: 90%;
}

input[type="radio"],
input[type="checkbox"] {
	margin-right: 0.5em;
}

input[type="radio"] + label,
input[type="checkbox"] + label {
	font-weight: 400;
}

button,
input[type="button"],
input[type="submit"] {
	background-color: #222;
	border: 0;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: 800;
	line-height: 1;
	padding: 1em 2em;
	text-shadow: none;
	-webkit-transition: background 0.2s;
	transition: background 0.2s;
}

input + button,
input + input[type="button"],
input + input[type="submit"] {
	padding: 0.75em 2em;
}

button.secondary,
input[type="reset"],
input[type="button"].secondary,
input[type="reset"].secondary,
input[type="submit"].secondary {
	background-color: #ddd;
	color: #222;
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	background: #767676;
}

button.secondary:hover,
button.secondary:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="button"].secondary:hover,
input[type="button"].secondary:focus,
input[type="reset"].secondary:hover,
input[type="reset"].secondary:focus,
input[type="submit"].secondary:hover,
input[type="submit"].secondary:focus {
	background: #bbb;
}
/*--------------------------------------------------------------
9.0 Tables
--------------------------------------------------------------*/


#searchform {}
#searchsubmit {width: 20px!important; float: right;display: block; position: relative; margin: -20px -20px 0 0;}


table p {margin:0px; padding:0px;}


table {
	border-collapse: collapse;
	width: 100%;
}
thead th {
	border-bottom: 1px solid #666;
}
th {
	padding: 0.4em;
	text-align: left;
    border: 1px solid #666;
}
tr {}
td {
	padding: 0.4em!important;
    border: 1px solid #666;
}
th:first-child,td:first-child {padding-left: 0;}
th:last-child,td:last-child {padding-right: 0;}

#single {padding: 1em 0;width: 100%;}



#map .waku td {padding: 0px!important;}
#map iframe {border: none;}


#map_all {display: block; width: 100%; }


.link_kuwasiku_shinchiku {width: 100%; padding: 2em 0 4em 0;text-align: center;}
.link_kuwasiku_shinchiku b{display: inline-block;padding: .5em 2em .3em 2em; background-color:rgba(1,74,168,1); color: white; text-decoration: none;font-weight: normal; }

.link_kuwasiku {width: 100%; padding: 2em 0 4em 0;text-align: center;}
.link_kuwasiku a:hover{background-color:rgba(1,74,168,.8);  }
.link_kuwasiku a{display: inline-block;padding: .5em 2em .3em 2em; background-color:rgba(1,74,168,1); color: white; text-decoration: none; }

.link_kuwasiku_white {width: 100%; padding: 1em 0 1em 0; margin: 2em 0; text-align: center;}
.link_kuwasiku_white a:hover{background-color:rgba(1,74,168,.8);color: white;}
.link_kuwasiku_white a{display: inline-block;padding: .5em 2em .3em 2em; background-color:rgba(255,255,255,1); color: rgba(0,0,0,.5); text-decoration: none; border:rgba(0,0,0,.5) solid 1px;}

.link_kuwasiku_black {width: 100%; padding: 2em 0 4em 0;text-align: center;}
.link_kuwasiku_black a:hover{background-color:rgba(0,0,0,.8);color: white;}
.link_kuwasiku_black a{display: inline-block;padding: .5em 2em .3em 2em; background-color:rgba(1,74,168,0); color: rgba(0,0,0,.5); text-decoration: none; border:rgba(0,0,0,.5) solid 3px;}

/*  */


@media screen and (min-width:960px)  {
#header_wrap {background-color: rgba(255,255,255,.8); width: 100%; padding: 0px; position: fixed;top:0;z-index: 100; }

#header_trim {height: 5em;}
#header_logo {max-width:400px;width: 100%;float: left;}
#header_logo a{text-decoration: none; color: rgba(50,50,50,1);}
#header {max-width: 1200px; width: 100%; margin: 0 auto;padding: 1em 0;	}
#header_name_txt a{float: right;text-decoration: none; color: rgba(50,50,50,.8);margin: -.5em 0 .5em 0;}
#header_menu {float: right;}
#header_menu ul {margin: 0; padding: 0;text-align: right;}
#header_menu li {margin: 0; padding: 0;list-style: none; display: inline-block;}
#header_menu a {margin-left: 1.6em; padding: 5px 5px 2px 5px; color: rgba(50,50,50,1); text-decoration: none;}
#header_menu a:hover {background-color: rgba(50,50,50,.2); border-bottom:  rgba(50,50,50,1) solid 1px;}
#header_chousei {height: 120px;}
    
.header_logo_name {font-weight: bold; font-size: 140%;display: block;}
.header_logo_sub {font-weight: bold; font-size: 100%;display: block;}




.alignleft {
	float:left;
	}
	
.alignright {
	float:right;
	}
	
.aligncenter, div.aligncenter, img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

	
#header_sp {
	display: none;
}
}


@media screen and (max-width:959px){
#header_wrap {background-color: rgba(0,0,0,.5); display: block;width: 100%; position: fixed;top:0;z-index: 100;}
.content_pad1em  {padding: 1em;}
#header_trim {height: 5em;}
#header_logo {width: 100%;float: left;}
#header_logo a {text-decoration: none; color: rgba(255,255,255,1);}
.header_logo_name {font-weight: bold; font-size: 140%;display: block;}
.header_logo_sub {font-weight: bold; font-size: 100%;display: block;}
#header_logo span span{display: inline-block;}
#header_menu {display: none;}
#header_name_txt a{text-decoration: none; color: rgba(255,255,255,1);margin: -.5em 0 .5em 0;}
#header_sp {
	display: block; text-align: right;
}



#copyright span {display: inline-block;}


#otoiawase a {display: inline-block}
    #page {padding: 0 1em;}
    #sideb-r {display: none;}
    #content h1 {font-size: 100%; } 

#content {
padding-left: 0px!important;
	}
.alignleft {
	float:left;
	}
	
.alignright {
	float:right;
	}

.alignleft,.alignright {
    width: 100%;
    text-align: center;
	margin-left: auto;
	margin-right: auto;
	}
	
	
.aligncenter, div.aligncenter, img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}




	
/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}


/*アイコンのスペース*/
#nav-open {
  display: block;
    position: fixed;
    top: 20px;
    right: 10px;
  width: 40px;
    ;z-index: 110;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 5px;/*線の太さ*/
  width: 40px;/*長さ*/
  border-radius: 5px;
  background: #FFF;
  display: block;
  content: '';
  cursor: pointer;transition: .3s ease-in-out;
}
#nav-open span:before {
  bottom: 12px;
}
#nav-open span:after {
  top: 12px;
}



#nav-input:checked ~ #nav-open span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
	transition: .3s ease-in-out;
}
#nav-input:checked ~ #nav-open span::before {
    bottom: 0;
    transform: rotate(45deg);transition: .3s ease-in-out;
}
#nav-input:checked ~ #nav-open span::after {
    top: 0;
    transform: rotate(-45deg);transition: .3s ease-in-out;
}


/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 101;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}


/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
	padding-left: 2em;
    text-align: left;
  z-index: 9999;/*最前面に*/
  width: 70%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}
#nav-content li{
  padding: .3em 0;
	margin-top: 1.5em;
	list-style: none;
}
	

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
	
/*チェックボックス等は非表示に*/
.nav-unshown_bg {
  display:none;
}
/*アイコンのスペース*/
#nav-open_bg {
  display: block;
	float: right;
  width: 40px;
 margin-top: 5px;
  vertical-align: middle;
}
#nav-open_bg span, #nav-open_bg span:before, #nav-open_bg span:after {
  position: absolute;
  height: 5px;/*線の太さ*/
  width: 40px;/*長さ*/
  border-radius: 5px;
  background: rgba(0,61,33,1);
  display: block;
  content: '';
  cursor: pointer;transition: .3s ease-in-out;
}
#nav-open_bg span:before {
  bottom: 12px;}
#nav-open_bg span:after {
  top: 12px;}
#nav-input_bg:checked ~ #nav-open_bg span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
	transition: .3s ease-in-out;}
#nav-input_bg:checked ~ #nav-open_bg span::before {
    bottom: 0;
    transform: rotate(45deg);transition: .3s ease-in-out;}
#nav-input_bg:checked ~ #nav-open_bg span::after {
    top: 0;
    transform: rotate(-45deg);transition: .3s ease-in-out;}	
#nav-close_bg {}
#nav-content_bg li{}
#nav-content_bg {}
#nav-input_bg:checked ~ #nav-close_bg {}
#nav-input_bg:checked ~ #nav-content_bg {}
}


/* 右下リンクボタン 2タイプ　PC*/

#toggle {visibility: hidden; opacity: 0; transition: 1s;}
.toggle-inner {width: 100%; max-width: 534px; aspect-ratio: 534 / 190; opacity: 1; transition: 1s;}
#toggle:checked ~ .toggle-inner {transition: 1s; width: 0px; font-size: .1em;opacity: 0;}
.simplenote_bunner {position: fixed;max-width: 534px;right: 0px;bottom: 10px;text-align: center; z-index: 90;}
.simplenote_bunner label {display: block;width: 60px; height: 60px; float: right;margin: 0 0 -15px 0; }
.simplenote_bunner a{display: block; width: 100%; max-width: 534px;padding: 0;aspect-ratio: 534 / 90; background-color: rgba(0,113,188,0);box-shadow:3px 3px 12px rgba(0,0,0,0);}

/* トップブログ、イベント*/

.top_notice {display: block;border-top:#b3b3b3 solid 1px; border-bottom:#b3b3b3 solid 1px; margin-top: -1px; text-align: left;padding: .7em 0; }
.top_notice_date {display: inline-block;width: 8em; padding-left: 1em; }
.top_notice_txt {display: inline-block;}

/* カテゴリの並び*/
.yokonarabi_image {width: 100%;
	background-size: cover;
	background-position: center;
    background-repeat: no-repeat;
}
    
/*
Whatever your hand finds to do, do it with all your might,
for in the grave, where you are going, there is neither
working nor planning nor knowledge nor wisdom.
Ecclesiastes 9:10
*/

/*
Tammy Hart
www.tammyhartdesigns.com
*/