/*
Theme Name: aimlog_イラストサイト
Description: aimlogサイト
Theme URI: aimlog.org
Author: aim
Version: 1.1.0
License: ライセンス
License URI: https://aimlog.org
*/

.sidebarIllust {
	position: fixed;
	top: 0;
	left: 0;
	height: 100vh;
	width: 300px;
	border-right: solid 1px #000000;
	background-color: #fff;
	z-index: 1;
}

.word {
	font-size: 18px;
	letter-spacing: .5em;
}

.word span {
	font-size: 30px;
}

.word p {
	margin-top: 20px;
}

a.button {
	display: block;
	margin: 0 auto;
	width: 100%;
	background: #545454;
	color: #fff;
	padding: 20px;
	text-align: center;
}

a.buttonAno {
	display: block;
	margin: 0 auto;
	width: 100%;
	background: #545454;
	color: #fff;
	padding: 20px;
	text-align: center;
	margin-top: 20px;
}

.content {
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
	padding: 120px 0;
}

.content p {
	text-align: center;
	line-height: 2.7;
	font-size: 16px;
	padding: 0 20px;
}

.character {
	background: #f5f5f5;
	padding: 80px 30px;
}

.character .word {
	max-width: 800px;
	margin: 0 auto;
	margin-bottom: 20px;
}

.characterWrap {
	margin: 0 auto;
	max-width: 800px
}

.characterLeft {
	width: 30%;
}

.characterRight {
	width: 50%;
}

.characterWrap figure {
	display: table-cell;
	width: 40%;
	vertical-align: middle;
}

.characterWrap .characterRight {
	display: table-cell;
	vertical-align: middle;
	padding: 0 0 0 20px;
	font-size: 14px;
	color: #545454;
	line-height: 2;
	letter-spacing: .4em;
}

.characterRight span {
	font-size: 18px;
}

.characterRight p {
	font-size: 12px;
}
/*
.characterBlock {
	position: relative;
}

.characterBlock:nth-of-type(1):hover:before {
	content: 'カレー大好き';
	position: absolute;
	top: 5px;
	left: 10px;
	color: #ddd;
	font-size: 30px;
}*/

.goods {
	margin: 0 auto;
	padding: 100px 20px;
}

.goods p {
	margin-bottom: 10px;
}

.goodsInner {
	width: 48%;
	box-shadow: 0 6px 20px -8px #ccc;
	border-radius: 20px;
	margin-bottom: 20px;
}

.goodsInner:hover {
	-webkit-transform: translateY(-1px);
	-ms-transform: translateY(-1px);
	transform: translateY(-1px);
	box-shadow: 0 8px 25px -5px #ccc;
	transition: .3s;
}

.goodsInner div {
	display: inline-block;
}

.goodsInner img {
	border-radius: 20px;
}

.text-parent {
	display: none;
}


.stamp {
	background: #f8f8f8;
	padding: 80px 30px;
}

.stampWord {
	max-width: 900px;
	margin: 0 auto 30px;
}

.stampWrap {
	max-width: 700px;
	margin: 0 auto 30px;
}

.stampWrap a,.characterWrap .characterBlock {
	display: table;
	width: 100%;
	background: #fff;
	padding: 0 20px;
	margin-bottom: 20px;
	border-radius: 20px;
	box-shadow: 0 6px 20px -8px #ccc;
}

.stampWrap a:hover,.characterWrap .characterBlock:hover {
	-webkit-transform: translateY(-1px);
	-ms-transform: translateY(-1px);
	transform: translateY(-1px);
	box-shadow: 0 8px 25px -5px #ccc;
	transition: .3s;
}

.stampWrap figure {
	display: table-cell;
	width: 40%;
	vertical-align: middle;
}

.stampWrap p {
	display: table-cell;
	vertical-align: middle;
	padding: 0 0 0 30px;
	font-size: 14px;
	color: #545454;
	line-height: 2;
	letter-spacing: .4em;
}

.gasyu {
	padding: 120px 0;
}

.gasyuWrap {
	position: relative;
	max-width: 700px;
	margin: 0 auto;
}

.gasyuWrap .word {
	position: absolute;
	top: -30px;
	left: 0;
	right: 0;
	text-align: center;
}

.gasyuInner {
	margin: 0 auto;
	background: #fff;
	border-radius: 50px;
	background: #f3f3f3;
	padding: 40px;
}

.gasyuInner .gasyuImg {
	width: 100%;
}

.gasyuInner a img {
	border-radius: 30px;
}

.gasyuRight {
	width: 100%;
	margin-top: 20px;
}

.gasyuRight p {
	position: relative;
	background: #fff;
	padding: 30px 25px;
	border-radius: 20px;
	line-height: 2;
	letter-spacing: .4em;
}

.gasyuRight p:after {
	content: "";
	display: inline-block;
	position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-bottom: 15px solid #fff;
}

.line{
	background: #f5f5f5;
	padding: 100px 30px;
}

.line .word,.lineWrap {
	max-width: 650px;
	margin: 0 auto;
}

.lineWrap figure {
	width: 100%;
}

.lineRight {
	width: 100%
}

.lineRight p {
	padding: 20px 0;
	line-height: 2;
	letter-spacing: .4em;
}

/*--- 画面の幅が768px以上になったら ---*/
@media screen and (min-width:760px) {

a.button {
	width: 30%;
}

.content p {
	font-size: 20px;
	padding: 0;
}

.character {
	padding: 80px;
}

.goodsWrap {
	margin-bottom: 50px;
}

.goods {
	max-width: 900px;
	padding: 80px 0;
}

.goodsInner {
	width: 23%;
	margin-bottom: 0;
}


.stamp {
	padding: 80px 0;
}


.stampWrap a,.characterWrap .characterBlock {
	width: 48%;
}


.line{
	padding: 100px 0;
}

.lineWrap figure {
	width: 40%;
}

.lineRight {
	width: 50%
}

.gasyuInner .gasyuImg {
	width: 35%;
}

.gasyuRight {
	width: 50%;
	margin-top: 0;
}


.gasyuRight p:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 30px;
	left: -24px;
    margin-left: 0;
	border: 12px solid transparent;
	border-right: 12px solid #fff;
}

}


/*--- 画面の幅が768px以上になったら ---*/
@media screen and (min-width:960px) {

}