/*
Theme Name: School Blog
Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: SYT System
Author URI: https://wordpress.org/
Description: Twenty Seventeen brings your site to life with header video and immersive featured images. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Normalize
2.0 Accessibility
3.0 Alignments
4.0 Clearings
5.0 Typography
6.0 Forms
7.0 Formatting
8.0 Lists
9.0 Tables
10.0 Links
11.0 Featured Image Hover
12.0 Navigation
13.0 Layout
   13.1 Header
   13.2 Front Page
   13.3 Regular Content
   13.4 Posts
   13.5 Pages
   13.6 Footer
14.0 Comments
15.0 Widgets
16.0 Media
   16.1 Galleries
17.0 Customizer
18.0 SVGs Fallbacks
19.0 Media Queries
20.0 Print
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 Normalize
Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css
--------------------------------------------------------------*/

html {
	font-family: sans-serif;
	line-height: 1.15;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;
}
article,
aside,
footer,
header,
nav,
section,
figcaption,
figure,
main {
	display: block;
}
figure {
	margin: 1em 0;
}
hr {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}
a {
	background-color: transparent;
	-webkit-text-decoration-skip: objects;
}
a:active,
a:hover {
	outline-width: 0;
}
abbr[title] {
	border-bottom: 1px #767676 dotted;
	text-decoration: none;
}
b,
strong {
	font-weight: bold;
}
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}
dfn {
	font-style: italic;
}
mark {
	background-color: #eee;
	color: #222;
}
small {
	font-size: 80%;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
audio,
video {
	display: inline-block;
}
audio:not([controls]) {
	display: none;
	height: 0;
}
img {
	border-style: none;
}
svg:not(:root) {
	overflow: hidden;
}
button,
input,
optgroup,
select,
textarea {
	font-family: sans-serif;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}
button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}
button,
html [type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}
fieldset {
	border: 1px solid #bbb;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}
legend {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}
progress {
	display: inline-block;
	vertical-align: baseline;
}
textarea {
	overflow: auto;
}
[type="checkbox"],
[type="radio"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}
details,
menu {
	display: block;
}
summary {
	display: list-item;
}
canvas {
	display: inline-block;
}
template {
	display: none;
}
[hidden] {
	display: none;
}

/*--------------------------------------------------------------
2.0 Accessibility
--------------------------------------------------------------*/

/* Text meant only for screen readers. */

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus {
	background-color: #f1f1f1;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/*--------------------------------------------------------------
3.0 Alignments
--------------------------------------------------------------*/

.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;
}
div.aligncenter,
p.aligncenter {
	text-align: center;
}

/*--------------------------------------------------------------
4.0 Clearings
--------------------------------------------------------------*/

.clear:before,
.clear:after,
.headertop:after,
.entry-content:before,
.entry-content:after,
.entry-footer:before,
.entry-footer:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after,
.nav-links:before,
.nav-links:after,
.pagination:before,
.pagination:after,
.widget-area:before,
.widget-area:after,
.widget:before,
.widget:after {
	content: "";
	display: table;
	table-layout: fixed;
}
.clear:after,
.entry-content:after,
.entry-footer:after,
.site-header:after,
.site-content:after,
.site-footer:after,
.nav-links:after,
.pagination:after,
.widget-area:after,
.widget:after,
.comment-meta:after {
	clear: both;
}

/*--------------------------------------------------------------
5.0 Typography
--------------------------------------------------------------*/

body,
button,
input,
select,
textarea {
	color: #333;
	font-family: Meiryo, sans-serif;
	font-size: 15px;
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.5;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	line-height: 1.4;
	margin: 0 0 0.75em;
	padding: 0.5em 0 0;
	font-weight: 600;
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
	padding-top: 0;
}
h1 {
	margin: 0.67em 0;
	font-size: 18px;
	font-size: 1.125rem;
}
h2 {
	color: #666;
	font-size: 18px;
	font-size: 1.125rem;
}
h3 {
	font-size: 16px;
	font-size: 1rem;
}
h4 {
	color: #333;
	font-size: 15px;
	font-size: 0.9375rem;
}
h5 {
	color: #767676;
	font-size: 13px;
	font-size: 0.8125rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}
h6 {
	color: #333;
	font-size: 15px;
	font-size: 0.9375rem;
}
p {
	margin: 0 0 1em;
	padding: 0;
}
dfn,
cite,
em,
i {
	font-style: italic;
}
blockquote {
	margin: 0 1.5em;
	font-size:15px;
}
.entry-content blockquote {
	margin: 0 0 1.5em;
	padding:1em;
	border: 1px solid #ddd6a1;
	background-color: #faf9f1;
}
address {
	margin: 0 0 1.5em;
}
pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}
.detail {
	background: #eee;
	font-size: 15px;
	font-size: 0.9375rem;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}
code,
kbd,
tt,
var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}
abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}
mark,
ins {
	background: #eee;
	text-decoration: none;
}
big {
	font-size: 125%;
}
blockquote {
	quotes: "" "";
}
q {
	quotes: "“" "”" "‘" "’";
}
blockquote:before,
blockquote:after {
	content: "";
}
:focus {
	outline: none;
}

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

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: 100%;
}

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: 2.5em;
	max-width: 100%;
}
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;
}

/* Placeholder text color -- selectors need to be separate to work. */
::-webkit-input-placeholder {
	color: #333;
	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
}
:-moz-placeholder {
	color: #333;
	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
}
::-moz-placeholder {
	color: #333;
	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
	opacity: 1;
	/* Since FF19 lowers the opacity of the placeholder by default */
}
:-ms-input-placeholder {
	color: #333;
	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
}

/*--------------------------------------------------------------
7.0 Formatting
--------------------------------------------------------------*/

hr {
	background-color: #bbb;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

/*--------------------------------------------------------------
8.0 Lists
--------------------------------------------------------------*/

ul,
ol {
	margin: 0 0 1.5em;
	padding: 0;
}
.entry-content ul,
.entry-content ol {
	margin-left: 1.5em;
}
ul {
	list-style: disc;
}
ol {
	list-style: decimal;
}
li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}
dt {
	font-weight: 700;
}
dd {
	margin: 0 1.5em 1.5em;
}

/*--------------------------------------------------------------
9.0 Tables
--------------------------------------------------------------*/

table {
	border-collapse: collapse;
	margin: 0 0 1.5em;
	width: 100%;
}
thead th {
	border-bottom: 2px solid #bbb;
	padding-bottom: 0.5em;
}
th {
	padding: 6px 10px;
	text-align: left;
}
tr {
	border-bottom: 1px solid #cccccc;
}
td {
	padding: 6px 10px;
}
table .odd td {
	background-color: #f9f9f9;
}
/*
th:first-child,
td:first-child {
	padding-left: 0;
}
th:last-child,
td:last-child {
	padding-right: 0;
}
*/

/*--------------------------------------------------------------
10.0 Links
--------------------------------------------------------------*/

a {
	color: #3d3d41;
	text-decoration: none;
}
a:focus,
a:hover,
a:active {
	color: #999999;
	outline: 0;
}

/* Hover effects */

.entry-content a,
.entry-summary a,
.widget a,
.posts-navigation a,
.widget_authors a strong {
	-webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
	box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
	-webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
	transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
	transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
	transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out;
}
.entry-title a,
.entry-meta a,
.page-links a,
.page-links a .page-number,
.entry-footer a,
.entry-footer .cat-links a,
.entry-footer .tags-links a,
.edit-link a,
.post-navigation a,
.logged-in-as a,
a .nav-title,
.pagination a,
.site-info a,
.widget .widget-title a,
.widget ul li a,
.site-footer .widget-area ul li a,
.site-footer .widget-area ul li a {
	-webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
	text-decoration: none;
	-webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
	transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
	transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
	transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out;
}

.entry-content a:focus,
.entry-content a:hover,
.entry-summary a:focus,
.entry-summary a:hover,
.widget a:focus,
.widget a:hover,
.site-footer .widget-area a:focus,
.site-footer .widget-area a:hover,
.posts-navigation a:focus,
.posts-navigation a:hover,
.widget_authors a:focus strong,
.widget_authors a:hover strong,
.entry-title a:focus,
.entry-title a:hover,
.entry-meta a:focus,
.entry-meta a:hover,
.page-links a:focus .page-number,
.page-links a:hover .page-number,
.entry-footer a:focus,
.entry-footer a:hover,
.post-navigation a:focus,
.post-navigation a:hover,
.pagination a:not(.prev):not(.next):focus,
.pagination a:not(.prev):not(.next):hover,
.logged-in-as a:focus,
.logged-in-as a:hover,
a:focus .nav-title,
a:hover .nav-title,
.edit-link a:focus,
.edit-link a:hover,
.site-info a:focus,
.site-info a:hover,
.widget .widget-title a:focus,
.widget .widget-title a:hover,
.widget ul li a:focus,
.widget ul li a:hover {
	color: #000;
	-webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
	box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 2px 0 rgba(0, 0, 0, 1);
}

/* Fixes linked images */

.entry-content a img,
.widget a img {
	-webkit-box-shadow: none;
	box-shadow: none;
}
/*
.entry-content a img,
.widget a img {
	-webkit-box-shadow: 0 0 0 9px #fff;
	box-shadow: 0 0 0 9px #fff;
}
*/
.post-navigation a:focus .icon,
.post-navigation a:hover .icon {
	color: #222;
}
/* SVG Icons base styles */

.icon {
	display: inline-block;
	fill: currentColor;
	height: 1em;
	position: relative; /* Align more nicely with capital letters */
	top: -0.0625em;
	vertical-align: middle;
	width: 1em;
}
.entry-content h4 {
	position: relative;
	top:0;
	left: 0;
	margin: 0 0 20px;
	padding: 4px 0 0 22px;
	min-height: 30px;
}
.entry-content h4:before{
	display: block;
	position: absolute;
	top: 6.06%;
	left: 0;
	content :"";
	width: 5px;
	height: 87.88%;
	background-color: #ff0000;
}

/*--------------------------------------------------------------
11.0 Featured Image Hover
--------------------------------------------------------------*/

.post-thumbnail {
	margin-bottom: 1em;
}
.post-thumbnail a img {
	-webkit-backface-visibility: hidden;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
}
.post-thumbnail a:hover img,
.post-thumbnail a:focus img {
	opacity: 0.7;
}

/*--------------------------------------------------------------
12.0 Navigation
--------------------------------------------------------------*/

.main-navigation a {
	color: #fff;
	font-weight: 600;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}
.navigation-top .current-menu-item > a,
.navigation-top .current_page_item > a {
	color: #767676;
}
.main-navigation {
	display: block;
	width: 100%;
}
.main-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0 1em;
	text-align: left;
}

/* Hide the menu on small screens when JavaScript is available.
 * It only works with JavaScript.
 */
/*
.js .main-navigation ul,
.main-navigation .menu-item-has-children > a > .icon,
.main-navigation .page_item_has_children > a > .icon,
.main-navigation ul a > .icon {
	display: none;
}

.main-navigation > div > ul {
	border-top: 1px solid #eee;
	padding: 0.75em 1.695em;
}
*/
.js .main-navigation.toggled-on > div > ul {
	display: block;
}
.main-navigation ul ul.toggled-on {
	display: block;
}
.main-navigation ul ul a {
	padding: 0.4em 0;
	position: relative;
	text-transform: none;
}
.main-navigation li {
	border-bottom: 1px solid #939393;
	position: relative;
}
.main-navigation li li,
.main-navigation li:last-child {
	border: 0;
}
.main-navigation a {
	display: block;
	padding: 0.5em;
	text-decoration: none;
}
.main-navigation ul ul a {
	padding-left: 1.5em;
	letter-spacing: 0;
	position: relative;
	text-transform: none;
}
.main-navigation a:hover {
	color: #e6e6e6;
	background: #222;
}

/* Menu toggle */

.menu-toggle {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 1200;
	width: 48px;
	height: 48px;
	background-color: #fff;
	border: 1px solid #d1d1d1;
	color: #222;
	display: block;
	padding: 12px;
	text-align: center;
	overflow: hidden;
}
.menu-toggle.menu-active {
    -webkit-transition: all 0.3s ease;
       -moz-transition: all 0.3s ease;
            transition: all 0.3s ease;
}

/* Display the menu toggle when JavaScript is available. */

.js .menu-toggle {
	display: block;
}
.main-navigation.toggled-on ul.nav-menu {
	display: block;
}
.menu-toggle:hover,
.menu-toggle:focus {
	background-color: #000;;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: #fff;
}
.menu-toggle:focus {
	outline: thin solid;
}
.menu-toggle .icon {
	width: 24px;
	height: 24px;
}
.menu-toggle.menu-active .icon-bars,
.menu-toggle .icon-close {
	display: none;
}
.menu-toggle.menu-active .icon-close {
	display: inline-block;
}

/* Dropdown Toggle */

.dropdown-toggle {
	background-color: transparent;
	border: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: #222;
	display: block;
	font-size: 16px;
	right: -0.5em;
	line-height: 1.5;
	margin: 0 auto;
	padding: 0.5em;
	position: absolute;
	text-shadow: none;
	top: 0;
}
.dropdown-toggle:hover,
.dropdown-toggle:focus {
	background: transparent;
}
.dropdown-toggle:focus {
	outline: thin dotted;
}
.dropdown-toggle.toggled-on .icon {
	-ms-transform: rotate(-180deg); /* IE 9 */
	-webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
	transform: rotate(-180deg);
}


/*--------------------------------------------------------------
13.0 Layout
--------------------------------------------------------------*/

html {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
*,
*:before,
*:after {
	/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}
body {
	background: #fff;
	/* Fallback for when there is no custom background color defined. */
}
body {
	background-image: url("images/background_1.jpg");
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	height: 100vh;
}
body.blog-oizumi {
	background-image: url("images/background_2.jpg");
}
body.blog-imabari {
	background-image: url("images/background_5.jpg");
}
body.blog-azamino,
body.blog-hasebe {
	background-image: url("images/background_4.jpg");
}
#page {
	position: relative;
	word-wrap: break-word;
}
.wrap,
.grid {
	margin-left: auto;
	margin-right: auto;
	max-width: 1248px;
	padding-left: 1em;
	padding-right: 1em;
}
.wrap:after,
.grid:after,
.catlist:after,
.grid-pad:after {
	clear: both;
	content: "";
	display: block;
}
.grid-pad [class*='col-'] {
	float: left;
	min-height: 1px;
}
.grid {
	width: 100%;
	max-width: 1200px;
	min-width: 0 !important;
	overflow: hidden;
}
/*
.grid {
	padding-left: 30px; 
	padding-right: 0;
}
*/

.catlist .item {
	background-color: #fff;
	padding: 16px;
	margin-bottom: 16px;
}
.catlist .item .catimg {
	text-align: center;
}
.catlist .item .catimg img {
	max-height: 240px;
	width: auto;
}

.fullwidth .grid-pad {
	padding-top: 12px;
	padding-left: 10px;
	padding-right: 10px;
}
.grid-pad:last-child {
	margin-bottom: 12px;
}

.col-1-4 p {
	margin-bottom: 8px;
	font-size: 14px;
}
.col-1-4 h3,
.col-1-4 h4 {
	font-size: 16px;
	line-height: 1.59;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
/* Content Columns */
.col-1-1 {
	width: 100%;
}
.col-1-2, .col-6-12 {
	width: 50%;
}
.col-1-3, .col-4-12 {
	width: 33.33%;
}
.col-1-4, .col-3-12 {
	width: 25%;
}
, .col-8-12 {
	width: 66.66%;
}
.col-3-4, .col-9-12 {
	width: 75%;
}
.col-1-5 {
	width: 20%;
}
.col-1-6, .col-2-12 {
	width: 16.667%;
}
.col-1-7 {
	width: 14.28%;
}
.col-1-8 {
	width: 12.5%;
}
.col-1-9 {
	width: 11.1%;
}
.col-1-10 {
	width: 10%;
}
.col-1-11 {
	width: 9.09%;
}
.col-1-12 {
	width: 8.33%
}
/* Layout Columns */
.col-11-12 {
	width: 91.66%
}
.col-10-12 {
	width: 83.333%;
}
.col-9-12 {
	width: 75%;
}
.col-5-12 {
	width: 41.66%;
}
.col-7-12 {
	width: 58.33%
}

/* masonry */
#grid {
	width: 100%;
	overflow:auto;
}
.grid-item {
	width: 100%;
	padding: 12px;
	overflow: hidden;
	margin-bottom: 12px;
}

.pc {
	display: none;
}

#pagetop {
	display: none;
	background-color: #fff;
	height: 50px;
	width: 50px;
	border-radius: 25px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	position: fixed;
	right: 10px;
	bottom: 20px;
	z-index: 200;
	padding: 0;
	border: 1px solid #666666;
	color: #000;
}
#pagetop .icon {
	width: 24px;
	height: 24px;
	-ms-transform: rotate(-90deg); /* IE 9 */
	-webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
	transform: rotate(-90deg);
}

/*--------------------------------------------------------------
13.1 Header
--------------------------------------------------------------*/

#masthead .wrap {
	position: relative;
}
.site-header {
	background-color: #fff;
	position: relative;
}

/* Site branding */

.site-branding {
	padding: 0;
	z-index: 10;
	position: relative;
}
.site-branding a {
	text-decoration: none;
}
.site-branding a:hover,
.site-branding a:focus {
	opacity: 0.7;
}
.headertop {
	background-color: #ffab2e;
	font-size: 13px;
	line-height: 1;
	color: #fff;
	border-bottom: 5px solid #fe7f10;
}
.headertop .corelogo {
	float: left;
}
.headertop ul {
	float: right;
	margin: 0.5em 1em 0;
}
.headertop ul li {
	display: inline-block;
	margin-bottom: 0;
	padding: 0.5em;
}
	.site-branding {
		display: table;
		width: 100%;
	}
.site-logo {
	width: 100%;
	display: table-cell;
	vertical-align: middle;
	padding: 0.25em 0.25em 0;
	background-color: #ffab2e;
	text-align: center;
}
.custom-logo-link a:hover,
.custom-logo-link a:focus {
	opacity: 0.9;
}
.site-title h1,
.site-title p {
	font-size: 13px;
	line-height: 1.25;
	margin-top: -0.5em;;
	font-weight: 400;
}
.site-title,
.site-title a {
	color: #222;
	opacity: 1; /* Prevent opacity from changing during selective refreshes in the customize preview */
}

.site-description {
	color: #666;
	font-size: 14px;
	font-size: 0.875rem;
	margin-bottom: 0.5em;
}
.custom-header {
	position: relative;
	height: 180px;
}
.home .custom-header,
.has-header-video.home.blog .custom-header {
	height: 280px;
	width: 100%;
}
/*
.home .custom-header,
.home.blog .custom-header,
.has-header-video.home.blog .custom-header {
	height: 280px;
	width: 100%;
}
*/
.home .custom-header-media {
	width: 100%;
	position: relative;
	height:  280px;
}
.custom-header-media img {
	position: absolute;
	height: auto;
	left: 50%;
	max-width: 100%;
	min-height: 50%;
	min-width: 100%;
	min-width: 50vw; /* vw prevents 1px gap on left that 100% has */
	width: auto;
	top: 50%;
	padding-bottom: 1px; /* Prevent header from extending beyond the footer */
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
		-o-object-fit: cover;
		object-fit: cover;
}
/* For browsers that support 'object-fit' */
	.custom-header-media img,
	.custom-header-media video,
	.custom-header-media iframe {
		height: 100%;
		left: 0;
		-o-object-fit: cover;
		object-fit: cover;
		top: 0;
		-ms-transform: none;
		-moz-transform: none;
		-webkit-transform: none;
		transform: none;
		width: 100%;
	}

/*--------------------------------------------------------------
13.2 Front Page
--------------------------------------------------------------*/

.twentyseventeen-panel,
.panel {
	overflow: hidden;
	position: relative;
}
.panel .wrap {
	position: relative;
}
.panel-content {
	position: relative;
}
.panel-content p:last-child {
	margin-bottom: 0;
}
.panel-content .wrap {
	padding-bottom: 1em;
	padding-top: 1em;
}
.bgwhite {
	background-color: #fff;
}
.content-area article.bggray,
.bggray {
	background-color: #f5f5f5;
}

/*--------------------------------------------------------------
13.3 Regular Content
--------------------------------------------------------------*/

.site-content {
	position: relative;
	padding: 0.5em 0 0;
}
/*
.site-content {
	background-color: #fff0b3;
	position: relative;
	padding: 0.5em 0 0;
}
*/
.content-area {
	background: #fff;
	padding: 16px;
}
/*
.content-area article,
.content-area .page-header,
.taxonomy-description {
	background: #fff;
	padding: 16px;
}
*/

.fullwidth .content-area article {
	width: 100%;
	padding: 0;
}
.categorydesc {
}
.breadcrumbs {
	font-size: 13px;
	padding: 5px;
}


/*--------------------------------------------------------------
13.4 Posts
--------------------------------------------------------------*/

/* Post Landing Page */

.sticky {
	position: relative;
}
.post:not(.sticky) .icon-thumb-tack {
	display: none;
}
.sticky .icon-thumb-tack {
	display: block;
	height: 18px;
	left: -1.5em;
	position: absolute;
	top: 1.65em;
	width: 20px;
}

.entry-title a {
	color: #1a1a1a;
	text-decoration: none;
}
.entry-title a:hover{
	color: #6e8929 !important;
}
.page-title,
body.page:not(.home) .entry-title {
	color: #1a1a1a;
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 2px;
	border-left: 12px solid #0099ff;
	border-bottom: 1px solid #0099ff;
	padding: 6px 6px 6px 20px;
	background-color: #e6f5ff;
}
body.page:not(.home) .entry-header {
	margin: 0 0 1.5em;
	border-bottom: 1px solid #0099ff;
}
.content-area .page-header .page-title {
	margin-bottom: 0.75em;
}
.content-area .page-header,
.taxonomy-description {
	margin-bottom: 1.25em;
}
.entry-meta {
	color: #767676;
	font-size: 11px;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.1818em;
	padding-bottom: 0.25em;
}
.entry-meta a {
	color: #767676;
}
.byline,
.updated:not(.published) {
	display: none;
}
.single .byline,
.group-blog .byline {
	display: inline;
}
.pagination {
	border-top: 1px solid #eee;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: 600;
	padding: 2em 0 2em;
	text-align: center;
}
.pagination .icon {
	width: 0.666666666em;
	height: 0.666666666em;
}
.page-numbers {
	display: none;
	padding: 0.5em 0.75em;
}
.page-numbers.current {
	color: #767676;
	display: inline-block;
}
.page-numbers.current .screen-reader-text {
	clip: auto;
	height: auto;
	overflow: auto;
	position: relative !important;
	width: auto;
}
.prev.page-numbers,
.next.page-numbers {
	background-color: #ddd;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	display: inline-block;
	font-size: 24px;
	font-size: 1.5rem;
	line-height: 1;
	padding: 0.25em 0.5em 0.4em;
}
.prev.page-numbers,
.next.page-numbers {
	-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
}
.prev.page-numbers:focus,
.prev.page-numbers:hover,
.next.page-numbers:focus,
.next.page-numbers:hover {
	background-color: #767676;
	color: #fff;
}
.prev.page-numbers {
	float: left;
}
.next.page-numbers {
	float: right;
}

/* Aligned blockquotes */

.entry-content blockquote.alignleft,
.entry-content blockquote.alignright {
	color: #666;
	font-size: 13px;
	font-size: 0.8125rem;
	width: 48%;
}

/* Blog landing, search, archives */

.blog .site-main > article,
.archive .site-main > article,
.search .site-main > article {
	margin-bottom: 2em;
}

.blog .entry-meta a.post-edit-link,
.archive .entry-meta a.post-edit-link,
.search .entry-meta a.post-edit-link {
	color: #222;
	display: inline-block;
	margin-left: 1em;
	white-space: nowrap;
}
.search .page .entry-meta a.post-edit-link {
	margin-left: 0;
	white-space: nowrap;
}
.taxonomy-description {
	color: #666;
	font-size: 13px;
	font-size: 0.8125rem;
}

/* More tag */

.entry-content .more-link:before {
	content: "";
	display: block;
	margin-top: 1.5em;
}/*
.btn-more-area {
	margin: 0 0 5px;
	text-align: right;
}
*/
.link-more {
	text-align: right;
	margin: 0 0 8px;
}
.more-link {
	display: inline-block;
	padding: 5px 8px 3px;
	border-radius: 5px;
	background-color: #6f8c30;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: #fff;
	font-size: 12px;
}
.more-link:hover {
	filter: alpha(opacity=70);
　	-moz-opacity:0.7;
	opacity:0.7;
	color: #fff;
}

/* Single Post */

.single-featured-image-header {
	background-color: #fafafa;
	border-bottom: 1px solid #eee;
}
.single-featured-image-header img {
	display: block;
	margin: auto;
}
.page-links {
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: 800;
	padding: 2em 0 3em;
}
.page-links .page-number {
	color: #767676;
	display: inline-block;
	padding: 0.5em 1em;
}
.page-links a {
	display: inline-block;
}
.page-links a .page-number {
	color: #222;
}

/* Entry footer */

.entry-footer {
	border-bottom: 1px solid #eee;
	border-top: 1px solid #eee;
	margin-top: 2em;
	padding: 2em 0;
}
.entry-footer .cat-links,
.entry-footer .tags-links {
	display: block;
	font-size: 11px;
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.1818em;
	padding-left: 2.5em;
	position: relative;
	text-transform: uppercase;
}
.entry-footer .cat-links + .tags-links {
	margin-top: 1em;
}
.entry-footer .cat-links a,
.entry-footer .tags-links a {
	color: #333;
}
.entry-footer .cat-links .icon,
.entry-footer .tags-links .icon {
	color: #767676;
	left: 0;
	margin-right: 0.5em;
	position: absolute;
	top: 2px;
}
.entry-footer .edit-link {
	display: inline-block;
}
.entry-footer .edit-link a.post-edit-link {
	background-color: #222;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: #fff;
	display: inline-block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: 800;
	margin-top: 2em;
	padding: 0.7em 2em;
	-webkit-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
	white-space: nowrap;
}
.entry-footer .edit-link a.post-edit-link:hover,
.entry-footer .edit-link a.post-edit-link:focus {
	background-color: #767676;
}

/* Post Formats */

.blog .format-status .entry-title,
.archive .format-status .entry-title,
.blog .format-aside .entry-title,
.archive .format-aside .entry-title {
	display: none;
}
.format-quote blockquote {
	color: #333;
	font-size: 20px;
	font-size: 1.25rem;
	font-weight: 300;
	overflow: visible;
	position: relative;
}
.format-quote blockquote .icon {
	display: block;
	height: 20px;
	left: -1.25em;
	position: absolute;
	top: 0.4em;
	-webkit-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	transform: scale(-1, 1);
	width: 20px;
}


/* Post Navigation */

.post-navigation {
	font-weight: 700;
	margin: 1.5em 0;
}
.post-navigation .nav-links {
	padding: 1em 0;
}
.nav-subtitle {
	background: transparent;
	color: #767676;
	display: block;
	font-size: 11px;
	font-size: 0.6875rem;
	letter-spacing: 0.1818em;
	margin-bottom: 1em;
	text-transform: uppercase;
}
.nav-title {
	color: #333;
	font-size: 15px;
	font-size: 0.9375rem;
}
.post-navigation .nav-next {
	margin-top: 1.5em;
}
.nav-links .nav-previous .nav-title .nav-title-icon-wrapper {
	margin-right: 0.5em;
}
.nav-links .nav-next .nav-title .nav-title-icon-wrapper {
	margin-left: 0.5em;
}

/*--------------------------------------------------------------
13.5 Pages
--------------------------------------------------------------*/

.page-header {
	padding-bottom: 0.5em;
}
.page .entry-header .edit-link {
	font-size: 14px;
	font-size: 0.875rem;
}
.search .page .entry-header .edit-link {
	font-size: 11px;
	font-size: 0.6875rem;
}
.page-links {
	clear: both;
	margin: 0 0 1.5em;
}
.page:not(.home) #content {
	padding-bottom: 1.5em;
}

/* 404 page */

.error404 .page-content {
	padding-bottom: 4em;
}
.error404 .page-content .search-form,
.search .page-content .search-form {
	margin-bottom: 3em;
}

/*--------------------------------------------------------------
13.6 Footer
--------------------------------------------------------------*/

.site-footer {
	border-top: 1px solid #eee;
	background: #f1f1f1;
}
.site-footer .wrap {
	padding-bottom: 1.5em;
	padding-top: 2em;
}
.foot2 {
	background: #ffac2f;
}
/* Footer widgets */

.site-footer .widget-area {
	padding-bottom: 2em;
	padding-top: 2em;
}
.site-footer ul {
	margin-left: 1.5em;
}

/* Social nav */

footer .social-navigation ul {
	margin-left: 0;
}

/* Site info */

.site-info {
	font-size: 14px;
	font-size: 0.875rem;
	padding: 0.7em 0 0;
}
.site-info a {
	color: #333;
}
.site-info .sep {
	margin: 0;
	display: block;
	visibility: hidden;
	height: 0;
	width: 100%;
}
.copy {
	padding: 10px 0;
	display: block;
	font-size: 15px;
	line-height: 1.5;
}



/*--------------------------------------------------------------
14.0 Comments
--------------------------------------------------------------*/

/*--------------------------------------------------------------
15.0 Widgets
--------------------------------------------------------------*/

.widget {
	margin: 0 0 20px;
	padding-bottom: 3em;
}
#secondary {
	padding: 1em 0 2em;
}
.widget-area section {
	background: #fff;
	padding: 16px;
	border: 1px solid #f3f3f3;
}
h3.widget-title,
h2.widget-title {
	color: #222;
	font-size: 14px;
	font-size: 0.9375rem;
	font-weight: 700;
	margin-bottom: 1em;
}
.widget-title a {
	color: inherit;
}

/* widget forms */

.widget select {
	width: 100%;
}

/* widget lists */

.widget ul {
	list-style: none;
	margin: 0;
}
.widget ul li {
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	padding: 0.5em 0;
}
.widget ul li + li {
	margin-top: -1px;
}
.widget ul li ul {
	margin: 0 0 -1px;
	padding: 0;
	position: relative;
}
.widget ul li li {
	border: 0;
	padding-left: 24px;
	padding-left: 1.5rem;
}

/* Widget lists of links */

.widget_top-posts ul li ul,
.widget_rss_links ul li ul,
.widget-grofile ul.grofile-links li ul,
.widget_pages ul li ul,
.widget_meta ul li ul {
	bottom: 0;
}
.widget_nav_menu ul li li,
.widget_top-posts ul li,
.widget_top-posts ul li li,
.widget_rss_links ul li,
.widget_rss_links ul li li,
.widget-grofile ul.grofile-links li,
.widget-grofile ul.grofile-links li li {
	padding-bottom: 0.25em;
	padding-top: 0.25em;
}
.widget_rss ul li {
	padding-bottom: 1em;
	padding-top: 1em;
}

/* widget markup */

.widget .post-date,
.widget .rss-date {
	font-size: 0.81em;
}

/* Text widget */

.widget_text {
	word-wrap: break-word;
}

/* RSS Widget */

.widget_rss .widget-title .rsswidget:first-child {
	float: right;
}
.widget_rss .widget-title .rsswidget:first-child:hover {
	background-color: transparent;
}
.widget_rss .widget-title .rsswidget:first-child img {
	display: block;
}
.widget_rss ul li {
	padding: 2.125em 0;
}
.widget_rss ul li:first-child {
	border-top: none;
	padding-top: 0;
}

/* Recent Posts widget */

.widget_recent_entries .post-date {
	display: block;
}
.widget_recent_entries a {
	display: block;
}
.widget_recent_entries img {
	width: 75px;
	height: 75px;
	float: left;
	margin-bottom: 4px;
	margin-right: 5px;
}

.widget_rss li .rsswidget {
	font-size: 22px;
	font-size: 1.375rem;
	font-weight: 300;
	line-height: 1.4;
}
.widget_rss .rss-date,
.widget_rss li cite {
	color: #767676;
	display: block;
	font-size: 10px;
	font-size: 0.625rem;
	font-style: normal;
	font-weight: 800;
	letter-spacing: 0.18em;
	line-height: 1.5;
	text-transform: uppercase;
}
.widget_rss .rss-date {
	margin: 0.5em 0 1.5em;
	padding: 0;
}
.widget_rss .rssSummary {
	margin-bottom: 0.5em;
}

/* Contact Info Widget */

.widget_contact_info .contact-map {
	margin-bottom: 0.5em;
}

/* Gravatar */

.widget-grofile h4 {
	font-size: 16px;
	font-size: 1rem;
	margin-bottom: 0;
}



/* Search */

.site-header input[type="search"] {
	padding: 0.2em;
	width: 100%;
}
.search-form {
	position: relative;
}
.search-form .search-submit {
	bottom: 3px;
	padding: 0.25em 0.5em;
	position: absolute;
	right: 3px;
	top: 3px;
}
.search-form .search-submit .icon {
	height: 18px;
	top: -2px;
	width: 18px;
}

/* Tag cloud widget */

.tagcloud,
.widget_tag_cloud,
.wp_widget_tag_cloud {
	line-height: 1.5;
}
.widget .tagcloud a,
.widget.widget_tag_cloud a,
.wp_widget_tag_cloud a {
	border: 1px solid #ddd;
	-webkit-box-shadow: none;
	box-shadow: none;
	display: inline-block;
	float: left;
	font-size: 14px !important; /* !important to overwrite inline styles */
	font-size: 0.875rem !important;
	margin: 4px 4px 0 0 !important;
	padding: 4px 10px 5px !important;
	position: relative;
	-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
	width: auto;
	word-wrap: break-word;
	z-index: 0;
}
.widget .tagcloud a:hover,
.widget .tagcloud a:focus,
.widget.widget_tag_cloud a:hover,
.widget.widget_tag_cloud a:focus,
.wp_widget_tag_cloud a:hover,
.wp_widget_tag_cloud a:focus {
	border-color: #bbb;
	-webkit-box-shadow: none;
	box-shadow: none;
	text-decoration: none;
}

/* Calendar widget */

.widget_calendar th,
.widget_calendar td {
	text-align: center;
}
.widget_calendar tfoot td {
	border: 0;
}

/*--------------------------------------------------------------
16.0 Media
--------------------------------------------------------------*/

img,
video {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}
img.alignleft,
img.alignright {
	float: none;
	margin: 0;
}
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */

embed,
iframe,
object {
	margin-bottom: 1.5em;
	max-width: 100%;
}
.wp-caption,
.gallery-caption {
	color: #666;
	font-size: 13px;
	font-size: 0.8125rem;
	font-style: italic;
	margin-bottom: 1.5em;
	max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

/* Media Elements */

.mejs-container {
	margin-bottom: 1.5em;
}

/* Audio Player */

.mejs-controls a.mejs-horizontal-volume-slider,
.mejs-controls a.mejs-horizontal-volume-slider:focus,
.mejs-controls a.mejs-horizontal-volume-slider:hover {
	background: transparent;
	border: 0;
}

/* Playlist Color Overrides: Light */

.site-content .wp-playlist-light {
	border-color: #eee;
	color: #222;
}
.site-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album {
	color: #333;
}
.site-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist {
	color: #767676;
}
.site-content .wp-playlist-light .wp-playlist-item {
	border-bottom: 1px dotted #eee;
	-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
}
.site-content .wp-playlist-light .wp-playlist-item:hover,
.site-content .wp-playlist-light .wp-playlist-item:focus {
	border-bottom-color: rgba(0, 0, 0, 0);
	background-color: #767676;
	color: #fff;
}
.site-content .wp-playlist-light a.wp-playlist-caption:hover,
.site-content .wp-playlist-light .wp-playlist-item:hover a,
.site-content .wp-playlist-light .wp-playlist-item:focus a {
	color: #fff;
}

/* Playlist Color Overrides: Dark */

.site-content .wp-playlist-dark {
	background: #222;
	border-color: #333;
}
.site-content .wp-playlist-dark .mejs-container .mejs-controls {
	background-color: #333;
}
.site-content .wp-playlist-dark .wp-playlist-caption {
	color: #fff;
}
.site-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album {
	color: #eee;
}
.site-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist {
	color: #aaa;
}
.site-content .wp-playlist-dark .wp-playlist-playing {
	background-color: #333;
}
.site-content .wp-playlist-dark .wp-playlist-item {
	border-bottom: 1px dotted #555;
	-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
}
.site-content .wp-playlist-dark .wp-playlist-item:hover,
.site-content .wp-playlist-dark .wp-playlist-item:focus {
	border-bottom-color: rgba(0, 0, 0, 0);
	background-color: #aaa;
	color: #222;
}
.site-content .wp-playlist-dark a.wp-playlist-caption:hover,
.site-content .wp-playlist-dark .wp-playlist-item:hover a,
.site-content .wp-playlist-dark .wp-playlist-item:focus a {
	color: #222;
}

/* Playlist Style Overrides */

.site-content .wp-playlist {
	padding: 0.625em 0.625em 0.3125em;
}
.site-content .wp-playlist-current-item .wp-playlist-item-title {
	font-weight: 700;
}
.site-content .wp-playlist-current-item .wp-playlist-item-album {
	font-style: normal;
}
.site-content .wp-playlist-current-item .wp-playlist-item-artist {
	font-size: 10px;
	font-size: 0.625rem;
	font-weight: 800;
	letter-spacing: 0.1818em;
	text-transform: uppercase;
}
.site-content .wp-playlist-item {
	padding: 0 0.3125em;
	cursor: pointer;
}
.site-content .wp-playlist-item:last-of-type {
	border-bottom: none;
}
.site-content .wp-playlist-item a {
	padding: 0.3125em 0;
	border-bottom: none;
}
.site-content .wp-playlist-item a,
.site-content .wp-playlist-item a:focus,
.site-content .wp-playlist-item a:hover {
	-webkit-box-shadow: none;
	box-shadow: none;
	background: transparent;
}
.site-content .wp-playlist-item-length {
	top: 5px;
}

/*--------------------------------------------------------------
16.1 Galleries
--------------------------------------------------------------*/

.gallery-item {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	margin: 0 0 1.5em;
	padding: 0 1em 0 0;
	width: 50%;
}
.gallery-columns-1 .gallery-item {
	width: 100%;
}
.gallery-columns-2 .gallery-item {
	max-width: 50%;
}
.gallery-item a,
.gallery-item a:hover,
.gallery-item a:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
	background: none;
	display: inline-block;
	max-width: 100%;
}
.gallery-item a img {
	display: block;
	-webkit-transition: -webkit-filter 0.2s ease-in;
	transition: -webkit-filter 0.2s ease-in;
	transition: filter 0.2s ease-in;
	transition: filter 0.2s ease-in, -webkit-filter 0.2s ease-in;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.gallery-item a:hover img,
.gallery-item a:focus img {
	-webkit-filter: opacity(60%);
	filter: opacity(60%);
}
.gallery-caption {
	display: block;
	text-align: left;
	padding: 0 10px 0 0;
	margin-bottom: 0;
}


/*--------------------------------------------------------------
17.0 Customizer
--------------------------------------------------------------*/

.highlight-front-sections.twentyseventeen-customizer.front-page .twentyseventeen-panel:after {
	border: 2px dashed #0085ba; /* Matches visible edit shortcuts. */
	bottom: 1em;
	content: "";
	display: block;
	left: 1em;
	position: absolute;
	right: 1em;
	top: 1em;
	z-index: 1;
}
.highlight-front-sections.twentyseventeen-customizer.front-page .twentyseventeen-panel .panel-content {
	z-index: 2; /* Prevent :after from preventing interactions within the section */
}


/* Show borders on the custom page panels only when the front page sections are being edited */
.highlight-front-sections.twentyseventeen-customizer.front-page .twentyseventeen-panel:nth-of-type(1):after {
	border: none;
}
.front-page.twentyseventeen-customizer #primary article.panel-placeholder {
	border: 0;
}

/* Add some space around the visual edit shortcut buttons. */
.twentyseventeen-panel .customize-partial-edit-shortcut button {
	top: 30px;
	left: 30px;
}

/* Ensure that placeholder icons are visible. */
.twentyseventeen-panel .customize-partial-edit-shortcut-hidden:before {
	visibility: visible;
}
/* Kan test */
.icontest {
	width: 2em;
}

/*--------------------------------------------------------------
18.0 SVGs Fallbacks
--------------------------------------------------------------*/

.svg-fallback {
	display: none;
}
.no-svg .svg-fallback {
	display: inline-block;
}
.no-svg .dropdown-toggle {
	padding: 0.5em 0 0;
	right: 0;
	text-align: center;
	width: 2em;
}
.no-svg .dropdown-toggle .svg-fallback.icon-angle-down {
	font-size: 20px;
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1;
	-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
	-ms-transform: rotate(180deg); /* IE 9 */
	transform: rotate(180deg);
}
.no-svg .dropdown-toggle.toggled-on .svg-fallback.icon-angle-down {
	-webkit-transform: rotate(0); /* Chrome, Safari, Opera */
	-ms-transform: rotate(0); /* IE 9 */
	transform: rotate(0);
}
.no-svg .dropdown-toggle .svg-fallback.icon-angle-down:before {
	content: "\005E";
}

/* Social Menu fallbacks */

.no-svg .social-navigation a {
	background: transparent;
	color: #222;
	height: auto;
	width: auto;
}

/* Show screen reader text in some cases */

.no-svg .next.page-numbers .screen-reader-text,
.no-svg .prev.page-numbers .screen-reader-text,
.no-svg .social-navigation li a .screen-reader-text,
.no-svg .search-submit .screen-reader-text {
	clip: auto;
	font-size: 16px;
	font-size: 1rem;
	font-weight: 400;
	height: auto;
	position: relative !important; /* overrides previous !important styles */
	width: auto;
}

/* Other */

.red {
	color: #ff0000;
}
.linktxt:after {
	content: " »» ";
	color: #ff0000;
}
.buttons {
	text-align: center;
}
.buttons .linkbutton {
	display: inline-block;
}
.linkbutton {
	background-color: #009900;
	font-size: 18px;
	line-height: 1.4;
	font-weight: 800;
	position: relative;
	margin: 5px;
}
.linkbutton a {
	display: block;
	padding: 1em 2em;
	color: #fff;
	text-align: center;
	box-shadow: none;
}
.linkbutton a:focus,
.linkbutton a:hover {
	color: #fff;
	box-shadow: none;
	background-color: #000;
}
.linkbutton:after {
	content: "▲";
	display: block;
	position: absolute;
	right: 10px;
	top:18px;
	color: #ff0000;
	-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
	-ms-transform: rotate(90deg); /* IE 9 */
	transform: rotate(90deg);
}


.flex {
    margin:0;
    width:100%;
	margin-bottom:1.5em;
}
.flex.line .col-1-3 {
	background-color: #fff;
	padding: 16px 20px;
	border: 1px solid #b7b7b7;
}

.flex.line .col-1-3 h3 {
	text-align: center;
	font-size: 18px;
}
.flex .number {
	display: block;
	background: #1a1a1a;
	color: #fff;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	margin: -36px auto 0;
	font-size: 20px;
	line-height: 40px;
	text-align: center;
}

/* top page */

.annai {
	padding: 1em;
	border: 2px dotted #ff6633;
	margin-bottom: 10px;
}
.annai p {
	margin-left: 5px;
	font-size: 15px;
	line-height: 1.5;
}
.annai p:last-child {
	margin-bottom: 0;
}
.annai h3 {
	font-size: 18px;
	background-color: #ff6633;
	padding: 3px 3px 3px 10px;
	border-bottom: 2px solid #cccccc;
	color: #fff;
}
.side-course span {
	display: inline-block;
	font-size: 14px;
	line-height: 64px;
	font-weight: bold;
	background: #ff9900;
	border: 3px solid #ffd633;
	width: 70px;
	height: 70px;
	border-radius: 35px;
	-moz-border-radius: 35px;
	-webkit-border-radius: 35px;
	text-align: center;
}
.side-course span.course-s {
	background: #ffccff;
}
.side-course span.course-h {
	background: #ff751a;
}
.side-course span.course-ip {
	background: #80e5ff;
}

/* tablepress */
.tablepress .column-1 {
	min-width: 80px;
}

@media handheld, only screen and (max-width: 767px) {
	.wrap {
		padding-left: 10px;
		padding-right: 10px;
	}
	.wrap.full {
		padding-left: 0;
		padding-right: 0;
	}
.site-logo img {
	max-width: 80%;
	height: auto;
}
	[class*='col-'] {
		width: auto;
		float: none;
		margin: 10px 0;
		padding-left: 0;
		padding-right: 0; /* column-space */
	}
body:not(.front-page):not(.home) .custom-header {
	display: none;
}

	/* Mobile Layout */
.grid {
	margin-right: -12px;
}
	.grid-pad [class*='mobile-col-'] {
		float: left;
		margin: 0 0 10px;
		padding-left: 0;
		padding-right: 12px; /* column-space */
		padding-bottom: 0;
	}
	.mobile-col-1-1 {
		width: 100%;
	}
	.mobile-col-2-3, .mobile-col-8-12 {
		width: 66.66%;
	}
	.mobile-col-1-2, .mobile-col-6-12 {
		width: 50%;
	}
	.mobile-col-1-3, .mobile-col-4-12 {
		width: 33.33%;
	}
	.hide-on-mobile {
		display: none !important;
		width: 0;
		height: 0;
	}

	/* jpushnenu.js */
	/* General styles for all menus */

	/* Push classes applied to the body */
	.push-body {
		overflow-x: hidden;
		position: relative;
		left: 0;
	}
	.cbp-spmenu {
		background: #000;
		position: fixed;
		padding-top: 100px;
		width: 240px;
		height: 100%;
		top: 0;
		z-index: 1000;
		overflow: auto;
		right: -240px;
	}
	.cbp-spmenu ul {
		margin: 0;
		padding: 0;
	}
	.admin-bar .cbp-spmenu { padding-top: 120px; }
	.cbp-spmenu a {
		padding: 10px 20px 10px;
	}
	.cbp-spmenu.menu-open {
		right: 0px;
	}
	.cbp-spmenu.menu-open {
		right: 0px;
	}
	.push-body-toright {
		left: 240px;
	}
	.push-body-toleft {
		left: -240px;
	}

	/* Transitions */
	.cbp-spmenu,
	.push-body {
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
}

@media screen and (max-height: 26.375em) {
    .cbp-spmenu-vertical {
        font-size: 90%;
        width: 190px;
    }
    .cbp-spmenu-left,
    .push-body-toleft {
        left: -190px;
    }
}
