/*
Theme Name:	マテリアル_child
Template:	wp_material
Description:	マテリアルの子テーマ
Version:	1.1.0
Author URI:	http://wp-material.net
*/

/*****************************************
 PC及び全体用
******************************************/


/*-- 文字サイズを小さく --*/
.size085 li{
	font-size: 0.85em;
}

/*-- ブロックの背景色の余白 --*/
div.has-background{
	 padding: 0.6em 0.6em 0.1em;
}
/*-- ブロックの背景色の余白 --*/


/*-- 記事上部・更新日の色を灰色に --*/
.up-date {
    color: #666;
}

/*-- <table>ここから --*/
#guide_wrap .table1 {
	border-collapse: collapse;
    border-spacing: 0;
    border: 1px #b7b7b7 solid;
    width: 100%;
    margin: 10px 0;
    font-size: 85%;
}

#guide_wrap th {
	white-space: nowrap;
}

#guide_wrap th, td{
  border:1px solid #b7b7b7;
  padding: 10px 20px;
}


/*-- <table>ここまで --*/

/*-- 吹き出し --*/
.balloon-01 {
            padding: 20px;
            border: 1.2px solid rgb(161, 161, 161);
            border-radius: 10px;
            position: relative;
            box-shadow: 1px 1px 5px #aaa;
            background-color: #fff;
            }
        .balloon-01:before {
            position: absolute;
            left: -18px;
            top: 20px;
            content: '';
            width: 0px;
            height: 0px;
            border-style: solid;
            border-width: 7px 10px 7px 7px;
            border-color:  transparent rgb(161, 161, 161) transparent transparent ;
            }
        .balloon-01:after {
            position: absolute;
            left: -16px;
            top: 20px;
            content: '';
            width: 0px;
            height: 0px;
            border-style: solid;
            border-width: 7px 10px 7px 7px;
            border-color:  transparent #ffffff transparent transparent ;
             }

        .entry-content .l-fuki:after, .entry-content .r-fuki:after {
            position: absolute;
            content: "";
            width: 80px;
            height: 80px;
            top: -10px;
            border-radius: 40px;
            border: 3px solid #fff;
            background-size: cover;
            background-position: center center;
            background-repeat: no-repeat;
            box-shadow: 1px 1px 5px #aaa;
            }

        .icon1 {
            display: flex;
            align-items: center;
            margin-bottom: 1.5em;
        }

        .icon1 img{
			margin-right: 10px;;
}
/*-- 吹き出し --*/

/*-- インタビュー写真アイコン --*/
.interview1 {
	margin-right: 20px;
	margin-top: 25px;
	margin-bottom:-30px;
}

/*-- インタビュー写真アイコン --*/


/*-- 旧キャプション文字と写真の間を開けない --*/
.wp-caption p.wp-caption-text {
	margin-top: 1px; 
}

/* 新キャプション */
.wp-block-image figcaption {
  color: #555d66;
  text-align: center;
  font-size: 0.85em;
  margin-bottom: 1.4em; 
}

/*-- フッター横並びリンクここから --*/
div#footer-nav {
  overflow: hidden; /* はみ出したものは隠す */
  _height: 1.5em; /* IE6用*/
}

.fotter-link ul {
  margin-left: -1px; /* 一番左のボーダー幅と同じ値の負のマージン */
}

ul.fotter-link li:first-child {
  border: none; /* 親要素から見て一番目のli要素のボーダーを無しに */
}

ul.fotter-link li {
  padding: 0 10px;
 display: inline;
  border-left: 1px solid #fff; /* 区切り線 */
 text-align: center;
 font-size: 0.9em; 
}

/*-- フッター横並びリンクここまで --*/


/*-- 文字下線装飾ここから --*/
.line_yellow {
    background: rgba(0, 0, 0, 0) linear-gradient(transparent 50%, #FFFF80 0%) repeat scroll 0 0;
}

.line_pink {
	background: rgba(0, 0, 0, 0) linear-gradient(transparent 50%, #FFDFEF 0%) repeat scroll 0 0;
}



/*-- フッター横並びリンクここまで --*/


/*-------------------------
  ブログカードここから
-------------------------*/
.blog-card {
  background: #FFFFFF;
	border:1px solid #ddd;
	word-wrap:break-word;
	max-width:100%;
	border-radius:5px;
	margin: 10px;
  /* sp用 ※4 */
}
.blog-card:hover {
  background: #fee;
}
.blog-card a {
  text-decoration: none;
}
.blog-card-title {
	color: #337ab7;
	display: block;
}
.blog-card-thumbnail {
	float:left;
	padding:10px;
}
.blog-card-thumbnail img {
	display: block;
	padding: 0;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.blog-card-content {
	line-height:120%;
}
.blog-card-title {
	padding:10px 10px 10px 0;
	font-size:100%;
  font-weight: bold;
  line-height: 1.5em;
}
.blog-card-excerpt {
	color:#333;
	margin:0 10px 10px;
  line-height: 1.5em;
    font-size:0.9em;
}
.blog-card .clear {
  clear: both;
}
/*-------------------------
  ブログカードここまで
-------------------------*/

/* ★水色ボタン★ ここから */
/* 角丸 */
.Radius5 {  
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}
/* ボタン共通 */
.Button1 {
	overflow: hidden;
	height: 50px;
	margin: 5px;
	padding: 0;
}

@media screen and (min-width:961px) {
/*pc用のcssを記述*/
	.Button1 {
		width: 65%;
	}
}
  
@media only screen and (min-width:376px) and (max-width:960px) {
/*tablet用のcssを記述*/
	.Button1 {
		width: 65%;
	}
}
 
@media screen and (max-width:375px) {
/*スマホ用のcssを記述*/
	.Button1 {
		width: 100%;
	}
}

.Button1 a {
	display: block;
	position: relative;
	z-index: 100;
	text-align:center;
	background: #00a0e9;
	color: #fff;
	font-size: 14px;
	line-height: 50px;
	text-decoration:none;
}
.Button1 a:hover {
	background: #3ab2e9;        /* マウスオーバーカラー */  
}

#IconList1 a:before {        /*白い丸 */ 
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 19px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border-radius: 50%;        /* CSS3草案 */  
    -webkit-border-radius: 50%;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 50%;   /* Firefox用 */  
	background: #fff;
}
#IconList1 a:after {        /*「after要素」で三角 */ 
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 25px;
	width: 0;
	height: 0;
	margin-top: -5px;
	border: 5px solid transparent;        /*top right bottom を透明化 */ 
	border-left: 5px solid #00a0e9;
}
#IconList1 a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	border-left: 5px solid #3ab2e9;
}

/* ★水色ボタン(HIS)★ ここまで */


/* ★オレンジ色ボタン(旅さがし)★ ここから */
/* 角丸 */
.Radius5 {  
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}
/* ボタン共通 */
.Button2 {
	overflow: hidden;
	height: 50px;
	margin: 5px;
	padding: 0;
}

@media screen and (min-width:961px) {
/*pc用のcssを記述*/
	.Button2 {
		width: 65%;
	}
}
  
@media only screen and (min-width:376px) and (max-width:960px) {
/*tablet用のcssを記述*/
	.Button2 {
		width: 65%;
	}
}
 
@media screen and (max-width:375px) {
/*スマホ用のcssを記述*/
	.Button2 {
		width: 100%;
	}
}

.Button2 a {
	display: block;
	position: relative;
	z-index: 100;
	text-align:center;
	background: #CC3300;
	color: #fff;
	font-size: 14px;
	line-height: 50px;
	text-decoration:none;
}
.Button2 a:hover {
	background: #DC143C;        /* マウスオーバーカラー */  
}

#IconList2 a:before {        /*白い丸 */ 
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 19px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border-radius: 50%;        /* CSS3草案 */  
    -webkit-border-radius: 50%;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 50%;   /* Firefox用 */  
	background: #fff;
}
#IconList2 a:after {        /*「after要素」で三角 */ 
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 25px;
	width: 0;
	height: 0;
	margin-top: -5px;
	border: 5px solid transparent;        /*top right bottom を透明化 */ 
	border-left: 5px solid #CC3300;
}
#IconList2 a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	border-left: 5px solid #DC143C;
}

/* ★オレンジ色ボタン★ ここまで */


/* ★青色ボタン(Booking)★ ここから */

/* ボタン共通 */
.Button3 {
	overflow: hidden;
	height: 50px;
	margin: 5px;
	padding: 0;
}

@media screen and (min-width:961px) {
/*pc用のcssを記述*/
	.Button3 {
		width: 65%;
	}
}
  
@media only screen and (min-width:376px) and (max-width:960px) {
/*tablet用のcssを記述*/
	.Button3 {
		width: 65%;
	}
}
 
@media screen and (max-width:375px) {
/*スマホ用のcssを記述*/
	.Button3 {
		width: 100%;
	}
}

.Button3 a {
	display: block;
	position: relative;
	z-index: 100;
	text-align:center;
	background: #003580;
	color: #fff;
	font-size: 14px;
	line-height: 50px;
	text-decoration:none;
}
.Button3 a:hover {
	background: #074193;        /* マウスオーバーカラー */  
}

#IconList3 a:before {        /*白い丸 */ 
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 19px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border-radius: 50%;        /* CSS3草案 */  
    -webkit-border-radius: 50%;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 50%;   /* Firefox用 */  
	background: #fff;
}
#IconList3 a:after {        /*「after要素」で三角 */ 
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 25px;
	width: 0;
	height: 0;
	margin-top: -5px;
	border: 5px solid transparent;        /*top right bottom を透明化 */ 
	border-left: 5px solid #003580;
}
#IconList3 a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	border-left: 5px solid #074193;
}

/* ★青色ボタン★ ここまで */




/* ★横並びボタン★ ここから */
/* 左ボタン（横並び） */
.left-btn {
    width: 100%;  /*ボタンの横幅 */
    text-align: center;  /*ボタン内の文字中央寄せ */
    border-radius: 5px;  /*ボタンの角を少し丸く */
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;  /*ボタン内文字は太字 */
}
 
.left-btn a {
    display: block;
    position: relative;
    z-index: 2;
    overflow: hidden;
    width: 100%;
    font-weight: bold ;
    box-shadow:2px 2px 2px #555;  
    border-radius: 5px;
    background-color: #1bb4d3;
    color: #ffffff !important;
    padding: 12px 0;
    text-align: center;
    text-decoration: none;
    transition: .25s linear;
    -webkit-transition: .25s linear;
    -moz-transition: .25s linear;
}
 
.left-btn a:hover {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
 box-shadow:none;
}
 
/* 右ボタン（横並び） */
.right-btn {
    text-align:center;
    width: 100%;
    float:left;
    color:#fff;
    font-weight:bold;
    border-radius: 5px;  
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
 
.right-btn a {
    display: block;
    position: relative;
    z-index: 2;
    overflow: hidden;
    width: 100%;
    font-weight: bold ;
    box-shadow:2px 2px 2px #555;  
    border-radius: 5px;
    background-color: #C81C1C;
    color: #ffffff !important;
    padding: 12px 0;
    text-align: center;
    text-decoration: none;
    transition: .25s linear;
    -webkit-transition: .25s linear;
    -moz-transition: .25s linear;
}
 
.right-btn a:hover {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
    box-shadow:none;
}
 
.box-main {
    text-align:center;
    font-size:15px;
    margin-bottom: 1em;
}
 
.box-main:after {
    content:"";
    display:block;
    clear:both;
}
 
@media screen and (min-width: 600px) {
 
.right-btn {
    width:48%;
    margin-left:10px;}
 
.left-btn {
    width:48%;
    float:left;
    margin-right: 10px;
	margin-left:0;
}
}

/* ★横並びボタン★ここまで */

/* ===================================================
あわせて読みたい　複数リンク対応カスタマイズ
=================================================== */
.emphasize-link {
position: relative;
margin: 36px 0 16px;
padding: 16px 10px;
border: 2px solid #df8182;
background-color: #fffbf5;
font-size: 0.85em;
}
.emphasize-link p:last-child {
margin-bottom: 0;
}
.emphasize-link::before {
position: absolute;
bottom: 100%;
left: -2px;
padding: 8px 12px;
content: "あわせて読みたい";
background-color: #df8182;
color: #fff;
font-weight: bold;
}


/* table */
.table01 *, .table01 *:before, .table01 *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.table01 {
	width: 100%;
	border-collapse: collapse;
}
.table01 th, .table01  td {
	padding: 10px 10px 10px 20px;
	border: 1px solid #dddddd;
}
.table01 th {
	width: 25%;
	text-align: left;
	background: #f4f4f4;
}
@media only screen and (max-width:480px) {
	.table01 {
		margin: 0;
	}
	.table01 th, .table01 td {
		width: 100%;
		display: block;
		border-top: none;
	}
	.table01 tr:first-child th {
		border-top: 1px solid #dddddd;
	}
}




/* カテゴリーboxの背景色 */
.min-box{
	background-color: #ebebeb;
}


/* ヘッダー画像の全体表示 */
.header-inner{
    padding-top: 0px;
    padding-bottom: 0px;
    width: 100%;
    background-color: #F7F7F7;
	background-image: url(https://liliki.net/wp-content/uploads/2016/09/polaroid.png);
    text-align:center;
    margin-left:auto;
	margin-right:auto;
}

body{
    margin: 0px;
}

/* ヘッダー画像の横幅を全体に表示 */
.sitename img{ 
	max-width:100%; 
	height:auto;
	margin: 0px auto -10px
}


h1.site-title{
	margin-bottom: -22px;
	padding: 0px;
}

p.sitename{
	margin: 0px 0px -17px;
}

/* 旧トップおすすめ3選 */
.recommend-box{
    width: 100%;
    background-color: #fff;
    margin-right: 2%;
    padding: 10px;
    margin-bottom: 30px;
    font-size:0.85em;
    padding-right: 10px;
    box-shadow: 0 2px 5px #999;
    overflow: hidden;
}


/* トップおすすめ3選-2 */
.recommend-box0 {
    margin-bottom: 30px;
    clear: both;
    background-color: #fff;
    box-shadow: 0 2px 5px #999;
    overflow: hidden;
 }

.recommend-box1 {
    width: 33%;
    float: left;
    padding: 8px 3px 8px 8px;
    background-color: #fff;
    box-shadow: 1px 2px 3px #999;
    margin: 0 1px 0 0;
    overflow: hidden;
}

.recommend-left {
    width: 33%;
    float: left;
    padding: 8px 3px 8px 8px;
    background-color: #fff;
    box-shadow: 1px 2px 3px #999;
    margin: 0 1px 0 0;
    overflow: hidden;
}


.post0 {
    overflow: hidden;
    color: #333;
    text-decoration: none;
    padding-left: 8px;
    font-size: 0.8em;
}


.post0 a {
    color: #333;
    text-decoration: none;
    font-weight: bold;
}

.thumb-box1 {
    width: 90px;
    height: 90px;
    float: left;
    overflow: hidden;
    display: table-cell;
    vertical-align: middle;
}


/* 記事表示 */
.content p {
	margin: 2em 0em;
	line-height: 2;
	letter-spacing: 0.07em;
}


/* 注釈・小さい文字 */
.content p.small {
	font-size: 0.85em;
	margin: 1.3em 0em 0.5em;
	line-height: 1.7;
	letter-spacing: 0.07em;
}


/*-- pのlistのタイトル --*/
.content p.list-tiltle1 {
	margin: 1em 0em;
	padding-left: 2%;
}


/****  2sf 更新日  ****/
.2sf, .2sf-icon:before {
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
	word-wrap: normal;
	overflow-wrap: normal;
}

.2sf-icon:before {
	content:attr(title);
	margin-right:0.3em;
	font-size:130%;
	word-wrap: normal;
	overflow-wrap: normal;
}
.2sf-icon.amazon:before {
  content: '\E125';
}


/* blockquote */
.content blockquote{
font-size: 1em;
}

	
/* 見出し装飾 h2 */

.content h2{
    position: relative;
    color: #fff;
    background-color: #FFFFFF !important;
    font-size: 1.5em;
    line-height: 2;
    margin: 70px 0px 40px 0px;
    padding: 10px 5px 5px 30px;
    border-bottom: 3px solid #4dbcbc;
}
 
.content h2:before{
    content: "";
    position: absolute;
    background: #87d4d2;
    top: 0;
    left: 0.4em;
    height: 12px;
    width: 12px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}
 
.content h2:after{
    content: "";
    position: absolute;
    background:#64d2d0;
    top: 1.0em;
    left: 0;
    height: 8px;
    width: 8px;
    transform: rotate(15deg);
    -moz-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
}

/* ページ分割　装飾ここから */
.pagesprit {
	clear: both;
	color: #27364f;
	line-height:1.714285714;
}
.page-numbers a {
    display:inline-block;
    border:solid 1px #ccc;
    border:solid 0.0714285714285714rem #ccc;
    text-decoration:none;
}
.page-numbers a:hover {
    color:white;
    background: #27364f;
}
.numbers {
    margin: 0 8px;
    margin: 0 0.5714285714285714rem;
}
/* ページ分割　装飾ここまで */



/* 記事下お知らせ h2 */

.h2{
    position: relative;
    font-color: #000000;
    background-color: #FFFFFF !important;
    font-size: 1.5em;
    line-height: 1.8;
    margin: 40px 0px 40px 0px;
    padding: 10px 5px 5px 30px;
    border-bottom: 3px solid #4dbcbc;
}
 
.h2:before{
    content: "";
    position: absolute;
    background: #87d4d2;
    top: 0;
    left: 0.4em;
    height: 12px;
    width: 12px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}
 
.h2:after{
    content: "";
    position: absolute;
    background:#64d2d0;
    top: 1.0em;
    left: 0;
    height: 8px;
    width: 8px;
    transform: rotate(15deg);
    -moz-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
}


/* 見出し装飾 h3 */

.content h3 {
	font-size:1.3em;
	padding: .4em .75em;
	background-color: #d2eeee;
	margin: 45px 0;
}



/* 見出し装飾 h4 */

.content h4 {
	clear: both;
	position: relative;
	font-size: 1.2em;
	padding: 0 .5em .5em;
	border-bottom: 1px solid #ccc;
	margin: 75px 0 35px 0;
}


/* 見出し装飾 h5 */
.content h5{
	clear: both;
	color: #111;
	font-size: 1.2em;
	line-height: 1.8;
	padding: 3px 17px 0;
	margin: 50px 0 10px;
}

.content h6{
	clear: both;
	color: #111;
	font-size: 1.2em;
	line-height: 1.8;
	padding: 0 20px 0;
	margin: 50px 0 10px;
}


/* Box */
.box1 {
    padding: 20px 20px 5px;
    background: #fff;
    box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
    -moz-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
    -webkit-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
    margin-bottom: 3em;
    line-height: 2.2;
    letter-spacing: 0.07em;
}


.box11{
    padding: 2em 1.5em;
    margin: 2em 0;
    background-color: #fffacd;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.box11 p {
    margin: 0em; 
    padding: 0em;
}

.box2{
    padding: 2em 1.5em;
    margin: 2em 0;
    background-color: #eee;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.box2 p {
    margin: 0em; 
    padding: 0em;
}

.box3 p {
	margin-bottom: 1.5em;
	line-height: 2.2;
	letter-spacing: 0.07em;
}


.box6 {
    background-color: #fff8e6;
    padding: 0.9em;
	margin-bottom: 3em;
}

.box7 {
    background-color: #e2f9f985;
    padding: 0.9em;
	margin-bottom: 3em;
	font-size: 0.9em;
	line-height: 2;
}


/* 画像キャプション */
.wp-caption-text { 
	font-size: 85%;
	color: #666666;
}

/* table1 */
.table1 {
	margin: 10px 0px;
	border-collapse: collapse;
}

/* スポンサーリンク */
p.sponsored {
	font-size:0.8em; 
	color:#666; 
	margin:5px auto 3px;
	text-align:center;
}

/* アドセンス記事中2・中央寄せ */
.adsense {
	text-align:center;
	margin:0 auto 80px;
}

/* アドセンス記事下・中央寄せ */
.ad{
	text-align:center;
	clear: both;
	margin-bottom: 50px;
	overflow: hidden;
}

.content{
	margin-bottom: 0px;
}


/* ここから配布アドセンス */

/* アドセンス右プロフィール下 */
.ad_300_250_336_280 {
width: 300px !important;
height: 250px !important;
margin: 0 auto 20px ;
}

@media (max-width: 414px) {
.ad_300_250_336_280 {
width: 336px !important;
height: 280px !important;
}
}
.ad_300_250_336_280_ins {
width: 300px !important;
height: 250px !important;
margin: 0 auto;
}

@media (max-width: 414px) {
.ad_300_250_336_280_ins {
width: 336px !important;
height: 280px !important;
}
}
/* アドセンス右プロフィール下 */


/* アドセンス右最下部 */
.ad_300_600_336_280 {
width: 300px !important;
height: 250px !important;
margin: 0 auto 20px;
}

@media (max-width: 414px) {
.ad_300_600_336_280 {
width: 336px !important;
height: 280px !important;
}
}
.ad_300_600_336_280_ins {
width: 300px !important;
height: 250px !important;
margin: 0 auto;
}

@media (max-width: 414px) {
.ad_300_600_336_280_ins {
width: 336px !important;
height: 280px !important;
}
}
/* アドセンス右最下部 */


/* アドセンス記事下、<!--more--> 、[adsense]*/
.ad_double_336_336 {
text-align:center;
margin: 0 auto;
width: 680px;
}
                            
@media (max-width: 414px) {
.ad_double_336_336 {
width: 340px;
}
}

.ad_336_280_336_280_left {
width: 336px !important;
height: 280px !important;
margin: 0 2px 50px 0;
padding: 0 4px 0 0;
float: left;
}
                            
@media (max-width: 414px) {
.ad_336_280_336_280_left {
width: 336px !important;
height: 280px !important;
float: none
}
}
.ad_336_280_336_280_left_ins {
width: 336px !important;
height: 280px !important;
margin: 0 auto;
padding: 0 2px;
float: left;
}
                            
@media (max-width: 414px) {
.ad_336_280_336_280_left_ins {
width: 336px !important;
height: 280px !important;
float: none
}
}
                            
.ad_336_280_336_280_right {
width: 336px !important;
height: 280px !important;
margin: 0 auto;
padding: 0 2px;
float: left;
}
                            
@media (max-width: 414px) {
.ad_336_280_336_280_right {
display: none;
float: none;
}
}
.ad_336_280_336_280_right_ins {
width: 336px !important;
height: 280px !important;
margin: 0 auto;
padding: 0 2px;
float: left;
}
                            
@media (max-width: 414px) {
.ad_336_280_336_280_right_ins {
display: none;
float: none;
}
}
/* アドセンス記事下、<!--more--> 、[adsense] */


/*--------------------------------
PREV NEXT
---------------------------------*/
p.next {
	margin-bottom: 0em;
	line-height: 1.5;
}

#prev_next{
width:100%;
margin: 80px 0 70px;
padding:0;
display: table;
}
#prev_next  #prev, #prev_next  #next{
width: 50%;
padding:30px 10px 10px;
border-top:#ccc 1px solid;
border-bottom:#ccc 1px solid;
display: table-cell;
position:relative;
text-decoration:none;
}
#prev_next #prev p, #prev_next #next p{
font-size:90%;
line-height:1.5;
}
#prev_next #prev:hover, #prev_next #next:hover{
background-color: rgba(238,238,238,0.7);
}
#prev_next #prev{
border-right:#ccc 1px solid;
}
#prev_next #prev_title, #prev_next #next_title{
font-size:90%;
top:-1em;
position:absolute; 
border: 1px #ccc solid;
background:#fff; 
text-align: center;
padding:3px;
color:#666;
}
#prev_next #next_title{
right:10px;
}
#prev_next #prev img, #prev_next #next img{
margin:0 auto;
}
#prev_next #prev_no, #prev_next #next_no{
width: 50%;
height:140px;
padding:0 10px;
display: table-cell;
}
#prev_next #prev_no{
border-right:#ccc 1px solid;
}
#prev_next_home{
margin:0 auto;
background-color: #f48881;
border: solid 9px #fff;
width: 100px;
height:100px;
-moz-border-radius: 100px;
-webkit-border-radius: 100px;
border-radius: 100px;
box-shadow: 0 0 0 3px #f48881;
-webkit-box-shadow: 0 0 0 3px #f48881;
-moz-box-shadow: 0 0 0 3px #f48881;
text-align:center;	
}
#prev_next_home:hover{
background-color: rgba(244,136,129,0.7);
}
#prev_next_home i{
color:#FFF;
margin:10px auto ;
font-size:60px;
}

#prev_next #prev img{
float:left;
margin-right:10px
}
#prev_next #next img{
float:right;
margin-left: 10px;
}
/*-- PREV NEXT ここまで --*/


/*--------------------------------------
関連記事
--------------------------------------*/
.kanren .thumb-box{
	max-width: none;
	width: 190px;
	height: 150px;
	float: none;
}
.kanren ul {
	margin-top: 15px;
}

.kanren ul a{
	color: #000;
	text-decoration: none;
	display: block;
	height: 250px;
	transition: color .3s;
}
.kanren ul a:hover{
	color: #ff0000;
	background-color: #ffffdd;
	text-decoration: none;
}
.kanren ul li {
	margin-left: 5px;
	margin-right: 5px;
	width: 190px;
	height: 250px;
	border: 1px solid #ddd;
	float: left;
}
.kanren-post-name {
	font-size: 0.9em;
}

.tag-header{
	background-color: #4DBCBC;
	color: #fff;
}

/*-- スマホ関連記事 --*/
@media screen and (max-width: 736px) {
.kanren .thumb-box {
    max-width: none;
    height: 100px;
    width: 100%;
    float: none;
}
.kanren-post-name {
	font-size: 0.8em;
}

.kanren ul {
	margin-left: 0px;
}

.kanren ul li {
	width: 46.6%;
	height: 200px;
	margin-left: 5px;
	margin-right: 5px;
}
}
/*-- 関連記事 ここまで --*/




/*-- カエレバカスタマイズ --*/

/*--------------------------------------
  ヨメレバ・カエレバ（レスポンシブ）
--------------------------------------*/
.booklink-box, .kaerebalink-box{
    padding:25px;
    margin-bottom: 10px;
    border:double #CCC;
    overflow: hidden;
    font-size:small;
}
.booklink-image, .kaerebalink-image{
    margin:0 15px 0 0;
    float:left;
    min-width: 160px;
    text-align: center;
}
.booklink-image img, .kaerebalink-image img{
    margin:0 auto;
    text-align:center;
}
.booklink-info, .kaerebalink-info{
    margin:0;
    line-height:120%;
    overflow: hidden;
}
.booklink-name, .kaerebalink-name{
    margin-bottom:24px;
    line-height:1.5em;
}
.booklink-powered-date, .kaerebalink-powered-date{
     font-size:8px;
     margin-top:10px;
     font-family:verdana;
     line-height:120%;
}
.booklink-detail, .kaerebalink-detail{font-size: 12px;}
.booklink-powered-date, .kaerebalink-detail{margin-bottom:15px;}
.booklink-link2, .kaerebalink-link1{margin-top:10px;}
.booklink-link2 a,
.kaerebalink-link1 a{
    width:30%;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    display:inline-block;
    margin:5px 2px 0 0;
    padding:10px 1px;
    text-align:center;
    float:left;
    text-decoration:none;
    font-weight:800;
    text-shadow:1px 1px 1px #dcdcdc;
    font-size:12px;
    color: #fff !important;
}
.booklink-link2 a:hover,
.kaerebalink-link1 a:hover{opacity: 0.6;}
.booklink-link2 a:active
.kaerebalink-link1 a:active{
    position:relative;
    top:1px;
}
/*ボタンを変えるときはここから*/
.shoplinkamazon a{color:#FF9901 !important;border: 1px solid #FF9901 !important;}
.shoplinkrakuten a{color:#c20004 !important;border: 1px solid #c20004 !important;}
.shoplinkkindle a{color:#007dcd !important;border: 1px solid #007dcd !important;}
.shoplinkkakakucom a{color:#314995 !important;border: 1px solid #314995;}
.shoplinkyahoo a{color:#7b0099 !important;border: 1px solid #7b0099 !important;}
/*ここまでを変更*/
.shoplinkyahoo img{display:none;}
.shoplinkyahoo a{font-size:10px;}
.booklink-footer{display: none;}

@media screen and (max-width: 680px) {
.booklink-box, .kaerebalink-box{padding:15px;}
.booklink-image, .kaerebalink-image{
    width: 100px !important;
    min-width: initial;
}
.booklink-name > a, .kaerebalink-name > a{
    font-size: 15px;
    font-weight: bold;
}
.booklink-name, .kaerebalink-name{margin-bottom:12px;}
.booklink-powered-date, .kaerebalink-powered-date{margin-top:5px;}
.booklink-link2 a,
.kaerebalink-link1 a{
    width:calc(100% - 4px);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    margin: 2px 0px;
    padding:10px 0px;
}
}

/*-- カエレバここまで --*/



/* コメント欄を隠さないようにする */
.comment-form {
display: block;
}


/* サイドバー人気記事位置調整 */
.pop {
  margin-left:0px !important;  /* 人気記事左の余白を無くす */
  padding-left:0px !important; /* 人気記事左の余白を無くす */
}
 
.pop li{
  border-top: 1px dotted #CCC;  /* 各記事の上に点線 */
  list-style-type:none;  /* リストマークを無くす */
  list-style-image:none; /* リストマークを無くす */
  clear: both;  /* 画像の左寄せを解除 */
  margin-left: 0px !important;  /* 左側の余白を無くす */
  padding: 5px 0 5px 0;  /* 改めて余白をちょい足し */
  border-bottom: none !important;  /* 記事下の点線を削除 */
}
  
/* サムネイル */
.pop img{
  width:100px;  /* 画像の横幅 */
  height:100px; /* 画像の高さ */
  margin-right: 10px;  /* 画像とタイトルの隙間 */
  padding:0px;  /* とりあえず余白は無くす */
  float: left;  /* 画像は左寄せ */
}
  
.pop li a {
  font-weight: bold !important;  /* タイトル文字を太字に */
}

ul.pop:after {
  content: "";
  display: block;
  clear: both;
}


/****  サイドバー  ****/

.side .box ul {
	padding: 0 5px 0 10px;
}

.side ul.children{
	margin: 8px 0 0 20px;
}

/*-- ここまで --*/


/*-- speech balloon ここから --*/

/* 全体のpの余白を無効に */
.liquid-speech-balloon-text p{
	margin-top: 0em;
	margin-bottom: 0em;
}

/* アバターの大きさ調整と、丸くする */
.liquid-speech-balloon-avatar {
    width: 63px;
    height: 63px;
    border-radius: 50%;
}

/* アバター名の大きさ調整 */

.liquid-speech-balloon-avatar::after {
	font-size: 0.8em;
}


/*-- speech balloon ここまで --*/


/*****************************************
 PC及び全体用ここまで
******************************************/


/*****************************************
 タブレット（大）用
 サイドバーがメインカラムの下に回ります
******************************************/
@media screen and (max-width: 1057px) {



}
/*****************************************
 タブレット（小）用
 記事の並びが2列になります
******************************************/
@media screen and (max-width: 700px) {


/* Box */
.box1 {
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
    -moz-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
    -webkit-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
    margin-bottom: 3em;
    line-height: 2.2;
    letter-spacing: 0.07em;
}


.box11{
    padding: 2em 1.5em;
    margin: 2em 0;
    background-color: #fffacd;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.box11 p {
    margin: 0em; 
    padding: 0em;
}

.box2 {
  position: relative;
  background-color: #eee;
  padding: 1em;
}


.box2 { border: 1px solid #f8f8f8;
	line-height: 2.2;
	letter-spacing: 0.07em;
        padding: 15px 5px 5px 7px;
        margin-bottom: 3em
	color: inherit;
        border: solid 1px #f8f8f8;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        background-color: #f8f8f8; }

.box3 p {
	margin-bottom: 1.5em;
	line-height: 2.2;
	letter-spacing: 0.07em;
}



/*-- トップおすすめ記事3選 --*/

.recommend-box1{
	width: 100%;
        float: left;
        margin: 0 0 1px 0;
}

.recommend-left{
	width: 100%;
        float: left;
        margin: 0 0 1px 0;
}

/*****************************************
 スマホ用
 記事の並びが1列になります
******************************************/
@media screen and (max-width: 450px) {


/*-- トップおすすめ記事3選 --*/

.recommend-box1{
	width: 100%;
        float: left;
        margin: 0 0 1px 0;
}

.recommend-left{
	width: 100%;
        float: left;
        margin: 0 0 1px 0;
}



/*--------------------------------------
スマホ　PREV NEXT
--------------------------------------*/
#prev_next #prev, #prev_next #prev::before, #prev_next #prev::after,
#prev_next #next, #prev_next #next::before, #prev_next #next::after {	
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
#prev_next #prev_title, #prev_next #next_title{
padding:3px 10px;
}
#prev_next #next_title{
right:10px;
}
#prev_next #prev img{
float:left;
margin-right:10px
}
#prev_next #next img{
float:right;
margin-left: 10px;
}
/*-- ここまで --*/


/*--------------------------------------
スマホ　関連記事
--------------------------------------*/

/*-- ここまで --*/


}
