/**
 * Theme Name: Diary Mokuji
 * Theme URI:
 * Author:
 * Author URI:
 * Description: Diary Mokuji is a free WordPress theme for business.
 * Version: 1.0.0
 * License: GNU General Public License
 * License URI: license.txt
 * Text Domain: diarymokuji
 * Domain Path: /languages/
 * Tags: white, one-column, right-sidebar, microformats, responsive-layout,  custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, sticky-post, theme-options, threaded-comments
 */
* {
	-ms-word-wrap: break-word;
	word-wrap: break-word;
}
html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}
body {
	background: #fff;
	color: #000;
	font-size: 14px;
	line-height: 1.8;
	margin: 0;
	padding: 0;
	font-family:YakuHanJP,-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI","Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,"Yu Gothic",YuGothic,sans-serif;
}

header, footer, nav, section, article, figure, aside, main {
	display: block;
}

h1, h2, h3, h4, h5, h6 {
	clear: both;
	font-size: 100%;
	font-weight: normal;
	margin: 0 0 20px;
	padding: 0;
}
h2 {
	margin: 70px 0 35px 0;
	font-size:30px;
	text-align:center;
}
h3, h4, h5, h6 {
	margin: 30px 0 10px 0;
}
p, ul, ol, dl, table, pre {
	margin: 15px 0 0;
	padding: 0;
}
li, dt, dd {
	margin: 0;
	padding: 0;
}
dd {
	margin-left: 1em;
}

/**
 * img
 */
img {
	border: none;
	vertical-align: text-bottom;
}
table img {
	vertical-align: bottom;
}

/**
 * ul
 */
ul li {
	margin-left: 30px;
	padding-left: 5px;
}

/**
 * ol
 */
ol li {
	margin-left: 30px;
}

/**
 * table
 */
table {
	font-size: 100%;
	padding: 0;
}
th {
	font-weight: normal;
}
th, td {
	padding: 0;
	text-align: left;
}
table ul,
table ol,
table dl,
table table,
table p {
	margin-top: 0;
}

/**
 * form
 */
button,
input,
select,
textarea {
	box-sizing: border-box;
	max-width: 100%;
	font-size: 100%; /* Corrects font size not being inherited in all browsers */
	margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
	vertical-align: baseline; /* Improves appearance and consistency in all browsers */
	*vertical-align: middle; /* Improves appearance and consistency in all browsers */
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid #ccc;
	border-color: #ccc #ccc #bbb #ccc;
	border-radius: 3px;
	background: #e6e6e6;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 15px 17px rgba(255, 255, 255, 0.5), inset 0 -5px 12px rgba(0, 0, 0, 0.05);
	color: rgba(0, 0, 0, .8);
	cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */
	-webkit-appearance: button; /* Corrects inability to style clickable 'input' types in iOS */
	font-size: 12px;
	line-height: 1;
	padding: .6em 1em .4em;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa #bbb;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), inset 0 15px 17px rgba(255, 255, 255, 0.8), inset 0 -5px 12px rgba(0, 0, 0, 0.02);
}
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	border-color: #aaa #bbb #bbb #bbb;
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5), inset 0 2px 5px rgba(0, 0, 0, 0.15);
}
input[type="checkbox"],
input[type="radio"] {
	padding: 0; /* Addresses excess padding in IE8/9 */
}
input[type="search"] {
	-webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
	-webkit-box-sizing: content-box; /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
	-moz-box-sizing:    content-box;
	box-sizing:         content-box;
}
input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
	-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
	border: 0;
	padding: 0;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
	color: #111;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"] {
	padding: 3px;
}
textarea {
	overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
	padding-left: 3px;
	vertical-align: top; /* Improves readability and alignment in all browsers */
}

/**
 * blockquote
 */
blockquote {
	border-left: #eee solid 5px;
	margin: 0.5em 0 0.5em 20px;
	padding: 0 0 0 20px;
}

/**
 * pre
 */
pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	max-width: 100%;
	overflow: auto;
	padding: 15px;
}

/**
 * abbr, acronym
 */
abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

/**
 * sup, sub
 */
sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {
	bottom: 1ex;
}
sub {
	top: .5ex;
}

/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}

/**
 * .wp-caption
 */
.wp-caption {
	border: none;
	text-align: left;
	background-color: transparent;
	margin-top: 20px;
	border-radius: 0;
	max-width: 100%;
}
.wp-caption-text {
	margin-top: 5px;
	font-size: 85%;
	line-height: 1.4;
	text-align: left;
}
.gallery-caption {
}

/**
 * Alignment
 */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/**
 * .sticky ( Sticky Posts )
 * Setting by layout.css
 */
.sticky {
}

/**
 * .bypostauthor
 */
.bypostauthor {
}

/**
 * .error etc
 */
.error,
.require,
.attention {
	color: #b70000;
}

/* トップページ */

#news ul, #news li, #news dl, #news dd {
  list-style: none;
  margin: 0;
  padding: 0
}
#news li {
	font-size:14px;
	line-height:20px;
	margin:0 0 20px 0;
}

#top_news {
	width:900px;
	margin:45px auto 60px auto;
	list-style: none;
}
#top_news li {
	list-style: none;
	padding-left:0;
	margin:0 0 20px 0;
	vertical-align:baseline;
}
.news_date {
	display: inline-block;
	width: 155px;
	color:#000;
}

.news_title{
	display: inline-block;
	width: 745px;
	color:#258f00;
}


/* フッター */



/* news お知らせ */
#news {
	background:#FFFFFF;
	min-height:10px;
}
.single-news .entry-date {
	font-size:18px;
	padding:15px 0 10px 0;
	font-weight:bold;
}

.single-news .entry-title {
	padding:0 0 30px 0;
	font-size:18px;
	font-weight:bold;
}

.single-news .nav-links {
	padding:30px 0 0px 0;
}


/* 『日記のもくじ』とは #diarymokuji  */
#diarymokuji {
	/* background:#99DD99; */
	background-image: url("/nikkinomokuji/wp-content/themes/mokuji/images/headers/diarymokuji.jpg");
	background-position:right center;
	background-size: cover;
	min-height:10px;
	padding:0 0 70px 0;
}
.diarymokuji_inner {
	width:800px;
	margin:0 auto;
	padding:0 10px;
}

/* アプリの各画面について #windowimage */
#windowimage {
	background:#f1f1eb;
	min-height:10px;
	padding:0 0 0 0;
}

/* 便利な機能 #useful  */
#useful {
	background:#fffeee;
	min-height:10px;
	padding:0 0 70px 0;
}

/* コンテンツ #content  */
#content {
	background:#ffffff;
	min-height:10px;
	padding:0 0 70px 0;
}

.single-contents .entry-title {
	padding:15px 0 15px 0;
	margin:0 !important;
	font-size:20px;
	font-weight:bold;
}

.single-contents .nav-links {
	padding:30px 0 10px 0;
}


/* バックアップについて #backup */
#backup {
	background:#f1f1eb;
	min-height:10px;
	padding:0 0 70px 0;
}
.backup_inner {
	width:900px;
	margin:0 auto;
	padding:0 10px;
}

/* よくあるご質問 #faq */
#faq {
	background:#FFFFFF;
	min-height:10px;
	padding:0 0 70px 0;
}
.faq_inner {
	width:900px;
	margin:0 auto;
	padding:0 10px;
}

.accordion {
	list-style: none;
}
.accordion .faq_content {
	display: none;
}
.accordion div{
	cursor: pointer;

}
.accordion li{
	margin:0 0 40px 0;
}
.faq_title {
	background: #ffffff;
	border:solid 1px #f1f1eb;
	padding:10px;
}
.faq_title_text {
	width:95%;
	float:left;
}
.faq_title_btn {
	width:5%;
	float:right;
}

.accordion .open {
	background: #f1f1eb;
	border:solid 1px #f1f1eb;
}

.faq_content {
	padding:0 0 0 0;
}
.faq_content p {
	margin:0 0 0 0;
}
.faq_arrow {
	float:right;
	padding:10px;
}



/* スライドショー */
#windowimage_slide_area {
	width:970px;
	margin:0 auto;
}
.windowimage_slide {
	width:880px;
	height:490px;
	margin:0 auto;
}

.windowimage_slide_left {
	width:430px;
	height:510px;
	float:left;
}
.windowimage_slide_right {
	width:450px;
	height:490px;
	float:right;
}
.windowimage_slide_content {
	padding:0px 0 0 0;
}
.windowimage_slide_right h3{
	padding:100px 0 0 0;
	font-size:24px;
}
.slider {
	padding:15px 80px 0 80px ;
	padding-top:15px;
	opacity: 0;
	height:80px;
}
.slick-initialized{
    opacity: 1
}

.slide-arrow {
	opacity: 1;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.slide-arrow:hover {
	opacity: 1;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.slick-prev{
	left:20px;
}
.slick-next{
	right:20px;

}
.prev-arrow {
	position:absolute;
	left:0px;
	top:200px;
	cursor: pointer;
}
.next-arrow {
	position:absolute;
	right:0px;
	top:200px;
	cursor: pointer;
}

.slick-arrow{
	z-index:1;
}


/* 便利な機能 */
.useful_inner {
	width:1020px;
	margin:0 auto;
}
.useful_area {
	width:300px;
	margin:0 60px 20px 0;
	float:left;
}
.useful_area:nth-child(3n) {
	margin:0 0 20px 0;
}

.useful_area img {
  width: 300px;
  height: 300px;
  object-fit: cover;
}
.useful_area h3{
	padding:0px 0 0 0;
	margin:26px 0 0px 0;
	font-size:24px;
}


/* コンテンツ */
.content_inner {
	width: 960px;
	margin:0 auto;
}

.archive-contents {
	width: 960px;
	margin:0 auto;
}
.content_area {
	width:300px;
	height:480px;
	margin:0 30px 20px 0;
	float:left;
}
.content_area:nth-child(3n) {
	margin:0 0 20px 0;
}

.content_area img {
  width: 300px;
  height: 200px;
  object-fit: cover;
}
.content_area h3{
	padding:0px 0 0 0;
	margin:26px 0 0px 0;
	font-size:24px;
}


/* バックアップ */
.backup_inner {
	width:880px;
	margin:0 auto;
}
.backup_area {
	width:880px;
	margin:50px 0px 20px 0;
}

.backup_area_image {
	width: 410px;
	float:left;
}
.backup_area_text {
	width: 450px;
	float:right;
	margin:0 0 0 20px;
}
.backup_area h3{
	padding:0px 0 0 0;
	margin:0px 0 0px 0;
	font-size:24px;
}

.slicknav_menu {
	display:none;/*PC時は非表示*/
}

/* スマホグローバルメニュー */
.smp-nav {
	display:none;/*モバイル時は表示*/
}
.global-nav {
	display:block;/*モバイル時は非表示*/
}


/* 834pxまでの幅の場合に適応される iPad等 */
@media screen and (max-width: 834px) {

	/* トップページ */

	/* news お知らせ */
	#top_news {
		width:90%;
		padding:0 10px;
	}
	.news_date {
		width: 100%;
	}
	.news_title{
		width: 100%;
	}
	.news_inner {
		width:90%;
		margin:0 auto;
	}



	/* 『日記のもくじ』とは #diarymokuji  */
	#diarymokuji {
		background-image: url("/nikkinomokuji/wp-content/themes/mokuji/images/headers/diarymokuji.jpg");
		background-position:right center;
	}
	.diarymokuji_inner {
		width:90%;
		margin:0 auto 40px auto;
	}

	/* アプリの各画面について #windowimage */

	/* 便利な機能 #useful  */

	/* コンテンツ #content  */

	/* バックアップについて #backup */
	.backup_inner {
		width:100%;
	}

	/* よくあるご質問 #faq */
	.faq_inner {
		width:100%;
	}
	.faq_title {
		position: relative;
	}

	.faq_title_text {
		width:85%;
		padding:0;
	}
	.faq_title_btn {
		width:15%;
		padding:0;
		position: absolute;
		top: 50%;
		left: 90%;
		-webkit-transform: translate(-50%, -50%); /* Safari用 */
		transform: translate(-50%, -50%);
	}

	/* スライドショー */
	#windowimage_slide_area {
		width:95%;
		height:auto;
	}
	.windowimage_slide {
		width:80%;
		height:350px;
	}

	.windowimage_slide_left {
		width:50%;
		height:375px;
	}
	.windowimage_slide_right {
		width:50%;
		height:350px;
	}

	.windowimage_slide_right h3{
	}
	.prev-arrow {
		top:100px;
	}
	.next-arrow {
		top:100px;
	}


	/* 便利な機能 */
	.useful_inner {
		width:90%;
		margin:0 auto;
	}
	.useful_area {
		width:100%;
		margin:0 auto 40px auto;
		float:none;
	}
	.useful_area:nth-child(3n) {
		margin:0;
	}

	.useful_area_image {
		text-align:center;
	}

	.useful_area img {
		width:465px;
		max-width: 465px;
		height: auto;
		margin:0 auto;
	}


	/* コンテンツ */
	.content_inner {
		width:90%;
		margin:0 auto;
	}
	.archive-contents {
		width:90%;
	}
	.content_area {
		width:465px;
		max-width: 465px;
		height:480px;
		margin:0 auto 50px auto;
		float:none;
	}
	.content_area:nth-child(3n) {
		margin:0 auto 50px auto;
	}

	.content_area_image {
		text-align:center;
	}

	.content_area img {
		width:465px;
		max-width: 465px;
		height: auto;
		margin:0 auto;
	}
	.content_area h3{
		padding:0px 0 0 0;
		margin:26px 0 0px 0;
		font-size:24px;
	}


	/* バックアップ */
	.backup_inner {
		width:90%;
	}
	.backup_area {
		width:90%;
		margin:50px 0px 20px 0;
	}

	.backup_area_image {
		width: 100%;
		float:none;
		margin:0 auto;
		text-align:center;
	}
	.backup_area_text {
		width: 100%;
		float:none;
		margin:0 0 20px 0px;
	}

	.faq_inner {
		width: 90%;
	}


}


/* 760pxまでの幅の場合に適応される iPad以下 */
@media screen and (max-width: 760px) {

	/* スマホグローバルメニュー */

	.global-nav {
		display:none;/*モバイル時は非表示*/
	}

	#header {
		display:none;
	}

	.slicknav_menu {
		display:block;/*モバイル時は表示*/
	}


	/* トップページ */

	/* news お知らせ */
	#top_news {
		width:90%;
		padding: 50px 10px 0 10px;
		margin-top:0px;
	}
	.news_date {
		width: 100%;
		float:none;
	}
	.news_title{
		padding:0px 0 0px 0;
		width: 100%;
		float:none;
	}
	.single-news .entry-date {
		padding: 15px 0 15px 0;
	}
	.single-news .entry-title {
	    padding: 0 0 10px 0;
	}
	.single-news .nav-links {
		padding: 30px 0 0px 0;
	}

	/* 『日記のもくじ』とは #diarymokuji  */
	#diarymokuji {
		background-image: url("/nikkinomokuji//wp-content/themes/mokuji/images/headers/diarymokuji_sp2.jpg");
	}
	#diarymokuji h2 {
		margin:45px 0 35px 0;
	}
	.diarymokuji_inner {
		width:90%;
	}

	/* アプリの各画面について #windowimage */
	#windowimage {
		height: 680px;
		overflow: hidden;
	}
	#windowimage h2 {
		margin:45px 0 35px 0;
	}


	/* 便利な機能 #useful  */

	/* コンテンツ #content  */

	/* バックアップについて #backup */
	.backup_inner {
		width:90%;
	}

	/* よくあるご質問 #faq */
	.faq_inner {
		width:90%;
	}

	.faq_title {
		position: relative;
	}

	.faq_title_text {
		width:85%;
		padding:0;
	}
	.faq_title_btn {
		width:15%;
		padding:0;
		position: absolute;
		top: 50%;
		left: 90%;
		-webkit-transform: translate(-50%, -50%); /* Safari用 */
		transform: translate(-50%, -50%);
	}


	/* スライドショー */
	#windowimage_slide_area {
		width:90%;
	}
	.windowimage_slide {
		width:80%;
	}

	.windowimage_slide_right h3 {
		margin:0;
	    padding: 0 0 0 0;
	}

	.windowimage_slide_left {
		width:100%;
		height:auto;
	}
	.windowimage_slide_right {
		width:100%;
		height:auto;
	}
	.windowimage_slide_content {
		height:100px;
		overflow:scroll;
	}

	.prev-arrow {
		top:200px;
		width:20px;
	}
	.next-arrow {
		top:200px;
		width:20px;
	}


	/* 便利な機能 */
	.useful_inner {
		width:90%;
		margin:0 auto;
		padding: 0 10px;
	}
	.useful_area {
		width:100%;
		margin:0 auto 40px auto;
		float:clear;
	}
	.useful_area:nth-child(3n) {
		margin:0;
	}

	.useful_area_image {
		text-align:center;
	}

	.useful_area img {
		width:100%;
		height: auto;
		margin:0 auto;
	}


	/* コンテンツ */
	.content_inner {
		width:90%;
		margin:0 auto;
		padding: 0 10px;
	}
	.content_area {
		width:100%;
		height:auto;
		margin:0 auto 50px auto;
		float:none;
	}
	.content_area:nth-child(3n) {
		margin:0 auto 50px auto;
	}

	.content_area_image {
		text-align:center;
	}

	.content_area img {
		width:100%;
		height: auto;
		margin:0 auto;
	}
	.content_area h3{
		padding:0px 0 0 0;
		margin:26px 0 0px 0;
		font-size:24px;
	}


	/* バックアップ */
	.backup_inner {
		width:90%;
	}
	.backup_area {
		width:100%;
		margin:50px 0px 20px 0;
	}

	.backup_area_image {
		width: 100%;
		float:none;
		margin:0 auto;
		text-align:center;
	}
	.backup_area_text {
		width: 100%;
		float:none;
		margin:0 0 20px 0px;
	}

	/* よくあるご質問 */
	.accordion li{
		margin:0 0 30px 0;
	}

}

/* アプリの各画面について用 */
@media screen and (max-width: 768px) {
	/* アプリの各画面について #windowimage */
	.windowimage_slide_left {
		height:345px;
	}
}

/* アプリの各画面について用 */
@media screen and (max-width: 550px) {
	/* アプリの各画面について #windowimage */
	#windowimage {
		height: 650px;
	}
}

/* アプリの各画面について用 */
@media screen and (max-width: 414px) {
	/* アプリの各画面について #windowimage */
	#windowimage {
		height: 590px;
	}
}
/* アプリの各画面について用 */
@media screen and (max-width: 375px) {
	/* アプリの各画面について #windowimage */
	#windowimage {
		height: 560px;
	}
}

/* アプリの各画面について用 */
@media screen and (max-width: 360px) {
	/* アプリの各画面について #windowimage */
	#windowimage {
		height: 550px;
	}
}