/*
Theme Name: マルチサイト対応テーマ
Theme URL: https://adop.co.jp/
Description: 多言語サイト専用汎用テーマです。
Author: Adop Inc.
Version: 2019.07.01
Tags: 株式会社アドップ
License: GNU General Public License v2 or later
*/
@charset "UTF-8";

body #wrapper{
	background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAgCAMAAADKfsO6AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADNQTFRF5/T5+v3+6PT6+fz+9vv96/X68fj87vf77Pb78vn88/n89fv99/z+6vX67/j77ff79Pr9OBiWrAAAAKNJREFUeNp8klsShCAMBIenKKDe/7S7FiQBSclnl4PTCTDZgs5u+kFkZgvBnRmS68xtAk/60AdJ3wQP+U3gK08l7ZKkD4JDyeAJSklsbk0ncKHKMBosOk/JRt01l8RLp5XEpEOKGIfBJTGkuWSB/VSsmuKlKMrGvJZWNyaKNioDspk3JgzKvkPBuu+/Yqe5Top46bQBYdbpA4LRHiWM9ih/AgwAw+EEJPDbp4wAAAAASUVORK5CYII=);
}









.inner{
	margin:1% auto 5% auto;
	max-width:1000px;
	position:relative;
}
@media(max-width:1000px){
	.inner{
		width:100%;
		padding-right:12px;
		padding-left:12px;
	}
}
/********************************************************************************
* HEADER
*********************************************************************************/

/* top bar */
header .top-nav{
	width:100%;
	background:#4d4d4d;
	padding:0.3em 0;
}

header .top-nav .inner{
	display: -webkit-flex; display: -ms-flexbox; display: flex;
	-ms-flex-flow:row wrap;flex-flow:row wrap;
	-webkit-justify-content: space-between;-ms-flex-pack: justify; justify-content: space-between;
	-webkit-align-items: center;  -ms-flex-align: center; align-items: center;
}

header h1{
	font-size:11px;
	color:#FFF;
	line-height:1.5em;
	text-align:left;
}

header .header-lang-nav{
	margin:0 auto;
	line-height:1.5em;
}

header .header-lang-nav a{
	color:#FFF;
	font-size:11px;
	padding:0 1em;
	border-right:1px solid #FFF;
}
header .header-lang-nav a:last-of-type{
	border:none;
}

@media(max-width:1000px){
	header h1{text-align:center;margin:0 auto;}
}
@media(max-width:640px){
	header h1{font-size:1vmin;}
	header .header-lang-nav{display:none;}

}

/* logo area */
.header-logo-area{

}

.header-logo-area .header-logo-link{
	padding-top:2em;
	padding-bottom:2em;
	display:block;
}
.header-logo-area .header-logo-link img{
	max-width:250px;
}


/********************************************************************************
* footer
*********************************************************************************/


/* page top link
------------------------------*/
.goto-top{
	max-width:1000px;
	margin:0 auto;
	display:block;
	position:relative;
	height:44px;
}

a.go-top{
	display: flex;
	justify-content: center;
	align-items: center;
	color:#FFF;
	background:#4d4d4d;
	padding:.2em;
	width:7em;
	height:44px;
	text-align:center;
	position:absolute;
	right:0;
}
a.go-top i{
	font-size:1.6em;
	transform: rotate(-90deg);
}

@media(max-width:640px){

	a.go-top{
		display: flex;
		justify-content: center;
		align-items: center;
		color:#FFF;
		background:#00a0e9;
		padding:.5em;
		font-size:4vw;
		width:100%;
		text-align:center;
	}
	a.go-top i{
		font-size:6vw;
		transform: rotate(-90deg);
	}

}




/********************************************************************************
* content icon
*********************************************************************************/

i[class^="icon-"]{
	width:1em;
	height:1em;
	display:inline-block;
}

i.icon-up::before{
	content:"\0bb";
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg); 
}

.inner > div:first-of-type{
	width: 70%;
}
.inner > div:last-of-type{
	width: 30%;
}
.post-contents{
	display: flex;
	background: #F1F1F1;
	margin: 0% 5% 4% 5%;
	padding: 3% 4%;
	align-items: flex-start;
	font-size: 1.5rem;
}
.post-contents div:first-of-type{
	width: 45%;
}
.post-contents div:last-of-type{
	width: 70%;
	margin-left: 2%;
}
.post-contents img{
	margin:auto;
	width: 100%;
}

.post-contents h3{
    margin: 1% auto;
    border-bottom: 1px dashed #CCCCCC;
    padding-bottom: 1%;
    font-size: 18px;
    color: black;
}

.pager_link{
	text-align: center;
	font-size: 1.5rem;
}

@media(max-width:750px){
	.main-contents.inner.flex{
		display: block;
	}
	.main-contents.inner > div{
		width: 100%;
		margin-bottom: 10%;
	}
	.post-contents{
		display: block;
	}
	.post-contents div:first-of-type,.post-contents div:last-of-type{
		width: 100%;
	}

	section.top-main {
		padding: 0rem 0 3rem 0;

	}

}