/*!
Theme Name: pures
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: pures
Tags: custom-background, custom-logo, custom-menu, featured-images, 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.

glosswith is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Asides
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/

/**
@font-face {
   font-family: impact;
   src: url('/wp-content/themes/glosswith/images/impact.eot') format("embedded-opentype");
   src: url('/wp-content/themes/glosswith/images/impact.ttf') format("truetype");
   src: url('/wp-content/themes/glosswith/images/impact.woff') format("woff");
    font-style: oblique;
}
**/
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/


html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body {
	margin: 0;
    font-family:"ヒラギノ角ゴ Pro W3",'Noto Sans JP', "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
    color: #333 !important;
    font-weight: 400 !important;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
    color: #333;
}

a:active,
a:hover,
a:focus,
*:focus {
	outline: none;
}
a img{
	outline: none;
}
abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

h2 {
	font-size: 25px;
	margin: 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
    -webkit-backface-visibility: hidden;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 0;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}
@media only screen and (max-width: 420px) {
    h2 {
    font-size: 20px;
}
}
/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
input,
select,
textarea {
	color: #222 !important;
	font-family: sans-serif;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0;
    font-style:normal;
    text-decoration: none !important;
}

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;
}

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: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
	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/ */
	box-sizing: inherit;
}

body {
	
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
}

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

ul,
ol {
	margin: 0;
    padding: 0;
}

ul {
	list-style: none;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 0;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

li {
    list-style-type: none;
}
p {
    font-size: 15px;
}
/*--------------------------------------------------------------
# 基本
--------------------------------------------------------------*/

.inner{
    max-width: 1180px;
    margin: 0 auto !important;
}

.inner_l{
    max-width: 1400px;
    margin: 0 auto !important;
}
.inner_m{
    max-width: 950px;
    margin: 0 auto !important;
}
.inner_s{
    max-width: 860px;
    margin: 0 auto;
}
.inner_xs{
    max-width: 700px;
    margin: 0 auto !important;
}
.impact {
    font-family: 'impact' , 'arial black' ,sans-serif;
}
.anton {
    font-family: 'Anton', sans-serif;
}
.br_span {
    display: block;
}
.pc_show {
    display: block;
}
.sp_show {
    display: none;
}
.main_column {
    float: right;
    width: 78%;
    padding-left: 50px;
}
aside {
    float: left;
    width: 22%;
}
.anchor_basic {
    position: relative;
    top: -70px;
    display: inline-block;
    height: 0;
}
@media only screen and (min-width: 2000px) {

}
@media only screen and (max-width: 1024px) {
.pc_show {
    display: none;
}
.sp_show {
    display: block;
}
.inner{
    padding: 0 15px;
}

nav.sp {
    display: block;
}

}
@media only screen and (max-width: 758px) {
.inner{
    padding: 0 10px;
}
.inner_xs{
    padding: 0 10px;
}
.inner_s{
    padding: 0 10px;
}
.br_span {
    display: inline;
}
.br_none {
    display: none;
}
.main_column {
    float: none;
    width: 100%;
    padding-left: 0px;
}
aside {
    float: none;
    width: 100%;
    margin-top: 70px;
}
}


.header_logo {
	text-align: center;
	max-width: 50px;
	margin: 0 auto;
}
header {
	padding-top: 20px;
	position: relative;
}
.header_sns {
	position: absolute;
	right: 15px;
    top: 30px;
}
.list_outer {
	display: flex;
	flex-wrap: wrap;
	padding: 20px;
}
.list_outer article{
	flex-basis: 25%;
	padding: 20px;
}
.list_outer article ul,
.post ul{
	display: flex;
	justify-content: space-between;
	font-family: 'Poppins', "ヒラギノ角ゴ Pro W3",'Noto Sans JP', "Hiragino Kaku Gothic Pro", "游ゴシック", sans-serif;
	align-items: center;
}
.list_outer article ul li:first-child,
.post ul li:first-child{
	flex-basis: 65%;
}
.list_outer article ul li:last-child,
.post ul li:last-child{
	flex-basis: 35%;
	text-align: right;
}
.list_outer article a{
	text-decoration: none;
	font-family: 'Poppins', "ヒラギノ角ゴ Pro W3",'Noto Sans JP', "Hiragino Kaku Gothic Pro", "游ゴシック", sans-serif;
}
.list_outer article div a:hover img {
	opacity: 0.7;
}
.date {
	font-size: 1.5rem;
}
.list_outer article ul small{
	font-size: 0.8rem;
}
.btn {
	display: flex;
	max-width: 300px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	border: 1px solid #666;
	height: 4rem;
}
.btn a{
	display: block;
	text-decoration: none;
	font-size: 0.8rem;
}


.post {
	max-width: 600px;
	margin: 3rem auto 15rem;
}
.post_title {
	padding-bottom: 2rem;
}
.post .btn{
	margin-top: 4rem;
}

footer{
	max-width: 50%;
	margin: 5rem auto;
}
.footer_logo {
	text-align: center;
	padding: 2rem 0 0.2rem;
	max-width: 200px;
    margin: 0 auto;
}
.footer_address {
	text-align: center;
	font-size: 0.5rem;
}
.footer_sns {
	text-align: center;
	padding-top: 10px;
}
@media only screen and (max-width: 1400px) {
	.list_outer {
		padding: 15px;
	}
	.list_outer article{
		flex-basis: 33.3333%;
		padding: 15px;
	}
	footer{
		max-width: 66.666%;
		padding: 15px;
	}
}
@media only screen and (max-width: 1024px) {
	.list_outer {
		padding: 10px;
	}
	.list_outer article{
		padding: 10px;
	}
	footer{
		padding: 10px;
	}
	.post {
		max-width: 66.6666%;
	}
}
@media only screen and (max-width: 758px) {
	.list_outer article{
		flex-basis: 50%;
	}
	footer{
		max-width: 100%;
	}
	.post {
		max-width: 100%;
		padding: 10px;
	}
	.post iframe{
		width: 100%;
	}
}
@media only screen and (max-width: 450px) {
	.list_outer {
		display: block;
	}
	.list_outer article{
		padding: 10px 0;
	}
	.post {
		margin: 0.2rem auto 5rem;
	}
	.post_title {
		padding-bottom: 0.2rem;
	}
}

.wp-block-embed-youtube .wp-block-embed__wrapper{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	}
	.wp-block-embed-youtube .wp-block-embed__wrapper iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
	}

	.sns_icon {
		display: inline-block;
		width: 36px;
		height: 36px;
		border-radius: 50%;
		background: #999;
		text-align:center;
		line-height: 36px;
		color: #fff;
	}

	/*--------------------------------------------------------------
# ペジネーション wp pagenavi
--------------------------------------------------------------*/
.pagenation {
    clear: both;
    padding: 30px 0;
}
.wp-pagenavi {
    text-align: center;
    font-size: 15px;
    /**border-collapse: separate;
    border-spacing: 5px 5px;
    display: table;
    text-align: center;**/
}
.wp-pagenavi .pages {
    font-size: 12px;
}
.wp-pagenavi a, .wp-pagenavi span {
    text-decoration: none;
    border: none;
    padding: 0;
    margin: 0 5px;
    border: 1px solid #777;
    border-radius: 5px;
    display: inline-block;
    height: 40px;
    width: 40px;
    line-height: 40px;
    vertical-align: middle;
    border-collapse: separate;
    border-spacing: 2px 2px;
}
.wp-pagenavi span.current {
    border-color: #666;
    background-color: #333;
    color: #fff;
}
.wp-pagenavi a:hover{
    color: #fff;
    background-color: #333;
}