@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*------------見出し、h1～h6の設定------------*/
.article h1 {
 margin-top:30px;
 margin-bottom:20px;
 font-size: 24px;
 line-height:117%;
}
.article h2{
 background: url(https://setouchishimameguri.com/wp-content/uploads/mark-01.png) no-repeat;
 color: #222;
 font-size:22px;
 padding:0.3em 1.5em 0.3em;
 border-left:0px solid #fff;
 border-bottom:1px solid #ddd;
 margin-bottom:2em;
 margin-top:3em;
}
.article h3{
 font-size:22px;
 background-color:#e1e9ff;
 border-bottom:0px dashed #c9dfef;
 border-left: 10px solid #a8bffe;
 border-right: 0px solid #fff;
 border-top: 0px solid #fff;
 padding: 8px 10px;
}
.article  h4{
 border-bottom:4px double #c9dfef;
 border-top: 0px solid #fff;
}

/*------------TOPページ用H3の設定------------*/
#site-island{
  border-top: 4px solid #6c93ff;
  border-bottom: 4px solid #6c93ff;
  border-left: 0px solid #fff;
  margin: 10px 0px;
  padding:10px 10px;
  font-size:22px;
  color:#444;
  text-align:center;
  background:#ffffff;
}

/*------------TOPページ用・項目の設定------------*/
.menu1:before{
content: "　\f111";
color: #a8bffe;
font-family: Fontawesome;
font-size: 0.7em;
}
.menu-box{
line-height:2.5em;
}

/*------------サイドバーの設定------------*/
.sidebar h3 {
 background-color: #e1e9ff;
 padding: 5px 10px;
 margin: 12px 0;
}

/*------------snsカラー変更------------*/
.bc-brand-color.sns-share .twitter-button, .bc-brand-color.sns-follow .twitter-button {
  background-color: #4ab3f3;
}
.bc-brand-color.sns-share .facebook-button, .bc-brand-color.sns-follow .facebook-button {
  background-color: #3560b9;
}
.bc-brand-color.sns-share .pocket-button, .bc-brand-color.sns-follow .pocket-button {
  background-color: #f36b7c;
}
.bc-brand-color.sns-share .line-button, .bc-brand-color.sns-follow .line-button {
  background-color: #26d426;
}
.bc-brand-color.sns-share .pinterest-button, .bc-brand-color.sns-follow .pinterest-button {
  background-color: #db0f26;
}

/*------------もくじ------------*/
.toc{
	background:#f9f9f9;
	border:none;
	display:block;
	border-top:8px solid #a8bffe;
	padding:20;
	box-shadow:0 2px 2px rgba(0,0,0,0.2);
}
.toc a{
	text-decoration:none;
}
.toc ul a{
	color:#555;
	font-size:16px;
	margin-right:20px;
}
.toc ul a:before{
	content:'';
	width:5px;
	height:5px;
	display:inline-block;
	border-radius:100%;
	background:#555;
	position:relative;
	left:-8px;
	top:-3px;
}
.article .toc ul{
	list-style:none;
	margin-bottom:0;
	padding-left:20px;
}
.toc-title{
	text-align:left;
	margin:30px 20px 30px 10px;

}
.toc-title:before{
	font-family:FontAwesome;
	content:"\f0ca";
	font-size:18px;
	margin-right:5px;
	color:#fff;
	background-color:#c9dfef;
	border-radius:50%;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	padding:14px;
}

/*------------広告表示------------*/
.adhyouji{
	  background:#f2f2f2;
	  padding:5px;
	  font-size:80%;
	  text-align:center;
}

/*------------画像のキャプションの色設定------------*/
figcaption {
 color: #0000cd;
 font-size: 90%;
 margin: 0.5em;
 text-align:center;
} 

/*------------外部サイトへのリンク、周り囲み------------*/
.gaibu{
 border: 5px solid #87cefa;
 border-radius:20px;
 color: #666;
 font-size:16px;
 background:#f8fbf8;
 padding:20px;
 margin:2em 0;
}

/*------------外部サイト、頭につけるアイコン・右向き矢印------------*/
.iconmigi1:before{
content: "\f0a9";
color: #ffa500;
font-family: Fontawesome;
margin-right: 0.2em;
}

/*------------内部リンク、頭につけるアイコン・右向き矢印------------*/
.iconmigi2:before{
content: "\f0a9";
color: #ff6666;
font-family: Fontawesome;
margin-right: 0.2em;
}

/*------------GOOGLEMAP------------*/
#googlemap {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
}
#googlemap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*------------トマレバのカスタマイズ------------*/
/*トマレバボックス*/
.tomarebalink-box{
margin: 15px 10px 35px 10px;
padding: 25px 20px;
background: #fff;
}
@media (max-width: 767px) and (max-width: 767px) {
.tomarebalink-box {
border-radius: 2px;
background: #fff;
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.18);
border-top: 1px solid #F3F3F3;
}
}
@media (max-width: 767px) {
.tomarebalink-box p {
line-height: 1.3rem;
padding-bottom: 10px;
}
}
@media (min-width: 768px) {
.tomarebalink-box {
border-radius: 2px;
background: #fff;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18);
}
}
@media (min-width: 768px) and (max-width: 767px) {
.tomarebalink-box {
border-radius: 0px;
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25);
}
}
@media (min-width: 768px) {
.tomarebalink-box p {
font-size: 0.95rem;}
}
@media (min-width: 1024px) {
.tomarebalink-box p {
font-size: 1rem;
padding-bottom: 30px;}
}
@media (max-width: 767px) {
.tomarebalink-image {
margin-right: 20px !important;
float: left;
display: inline-block;
width: 100px;
text-align: center;
}
 .tomarebalink-image img {
width: auto;
height: auto;
max-height: 180px;
margin-bottom: 0 !important;
}
}
@media (min-width: 768px) {
.tomarebalink-image {
margin-right: 20px !important;
width: 130px;
text-align: center;
}
.tomarebalink-image img {
width: auto;
height: auto;
max-height: 200px;
margin-bottom: 0 !important;
}
}
.tomarebalink-info img {
display: none;
}
@media (min-width: 768px) {
 .tomarebalink-info {
width: calc(100% - 150px);
}
}
@media (min-width: 768px) {
.tomarebalink-box {
display: flex;
}
}
@media (min-width: 768px) {
.tomarebalink-link1{
display: flex;
margin-top: 15px;
}
}
@media (max-width: 767px) {
.tomarebalink-link1{
margin-top: 15px;
}
}
/*トマレバ - ボタンの調整*/
.shoplinkjalan a,
.shoplinkrurubu a,
.shoplinkjtb a,
.shoplinkikyu a,
.shoplinkyahoo a {
display: block;
font-size: 0.85rem;
text-decoration: none !important;
color: #fff !important;
text-align: center;
border-radius: 2px;
}
@media (max-width: 767px) {
.shoplinkjalan a,
.shoplinkrurubu a,
.shoplinkjtb a,
.shoplinkikyu a,
.shoplinkrakuten a,
.shoplinkyahoo a {
padding: 10px;
margin-bottom:2px;
}
}
@media (min-width: 768px) {
.shoplinkjalan a,
.shoplinkrurubu a,
.shoplinkjtb a,
.shoplinkikyu a,
.shoplinkrakuten a,
.shoplinkyahoo a {
font-size: 0.8rem;
margin:0 2px 0 2px;
padding: 12px 5px;
}
}
@media (min-width: 1024px) {
.shoplinkjalan a,
.shoplinkrurubu a,
.shoplinkjtb a,
.shoplinkikyu a,
.shoplinkrakuten a,
.shoplinkyahoo a {
padding: 12px 8px;
}
}
@media (min-width: 768px){
.tomarebalink-box .shoplinkrakuten{
margin:0 2px 0 2px;
}
}
.shoplinkjtb a,
.shoplinkrurubu a,
.shoplinkikyu a,
.shoplinkjalan a {
background: #ccc;
}
.tomarebalink-box .shoplinkyahoo a ,
.tomarebalink-box .shoplinkrakuten a {
background: #ccc !important;
}
/*トマレバ - その他細かな調整*/
.tomarebalink-name{
font-size:15px;
}
@media (max-width: 767px) {
.tomarebalink-detail:after{
display: block;
clear: both;
content: "";}
.tomarebalink-footer{
clear: both;
}
}
@media (min-width: 768px) {
.tomarebalink-detail:after{
display: block;
clear: both;
content: "";
}
.tomarebalink-footer{
clear: both;
}
}
.tomarebalink-powered-date,
.tomarebalink-powered-date a,
.tomarebalink-detail {
color: #aaa;
text-decoration: none;
font-size: 0.75rem;
}
@media (max-width: 767px) {
.tomarebalink-powered-date,
.tomarebalink-detail {
padding-left: 120px;
}
}
.tomarebalink-powered-date a,
.tomarebalink-powered-date,
.tomarebalink-address{
font-size: 12px;
color: #ACACAC !important;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
  /*必要ならばここにコードを書く*/
}

/*768px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}