/*
Theme Name: Blog template
Theme URI: http://blog-example.uchidamiho.com
Description:フリーランス仕事ブログ用のテンプレート
*/

body {margin: 0;
  font-family: 'メイリオ',
'Hiragino Kaku Gothic Pro', sans-serif}

body {
font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
background-color: #f7ede4;
}

img {border-style:none;}


.refer {
  background-color: #ffffcc;
  border: solid 1px #ffff99;
  padding: 25px 25px 25px 25px;
  border-radius: 8px
}

.refer :before {
  font-family: FontAwesome;
  content : "\f075　";
}

.refer a:before {
  font-family: FontAwesome;
  content : "";
}

.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}

.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}


/*--------------------
 吹き出しを作る
--------------------*/
/*左寄り吹き出し*/

.balloon5 {
  width: 100%;
  margin: 1.5em 0;
  overflow: hidden;
}

.balloon5 .faceicon {
  float: left;
  margin-right: -90px;
  width: 80px;
}

.balloon5 .faceicon img{
  width: 100%;
  height: auto;
  border: solid 3px #d7ebfe;
  border-radius: 50%;
}

.balloon5 .chatting {
  width: 100%;
}

.balloon5 .says {
  display: inline-block;
  position: relative;
  margin: 5px 0 0 105px;
  padding: 17px 13px;
  border-radius: 12px;
  background: #d7ebfe;
}

.balloon5 .says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 18px;
  left: -24px;
  border: 12px solid transparent;
  border-right: 12px solid #d7ebfe;
}

.balloon5 .says p {
  margin: 0;
  padding: 0;
}


/*右寄り吹き出し*/


.balloon6 {
  width: 100%;
  margin: 1.5em 0;
  overflow: hidden;
}

.balloon6 .faceicon {
  float: right;
  margin-left: -60px;
  width: 80px;
}

.balloon6 .faceicon img{
  width: 100%;
  height: auto;
  border: solid 3px #fffacd;
  border-radius: 50%;
}

.balloon6 .chatting {
  width: 100%;
}

.balloon6 .says {
  display: inline-block;
  position: relative;
  margin: 5px 0 0 105px;
  padding: 17px 13px;
  border-radius: 12px;
  background: #fffacd;
}

.balloon6 .says:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 18px;
  right: -24px;
  border: 12px solid transparent;
  border-left: 12px solid #fffacd;
}

.balloon6 .says p {
  margin: 0;
  padding: 0;
}

/*左寄り吹き出し(記事冒頭の自己紹介で使うもの)*/

.balloon7 {
  width: 100%;
  margin: 1.5em 0;
  overflow: hidden;
}



.balloon7 .faceicon {
  float: left;
  margin-right: -90px;
  width: 80px;
}

.balloon7 .faceicon img{
  width: 100%;
  height: auto;
  border: solid 3px #fffacd;
  border-radius: 50%;
}

  .favi-name{
  position: relative;
  }

.balloon7-name{
  font-size: 12px;
position: absolute;
top:85px;
left:20px
}

.balloon7 .chatting {
  width: 100%;
}

.balloon7 .says {
  display: inline-block;
  position: relative;
  margin: 5px 0 0 105px;
  padding: 17px 13px;
  border-radius: 12px;
  background: #fffacd;
}

.balloon7 .says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 18px;
  left: -24px;
  border: 12px solid transparent;
  border-right: 12px solid #fffacd;
}

.balloon7 .says p {
  margin: 0;
  padding: 0;
}



/*左寄り吹き出し(女の子)*/

.balloon8 {
  width: 100%;
  margin: 1.5em 0;
  overflow: hidden;
}

.balloon8 .faceicon {
  float: left;
  margin-right: -90px;
  width: 80px;
}

.balloon8 .faceicon img{
  width: 100%;
  height: auto;
  border: solid 3px #fffacd;
  border-radius: 50%;
}

.balloon8 .chatting {
  width: 100%;
}

.balloon8 .says {
  display: inline-block;
  position: relative;
  margin: 5px 0 0 105px;
  padding: 17px 13px;
  border-radius: 12px;
  background: #fffacd;
}

.balloon8 .says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 18px;
  left: -24px;
  border: 12px solid transparent;
  border-right: 12px solid #fffacd;
}

.balloon8 .says p {
  margin: 0;
  padding: 0;
}





/* マーカー線・黄色 */
.marker9{
background:linear-gradient(transparent 65%, #e88c38 65%);
font-weight:bold;
}
html
.box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
}
.box26 p {
    margin: 0;
    padding: 0;
}
.box29 {
    margin: 2em 0;
    background: #dcefff;
}
.box29 .box-title {
    font-size: 1.2em;
    background: #5fb3f5;
    padding: 4px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 1em;
}
.box29 p {
    padding: 15px 20px;
    margin: 0;
}





/*/////////////////////////////////////////////////
//ブログカードのレイアウト変更
/////////////////////////////////////////////////*/

.wp-embedded-content {
	margin:  0 auto;
	min-width: 70%;
	width: 70%;
  max-width: 70%;
}




  .contents-list p{margin-top: 0;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
  font-size: 12px;
  color:#666666}

/** moji **/

  .moji {
    display: block;
    margin: 20px 20px 0px 20px;
  }

.moji h1 {
	margin: 0px 0px 5px 0px;
	padding: 0px;
}

.moji .datetime {
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 10px 0px;
}

.moji-excerpt {
	width:  100%;
	overflow: hidden;
}

.moji-excerpt p {
	margin: 0px;
	padding: 0px;
}




@media (min-width:1140px) {

.moji .datetime {
	border-bottom:  1px solid #eee;
}
}
/************************************
** フッターメニュー
************************************/
/*  footerの上に区切り線を入れる*/
.footer{
	background-color: #d6d4d4;
	color: #888;
  margin: 0
}


	.copyright p {
	margin: 0px;
	font-size: 14px;
  text-align: center;
	}


	.sociallink ul{
	list-style: none;
	margin: 0px;
	padding: 0px;
	}

	.sociallink li {
	float: right;
	margin: 0px 0px 0px 5px;
	padding: 0px;
	}

	.sociallink a {text-decoration: none;}

	.sociallink i {font-size: 35px;
	color: #444444}



/*-----------------------------------
内部リンクをショートコードでブログカード化
------------------------------------*/
.blog-card{
 border:1px solid #999;
 word-wrap:break-word;
 max-width:100%;
 border-radius:0px;
 margin-bottom: 30px;
 font-size :1.2em;
 box-shadow: 4px 4px 0px #666;
 transition:0.1s ease;
 position:relative;
}
.blog-card:hover{
 box-shadow: 0px 0px 0px #666;
}

.blog-card a {
 color: #333;
 background: #fff;
 display: block;
 -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;
 text-decoration:none;
 font-weight: bold;
 border-radius: 0px;
 padding: 0px;
}

.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;
 margin-top: 0!important;
}

.blog-card-content{
 line-height:120%;
}
.blog-card-title{
 padding: 13px 10px 10px 0;
 font-size: 90%;
}

.blog-card-title::before {
 content: '>続きを読む';
 font-size: 0.7em;
 font-weight: bold;
 color: #fff;
 background: #111;
 width: 7em;
 display: inline-block;
 padding: 0.2em;
 position: absolute;
 text-align: center;
 margin-right: 1em;
 -webkit-border-radius: 2px;
 -moz-border-radius: 2px;
 border-radius: 3px;
 bottom: 10px;
 right: 0px;
}

.blog-card-date{
 color:#333;
 font-size: 90%;
 margin-right:10px;
 font-family: GillSans;
}
/*-----------------------------------
スマホのサイズ調整
------------------------------------*/
@media only screen and (max-width: 600px){
.blog-card-title {
    font-size: 70%;
}
.blog-card-title::before {
    font-size: 0.7em;
}

.blog-card-thumbnail img {
    max-width: 100%;
    margin-left: 0px!important;
    margin-bottom: 0!important;
}
}

/* 人気の記事 */

.ninkinokiji h1 {
  margin-top:20px;
  margin-bottom: 10px;
  border-bottom: dotted 2px #dddddd;
  color: #666666;
  font-size: 18px}




.box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
}
.box26 p {
    margin: 0;
    padding: 0;
}

/*カテゴリ一覧の要素の前にfontawsomeのアイコンを入れる */
.cat-item-64 >a:before {
  font-family: FontAwesome;
	content : "\f040  ";
}
.cat-item-235 >a:before {
  font-family: FontAwesome;
	content : "\f0eb  ";
}
.cat-item-28 >a:before {
  font-family: FontAwesome;
	content : "\f072  ";
}
.cat-item-39 >a:before {
  font-family: FontAwesome;
	content : "\f0f5  ";
}
.cat-item-38 >a:before {
  font-family: FontAwesome;
	content : "\f02d  ";
}
.cat-item-61 > a:before {
  font-family: FontAwesome;
	content : "\f0f2  ";
}
.cat-item-60 > a:before {
  font-family: FontAwesome;
	content : "\f0ac  ";
}
.cat-item-76 > a:before {
  font-family: FontAwesome;
	content : "\f14e  ";
}

.cat-item-234 > a:before {
  font-family: FontAwesome;
	content : "\f0d6  ";
}

.cat-item-221 > a:before {
  font-family: FontAwesome;
	content : "\f276  ";
}
.cat-item-49 >a:before {
  font-family: FontAwesome;
	content : "\f0f3  ";
}


/*記事中に使う囲み枠　シンプルな囲い（チェックマークつき） */
.box2 {
    padding: 1em 1em;
    margin: 1em 0;
    font-weight: bold;
    background: #fff;
    border: solid 3px #1dc1d6;/*線*/
    border-radius: 6px;
}

.box2 p:before {font-family: FontAwesome;
	content : "\f00c    ";
  color:#eadc72;
  #e88c38

}

.box2 p {
}
/* toc（目次） */
.toc_container .toc_title{color:red}

/*  この記事を書いた人*/
.under-article-profile { background-color: #f7ede4; display: block; margin: 20px 0px 20px 0px; padding: 10px; border-radius: 5px; }
.under-article-profile .social { margin: 0px 0px 0px 20px; }

.under-article-profile h1{
  border-bottom: 1px dashed #dadada;
  color:#666666;
  border-radius: 2px;
  font-size: 20px;
  margin: 0px 0px 5px 0px;
  padding: 0px 0px 5px 0px;
}

.under-article-profile img {width:100px;
height: 100px;
float: left;
border: solid #DDDDDD	 2px;
margin-right: 10px;
margin-left: 0;
}

.under-article-profile .name{color: #666666;font-size: 18px}

.under-article-profile.name  p {margin-left: 10px;
color: #666666;}

.under-article-profile .state p {color: #666666;
font-size: 12px}

.under-article-profile .info p {color: #888888;
font-size: 14px;
padding: bottom 2px;}


.under-article-profile a i{color: #ffffff;
font-size: 30px;
display: block;
text-align: center;
margin-top: 5px
}


.twitter a {
list-style: none;
text-decoration: none;}


.instagram a {
list-style: none;
text-decoration: none;}



.facebook a {
list-style: none;
text-decoration: none;}


.mail a {
list-style: none;
text-decoration: none;}

.under-article-profile li   {
list-style:none}

.under-article-profile .twitter{  background-color:#55acee;
height:40px;
  border-radius: 5px;
  padding: 4px;
float: left;
width: 40%;
margin: 5px;
margin-bottom: 5px}

  .under-article-profile .instagram{    background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
    height:40px;
      border-radius: 5px;
      padding: 4px;

float: left;
width: 40%;
margin: 5px;
margin-bottom: 5px;
}

.under-article-profile .facebook{    background-color:  #305097;
  height:40px;
    border-radius: 5px;
    padding: 4px;

float: left;
width: 40%;
margin: 5px;
margin-bottom: 5px;
}

.under-article-profile .mail{    background-color:  #888888;
  height:40px;
    border-radius: 5px;
    padding: 4px;

float: left;
width: 40%;
margin: 5px;
margin-bottom: 5px;
}




.under-article-profile .twitter a{display: block;
  color: #ffffff;
  font-size: 12px;
  text-align: center;}

.under-article-profile .instagram a{display: block;
color: #ffffff;
font-size: 12px;
text-align: center;}


.under-article-profile .facebook a{display: block;
color: #ffffff;
font-size: 12px;
text-align: center;}

.under-article-profile .mail a{display: block;
color: #ffffff;
font-size: 12px;
text-align: center;}

.under-article-profile{}
/*  リンクの色*/
 a {color: #2288bb}

/* 引用のデザイン（クウォテーションマーク） */
blockquote {
    position: relative;
    padding: 40px 30px;
    box-sizing: border-box;
    font-style: italic;
    color: #888;
    border: solid 1px #666;
    margin: 5px
}
blockquote:before{
    display: inline-block;
    position: absolute;
    top: -20px;
    left: -20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    vertical-align: middle;
    text-align: center;
    content: "\f10d";
    font-family: FontAwesome;
    background: #ffffff;
    color: #888888;
    font-size: 22px;
}

blockquote:after{
    display: inline-block;
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    vertical-align: middle;
    text-align: center;
    content: "\f10e";
    font-family: FontAwesome;
    background: #fff;
    color: #888;
    font-size: 22px;
    font-weight: 900;
}

blockquote p {
    padding: 0;
    margin: 10px 0;
    line-height: 1.7;
}

blockquote cite {
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}

/*  check チェックで使う枠*/

.box27 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #1dc1d6;
    border-radius: 0 8px 8px 8px;
    line-height: 1.5em;
}
.box27 .box-title {
    position: absolute;
    display: inline-block;
    top: -30px;
    left: -3px;
    padding: 3 9 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #1dc1d6;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.box27 p {
    margin: 0;
    padding: 0;
}

/*  冒険記とかの見出し*/
.contentslist-h1 h1{color:#666666;
  font-size: 18px;
  border-bottom: solid 2px #666666;
  padding-left: 12px;
  margin-top: 0;
padding-top: 0;
padding-bottom: 15px;
margin-bottom: 40px}

.contentslist-p p {color:#666666;
  font-size: 14px;
  margin-bottom: 0;
  padding-bottom: 0
}

/*  個別投稿 single.phpのカテゴリーのスタイル*/
.singlecategory{
  background-color:#f7af74;
  color:white;
  font-size: 12px;
  display: inline-block;
  width:auto;
  padding-left: 10px;
  padding-right:10px;
  margin-bottom: 10px;

}





/*  個別投稿 single.phpの日時のスタイル*/

.singledatetime {

  color:#888888;
  font-size: 12px;
margin-bottom: 5px
}








/*  スマホ以外でメニューバーの右端に「》」を挿入しない*/
@media (min-width:600px) {

.header-pageokuri p {
	display: none;
}




.guitarippon { position:absolute;
  top: 460px;
  right:28%;
  width:215px;
height:50px;}


.guitarippon:hover{opacity: 0.8}


.hajimetebutton { position:absolute;
  top: 460px;
  right:28%;
  width:215px;
height:50px;}


.hajimetebutton:hover{opacity: 0.8}


.headerimg-sp {display: none;
  }
  .header-image-sp {display: none;
    }


      .headerimg-pc p {
        position: absolute;
        color: #666666;/*文字は白に*/
        font-weight: bold; /*太字に*/
        font-size: 1.5em;/*サイズ2倍*/
        font-family :Quicksand, sans-serif;/*Google Font*/
        position: absolute;
  top:300px;
  right: 80px;
        }

      .headerimg-pc img {
        width: 100%;
        }


.gaiyou {
  	margin-bottom: 20px;

  }

  .gaiyou a{
  	display: block;
    border: solid 1px #dddddd;
	-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
    color: #000000;
    text-decoration:none;
	height:400px;
  	position: relative;
  	padding-bottom: 0px;
  }

  .gaiyou a:hover{box-shadow: 0 0 30px #dddddd}

  .gaiyou img{max-width: 100%;
  height: 210px;
  border: none;
  margin-bottom: 15px;
  vertical-align: bottom;}


  .gaiyou h1{margin-top: 20px;
  margin-bottom: 5px;
  margin-left: 15px;
  margin-right: 15px;
  color: #444444;
  font-size: 20px
  }

  .gaiyoucategory{
    background-color:#e88c38;
    color:#ffffff;
    font-size: 12px;
    display: inline-block;
    width:auto;
    padding-left: 10px;
    padding-right:10px;
    position:absolute;
    top: 0;
    right:0;
  }


  .gaiyou p{margin-top: 0;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
  font-size: 12px;
  color:#666666}

  .datetime {
    color:#888888;
    font-size: 12px;
    margin-left: 0px;
  }


  /*  概要の画像をホバーでズーム*/
  .gaiyou img{
  -moz-transition: -moz-transform 0.2s linear;
      -webkit-transition: -webkit-transform 0.2s linear;
      -o-transition: -o-transform 0.2s linear;
      -ms-transition: -ms-transform 0.2s linear;
      transition: transform 0.2s linear;}

    .gaiyou  img:hover {
          -webkit-transform: scale(1.04);
          -moz-transform: scale(1.04);
          -o-transform: scale(1.04);
          -ms-transform: scale(1.04);
          transform: scale(1.04);
      }

  .gaiyouimg {
      width:auto;
      height: 210px;
      overflow: hidden;
  }

}

/*  カテゴリー一覧の子カテゴリー*/
.children{}
.children li a:before{ content:
"　"
}

/*  検索フォーム*/
.search{position: absolute;
top:0;
right: 0}




        /*  バナー（プロフィール・ライブ情報・ヒマラヤ登山）*/
.banners ul{list-style: none;

}
.banners {
  list-style: none;
  overflow: hidden;
}

.banners  li {
  text-align: center;
  margin-left: -30px;
  margin-right: 30px;
  margin-top: 10px;

  overflow:hidden;

}

.banners li a {
  text-decoration: none;
}


.banners  li img{
 height:auto;
  width:100%
}

/*
.banners img{
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.5s;
}

.banners img:hover{
-moz-transform: scale(1.05,1.05);
-webkit-transform: scale(1.05,1.05);
-o-transform: scale(1.05,1.05);
-ms-transform: scale(1.05,1.05);
*/
}

/* 最新記事を全部見るには */

.saishinclick{
    position: relative;
    display: inline-block;
    padding: 0.25em 0.5em;
    text-decoration: none;
    color: #FFF;
    background: #fd9535;/*背景色*/
    border-radius: 4px;/*角の丸み*/
    font-weight: bold;
    font-size: 14px;


}
.saishinclick:active {
    border-bottom: solid 2px #fd9535;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}




/*  コンテンツとサイドバーに当たる部分*/



/*  ボックス の左右に確保する余白*/
 .contents, .header-nav-inner
{padding-left: 20px;
padding-right: 20px}

.menu{
  display: flex;
  justify-content: center;
}

.contents{
  border:solid 1px #f7f7f7;
  background-color: #FFFFFF;
  margin-top:100px
}

/*  サイト名*/

.header-site {}

.site a { text-decoration:none; }

.site {
height: 90px;
background-color: #e88c38;
position: relative;
padding-top: 20px
}


.site   a img {
max-height: 80px;
margin-top: 5px;
margin-bottom: 5px;
margin-left: 0px;
padding: 0px;
display: inline-block;
text-align: center;
position: absolute;
left: 35%;

}

.site  a img:hover{opacity: 0.7}



@media (max-width:599px) {

.site    {height: 45px;
  }

.site   a img {
max-height: 40px;
margin-top: 0px;
margin-left: 0px;
padding-top: 3px;
position:absolute;top:0;left: 30%;}
}

/*  ヘッダー画像*/
.header-image-pc img{display: block;
  margin:0;
max-width: 100%;
height: auto;


}


/*  ナビゲーション）*/
.menu ul {
  margin: 0;
padding: 0;
list-style: none}

.menu li a{display:block;
padding: 15px;
color: 555555;
font-size: 14px;
text-decoration: none}

.menu li a:hover{opacity: 0.7}

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

.menu li{float:left;
width:auto}





/*  記事*/
.kiji {
  color: #444444;
  font-size: 18px;
}

/*  記事登校日*/
.kijiinfo {margin-top: -10px;
  margin-bottom: 10px;
font-size: 15px;
color: #555555}



/*  記事の分類*/
.kijicat ul {margin: 0;
padding: 0;
list-style: none;
}

.kijicat li a{display: block;
  margin-right: 5px;
  padding: 0px 5px;
  border-radius: 2px;
  background-color:#66CCFF		;
  color: #ffffff;
  font-size: 14px;
  text-decoration: none}

  .kijicat li a:hover{background-color: #BAD3FF}

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

.kijicat li{
  float: left;
  width: auto
}





/*  記事の小見出し*/
.kiji h2{
      position: relative;
      padding: 0.5em 0.7em;
      margin: 2em 0;
      background: #699689;
      color: #ffffff;
      font-weight: bold;
  }
.kiji h2:after {
      position: absolute;
      content: '';
      top: 100%;
      left: 30px;
      border: 15px solid transparent;
      border-top: 15px solid #699689

      ;
      width: 0;
      height: 0;
  }
.kiji h2 p {
      margin: 0;
      padding: 0;
  }


  @media (max-width:599px) {
    .kiji h2{
        font-size: 22px;
      }



}

  .kiji h3{
  padding: 0.3em 0.6em;/*上下 左右の余白*/
  color: #444444;/*文字色*/
  background-color:#fffacd;
  font-weight: bold;
  border-bottom: dotted 2px #ff8c00;
  border-top: dotted 2px #ff8c00
}

.kiji h3:before{
  font-family: 'FontAwesome';
  content: "\f054　";
  color: #ff8c00
}


.midashi{
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #e88c38;/*左線*/
font-size: 24px;
font-weight: bold;
}


/*ＳＮＳ シェアボタン*/
.share{margin-top: 40px;
margin-bottom: 40px}

.share li a{
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    border-bottom: solid 4px #666666;
    border-radius: 3px;
}
.share li a:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

.share ul{margin: 0;
  padding: 0;
  list-style:none;
}

.share li a{display: block;
  padding: 10px 5px;
  color: #ffffff;
  font-style: 14px;
  text-align: center;
  text-decoration: none;
  border-radius: 6px;
  margin: 5px;
  margin-bottom: 50px
}

.share-tw{background-color: #55acee}
.share-fb{background-color: #3b5998}
.share-gp{background-color: #dd4b39}

.share li a:hover{opacity: 0.8}

.share ul{content: "";


clear: both}

.share li {
  float: left;
  width: 33.33333333%;
}

/*  コメント*/
.comment-reply-title{color: #666666;
  margin-top: 20px;
  border-bottom: dotted 2px #dddddd;

}

.comments{display: block;
  margin-top: 50px;
margin-bottom: 50px}

.comments p{font-size: 14px}

/*  関連記事*/

.kanren {margin-top: 100px;
padding: 20px;
background-color: #f0f0d4}

.kanren h1 {
  margin-top: 0;
  margin-bottom: 10px;
  border-bottom: dotted 2px #dddddd;
  color: #666666;
  font-size: 18px}

.kanren ul {margin: 0;
padding: 0;
list-style:none}

.kanren li a {display:block;
padding: 5px;
border-bottom: dotted 1px #dddddd;
color: #2288bb;
font-size: 14px;
text-decoration: none}


.kanren li a:hover{background-color: #eeeeee}

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

.kanren li {float: left;
width: 25%}

.kanren img{float: left;
width: 60px;
height:60px;
border-radius: 2px;
margin: 3px 6px 3px 3px}


.kanren li a{border: none;
}

/*  最新の投稿メニュー*/
.recentpost ul {margin: 0;
padding: 0;
list-style:none}

.recentpost li a{display:block;
padding: 5px;
border-bottom: dotted 1px #dddddd;
color: #2288bb;
font-size: 14px;
text-decoration: none}

.recentpost li a:hover{background-color: #eeeeee}

.recentpost li a img{border: none;
}

.recentpost h1 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #666666;
  font-size: 18px}

.recentpost a:after{content: "";
display: block;
clear: both}

.recentpost img{float: left;
width: 60px;
height:60px;
border-radius: 0px;
margin: 3px 10px 3px 3px}

.recentpost .text{float: none;
width: auto;
margin-left: 60px;
padding-left: 20px}

.recentpost span{display: block;
  color: #666666;
  font-size: 12px
}


/*  サイドメニュー*/
.sidemenu {margin-bottom: 30px;clear: both;}
.sidemenu ul {margin: 0;
padding: 0;
list-style:none;}

.sidemenu li a{display:inline-block;
padding: 5px;
color: #333333;
font-size: 15px;
text-decoration: none;
margin-bottom: 15px;
border-bottom: dotted 1px #bbbbbb;
width: 95%;
position: relative;
}

.sidemenu li a:after {
  font-family: 'FontAwesome';
  content: "\f054";
  position: absolute;
  top: 50%;
 right: 3px;
 margin-top: -12px;
  color: #e88c38
}

.sidemenu li a:hover{background-color: #eeeeee;
  }

.sidemenu h1 {
  margin-top: 0;
  margin-bottom: 10px;
  color:#ffffff;
    background-color: #e88c38;
 -moz-border-radius: 5px;
 border-radius: 5px;
 padding: 5px 0px 5px 10px;
  font-size: 18px;
}

  .sidemenu i {margin-right: 5px;
  color: #333333}



  /*  サイドメニュー検索*/
  .sidekensaku {margin-bottom: 30px;clear: both;}
  .sidekensaku ul {margin: 0;
  padding: 0;
  list-style:none}

  .sidekensaku h1 {
    margin-top: 0;
    margin-bottom: 10px;
    color:#ffffff;
      background-color: #e88c38;
   -moz-border-radius: 5px;
   border-radius: 5px;
   padding: 5px 0px 5px 10px;
    font-size: 18px;
  }

  .sidekensaku i {margin-right: 5px;
    color: #333333}



  /*  おすすめ*/
  .osusume ul {margin: 0;
  padding: 0;
  list-style:none}

  .osusume li a{display:block;
  padding: 5px;
  border-bottom: dotted 1px #dddddd;
  color: #2288bb;
  font-size: 14px;
  text-decoration: none;
margin-bottom: 10px}

  .osusume li a:hover{background-color: #eeeeee}

  .osusume li a img{border: none;
  }

  .osusume h1 {
    padding-top: 40px;
    margin-top: 40px;
    margin-bottom: 10px;
    border-bottom: dotted 2px #dddddd;
    color: #666666;
    font-size: 18px}

  .osusume a:after{content: "";
  display: block;
  clear: both}

  .osusume img{float: left;
  width: 80px;
  height:80px;
  border-radius: 2px;
  margin: 3px 6px 3px 3px}

  .osusume .text{float: none;
  width: auto;
  margin-left: 60px;
  padding-left: 15px}

  .osusume span{display: block;
    color: #666666;
    font-size: 12px;

  }

.osusume{display: block;
  margin-top: 50px;
margin-bottom: 30px}


/*  最新の投稿メニュー*/
.recentpost ul {margin: 0;
padding: 0;
list-style:none}

.recentpost li a{display:block;
padding: 5px;
border-bottom: dotted 1px #dddddd;
color: #2288bb;
font-size: 14px;
text-decoration: none}

.recentpost li a:hover{background-color: #eeeeee}

.recentpost li a img{border: none;
}

.recentpost h1 {
  margin-top: 0;
  margin-bottom: 10px;
  color:#ffffff;
    background-color: #e88c38;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 5px 0px 5px 10px;
  font-size: 18px}

.recentpost a:after{content: "";
display: block;
clear: both}

.recentpost img{float: left;
width: 60px;
height:60px;
border-radius: 2px;
margin: 3px 6px 3px 3px}

.recentpost .text{float: none;
width: auto;
margin-left: 60px;
padding-left: 15px}

.recentpost span{display: block;
  color: #666666;
  font-size: 12px
}




/* ページネーション */
.pagination a {
	padding: 5px 10px;
	display: inline-block;
	font-size: 18px;
	text-decoration: none;
  	color: #666666;

}

.pagination a:hover {
	color: #666666;
	background-color:#e88c38;
    border-radius: 60px;
}


.pagination span {
	padding: 5px 10px;
	display: inline-block;
	color: #666666;
  	background-color:#e88c38;
      border-radius: 60px;
}

.pagination span.current {
}

.pagination {
	overflow: hidden;
	margin-top: 40px;
	margin-bottom: 20px;
	text-align: center;
	clear: both;
    	color: #666666;
}

.pagination h2.screen-reader-text {
  display: none;
}



/*  header-navをバーの形にする*/



/*  ボックスの上下の間隔*/
.header-site{padding-top: 0px;
padding-bottom: 0px;
margin:0}

.box3{padding-top: 40px;
padding-bottom: 30px;
}

.box4{
	padding-top: 0px;
padding-bottom: 30px;
}

.footer{padding-top: 15px;
padding-bottom: 15px}

.top .contents{padding-top: 20px;
padding-bottom: 20px;
}


/*  サイドバースポンサー*/

.sponsor {margin-bottom: 30px;clear: both;}
.sponsor h1{
  margin-top: 50px;
  margin-bottom: 10px;
  color:#ffffff;
  background-color: #e88c38;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 5px 0px 5px 10px;
  font-size: 18px;


}

.sponsor ul{
  list-style: none;
  margin-left: 15px
}


.sponsor p{color: #333333;
  font-size: 15px
}



.sponsor img{

}



.category-area h1{
  margin-top: 0;
  margin-bottom: 10px;
  color:#ffffff;
    background-color: #e88c38;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 5px 0px 5px 10px;
  font-size: 18px;
}



/*  サイドバープロフィール*/
.sideprofile{
  text-align: center;
  border: solid 1px #eeeeee;
  margin-bottom: 40px;
}

.sideprofile img {width:200px;
height: 200px;
text-align: center;
border: solid #DDDDDD	 2px;

}


.sideprofile h1{
  margin-top: 0;
  margin-bottom: 10px;
  color:#ffffff;
    background-color: #e88c38;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 5px 0px 5px 10px;
  font-size: 18px;
}

.sideprofile .name{
  color: #333333;
  font-size: 20px;
margin-top: 10px}


.sideprofile .state p {
color: #333333;
font-size: 13px;
padding-left: 20px;
padding-right: 20px}

.sideprofile{display: block;
  margin-top:  50px}



.prof-sns{
  background-color: #e88c38;
  padding: 10px;
  padding-top: 20px;
  margin: auto;
  overflow: hidden

}

.prof-sns ul{
  list-style: none;
  text-align: center;
  margin-left: 45px
  }

.prof-sns li {
  float: left;
 margin-left: 15px;
 margin-right: 15px;
 display: inline;
  }

  .prof-sns li a{
 color: #333333;
 font-size: 22px;

   }


  /*  サイドバーおすすめこんてんつ*/


  .osusumecontents {margin-bottom: 30px;clear: both;}

  .osusumecontents  h1 {
    margin-top: 0;
    margin-bottom: 10px;
    color:#ffffff;
      background-color: #e88c38;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 0px 5px 10px;
    font-size: 18px;
  }



/*  ヨメレバ*/

.kaerebalink-box,
.booklink-box {
   width:100%;
   font-size:12px;
   color:#5e6065;
   border:1px solid #ddd;
   padding:15px 15px 14px;
   margin:26px 0 28px;
   box-sizing:border-box;
   word-break:break-all;
}
.kaerebalink-box:after,
.booklink-box:after {
   content:"";
   display:block;
   clear:both;
}
.kaerebalink-image,
.booklink-image {
   float:left;
   width:100px;
   text-align:center;
}
.kaerebalink-image img,
.booklink-image img {
   margin:0 !important;
   width:100%;
   height:auto;
}
.kaerebalink-info,
.booklink-info {
   margin:0 0 0 110px;
}
.kaerebalink-name > a,
.booklink-name > a {
   font-size:14px;
   font-weight:bold;
   color:#2e3035;
}
.kaerebalink-powered-date,
.booklink-powered-date {
   line-height:1.5;
   margin:3px 0;
}
.kaerebalink-powered-date a,
.booklink-powered-date a {
   color:#5e6065;
}
.kaerebalink-detail,
.booklink-detail {
   line-height:1.5;
}
.kaerebalink-link1 a,
.booklink-link2 a {
   color:#fff;
   text-decoration:none;
   display:block;
   text-align:center;
   line-height:28px;
   border-radius:4px;
}
/* ブランドカラーより少し薄めに */
.shoplinkamazon a {
   background:#f8a512;
   margin:7px 0 5px;
}
.shoplinkkindle a {
   background:#159dd6;
   margin:5px 0;
}
.shoplinkrakuten a {
   background:#d43232;
}
/* ショップ名の後ろに「で探す」を表示 */
.shoplinkamazon a::after,
.shoplinkkindle a::after,
.shoplinkrakuten a::after {
   content:"\3067\63A2\3059";
}
.kaerebalink-link1 a:hover,
.booklink-link2 a:hover {
   opacity:.8;
   color:#fff;
}
.kaerebalink-box p,
.booklink-box p {
   margin:0;
}
@media screen and (min-width:471px) {
  .kaerebalink-detail,
  .booklink-detail {
     margin-bottom:7px;
  }
  .kaerebalink-link1,
  .booklink-link2 {
     margin-right:-6px;
  }
  .kaerebalink-link1 div,
  .booklink-link2 div {
     width:50%;
     float:left;
     margin-bottom:5px;
     padding-right:6px;
  }
  .kaerebalink-link1 div::after,
  .booklink-link2 div::after {
     content: "";
     display: block;
     clear: both;
  }
  .booklink-link2 div:nth-of-type(3) {
     margin-top:1px;
  }
  .shoplinkamazon a,
  .shoplinkkindle a {
     margin:0;
  }
}
@media screen and (min-width:581px) {
  .kaerebalink-box,
  .booklink-box {
     font-size:13px;
     padding:20px 20px 19px;
     margin:28px 0 32px;
  }
  .kaerebalink-image,
  .booklink-image {
     width:112px;
  }
  .kaerebalink-info,
  .booklink-info {
     margin:0 0 0 124px;
  }
  .kaerebalink-name > a,
  .booklink-name > a {
     font-size:15px;
  }
  .kaerebalink-powered-date,
  .booklink-powered-date {
     margin:4px 0;
  }
  .kaerebalink-link1 a,
  .booklink-link2 a {
     line-height:30px;
     font-size:12px;
  }
}
@media screen and (min-width:768px) {
  .kaerebalink-link1 div,
  .booklink-link2 div {
     width:33.33333333%;
  }
  .booklink-link2 div:nth-of-type(3) {
     margin-top:0;
  }
}
/*--------------------------------
PREV NEXT
---------------------------------*/
#prev_next{
width:100%;
margin: 60px 0 10px;
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;
}
/*-- ここまで --*/
/*media Queries タブレットサイズ
----------------------------------------------------*/
@media only screen and (max-width: 780px) {
}
/*media Queries タブレットサイズ
----------------------------------------------------*/
@media only screen and (min-width: 380px) {
}
/*media Queries PCサイズ
----------------------------------------------------*/
@media only screen and (min-width: 780px) {
/*-- ここから --*/
/*--------------------------------------
768px 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;
}
/*-- ここまで --*/
}


.pagination h2.screen-reader-text { display: none; }



.toukousu {float: left;}


/*  facebook iine*/
.facebookiine{display: block;
background-color: #333333;
height: 150px;
display: block;
content: "";
clear: both;
}

.setsumei{display: block;
  height: auto;
  text-align: center;
  padding-top: 5px;
  padding-bottom: 20px
}

.facebookiine img{float: left;
display: block;
width:300px;
 height: 150px}

.iineshiyou{font-size: 18px;
color: #ffffff;
  line-height: 0.6em}

.otodoke{font-size: 12px;
color: #888888;
  line-height: 0.8em}



  /*  概要　599以下の時の表示*/
  @media (max-width:599px) {
    .gaiyou {
		margin-bottom: 20px;
		-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
	}

    .gaiyou a{
		display: block;
      border:dotted 0.5px  #dddddd;
	  -webkit-border-radius: 5px;
	  	-moz-border-radius: 5px;
	  	border-radius: 5px;
      color: #000000;
      text-decoration:none;
    height:auto;
  content: "";
  display: block;
  clear: both;
  position: relative;
	  	padding-bottom: 0px;
	}

    .gaiyou a:hover{box-shadow: 0 0 30px #dddddd}



    .gaiyou img{max-width: 40%;
    height: auto;
    border: none;
    margin-bottom: 30px;
    margin-top: 30px;
    vertical-align: bottom;
  display: block;
  float: left;}



    .gaiyou h1{margin-top: 20px;
    margin-bottom: 5px;
    margin-left: 15px;
    margin-right: 15px;
    color: #444444;
    font-size: 15px
    }

    .gaiyoucategory{
      background-color:#e88c38;
      color:#ffffff;
      font-size: 10px;
      display: inline-block;
      width:auto;
      padding-left: 10px;
      padding-right:10px;
      position:absolute;
      top: 0;
      right:0;
    }


    .gaiyou p{display: none}

    .datetime {
      color:#888888;
      font-size: 12px;
      margin-left: 0px;
    }


    .header-image-sp{position: relative;}
.hajimetebutton {  position:absolute;
  top: 220px;
  right:17%;
  width:107.5px;
height:25px;}

  }
  .contents-list p{margin-top: 0;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
  font-size: 12px;
  color:#666666}

/*  ############599px以下##########*/
@media (max-width:599px) {

  .headerimg-pc {display: none
    }
    .header-image-pc {display: none
      }

        .headerimg-sp {/*親div*/
          position: relative;
          }

        .headerimg-sp p {
          position: absolute;
          color: #666666;/*文字は白に*/
          font-weight: bold; /*太字に*/
          font-size: 0.5em;/*サイズ2倍*/
          font-family :Quicksand, sans-serif;/*Google Font*/
          position: absolute;
    top   :100px;
    right: 20px;
          }

  /*  header-navをバーの形にする mobile */


  .header-nav {
  width: 100%;
	padding: 0px;
	background: #e88c38;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.header-nav-inner {
	padding: 0px;

}

.header-nav ul {
  width: 800px;
  padding: 5px;
  margin: 0px;
  list-style: none;
  display: flex;
  text-align: center;

}

  .header-nav ul li a{
    font-size: 11px;
    padding: 3px 5px 3px 5px;
    margin: 0px 3px 0px 0px;
    font-weight: bold;
    color: #fff;
    font-style: bold;
    background: #2490c4;
    border-radius: 20px;
    border: 1px solid #1b85b8;
    display: block;

  }


/*  スマホでメニューバーの右端に「》」を挿入するページ送り*/


.header-pageokuri  p{
  position:absolute;
  top: 25px;
  right:2px;
  font-size: 20px;
  color:#;

}

/* 点滅させる*/
.header-pageokuri p{
    -webkit-animation:blink 0.9s ease-in-out infinite alternate;
    -moz-animation:blink 0.7s ease-in-out infinite alternate;
    animation:blink 1.0s ease-in-out infinite alternate; }

 @-webkit-keyframes blink{
    0% {opacity:0.3;} 100% {opacity:1;
      }
       }
 @-moz-keyframes blink{
      0% {opacity:0.3;} 100% {opacity:1;}
      }

 @keyframes blink{
    0% {opacity:0.3;} 100% {opacity:1;}
  }


      .banners ul{list-style: none;

      }
      .banners {
        list-style: none;
        overflow: hidden;
      }

      .banners  li {
        text-align: center;

        margin-left: 0px;
      }

      .banners li a {
        text-decoration: none;
      }


      .banners  li img{
            width:100%;
       height:auto;

      }


  /*  ナビゲーション*/
  .menu li a{padding: 10px 3px;
  font-size: 11px;}

/*  サイト名と記事タイトル*/
.kiji h1{font-size: 26px;
color: #555555}

@media (max-width:599px)
{
  .kiji h1{font-size: 18px;}
}


/*  ボックスの上下の間隔*/
.header-site {padding-top: 0px;
padding-bottom: 0px}

.box3{padding-top: 25px}

/* ＳＮＳのシェアボタン */
.share span {display: inline-block;
text-indent: -9999px}

/* 関連記事メニュー */
.kanren {padding: 10px}
.kanren li {width: 50%}
.kanren li:nth-child(3) {clear: both;}


/*  概要*/

/*    メニューを非表示*/





.kiji h1{margin-top:0;
margin-bottom:20px;
font-size: 22px;
color: #444444}


.kiji img {max-width: 100%;
height: auto}





body{margin:0}


/*  コメント*/


.comment-reply-title{color: #666666;
  margin-top: 20px

}

.comments{display: block;
  margin-top: 50px;
margin-bottom: 50px}

.comments p{font-size: 14px}





  /*  facebook iine*/
  .facebookiine{display: block;
  background-color: #333333;
  height: 100px
  }

  .setsumei{display: block;
    height: auto;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 20px
  }

  .facebookiine img{float: left;
  display: block;
  width:150px;
   height: 100px}

  .iineshiyou{font-size: 14px;
  color: #ffffff;
    line-height: 0.6em}

  .otodoke{display: none;}



}

/*  ############600px以上##########*/
@media (min-width:600px) {



/*  */



  /*  概要を横に並べる設定*/
  .contents-list:after{content: "";
display: block;
clear: both;}

.contents-list .gaiyou{float: left;
width: 50%}

.contents-list .gaiyou:nth-child(even)
{padding-right: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
clear: both;}

.contents-list .gaiyou:nth-child(odd)
{padding-left: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box}

    /*タブ切り替え全体のスタイル*/
    .tabs {
    margin-top: 30px;
    padding-bottom: 40px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    width: 600px;
    margin: 0 auto;}
    /*タブのスタイル*/
    .tab_item {
    width: calc(100%/4);
    height: 50px;
    border-bottom: 3px solid #66CCFF	;
    background-color: #d9d9d9;
    line-height: 30px;
    font-size: 14px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
    }
    .tab_item:hover {
    opacity: 0.75;
    }
    /*ラジオボタンを全て消す*/
    input[name="tab_item"] {
    display: none;
    }
    /*タブ切り替えの中身のスタイル*/
    .tab_content {
    display: none;
    padding: 20px 20px 0;
    clear: both;
    overflow: hidden;
    }
    /*選択されているタブのコンテンツのみを表示*/
    #all:checked ~ #all_content,
    #programming:checked ~ #programming_content,
    #junbi:checked ~ #junbi_content,
    #design:checked ~ #design_content{
    display: block;
    }
    /*選択されているタブのスタイルを変える*/
    .tabs input:checked + .tab_item {
    background-color: #66CCFF	;
    color: #fff;
    }

}




/*  ############600px以上～767px以下##########*/
@media (min-width:600px) and (max-width:767px) {



    /*  header-navをバーの形にする*/
    .header-nav {
      background-color:  #e88c38;
      height: 40px;
      padding-top: ;

    }
    .header-nav ul li a{font-size: 14px;
      padding-left: 10px;
      padding-right: 10px;
      font-weight: bold;
    color:#fff;
    font-style:bold;}


    .header-nav ul {text-align: center;}


/* バッジの位置*/
.badge{top:30%;
right: 15px}



/* 概要*/

body{margin:0;}





}




/*  ############768px以上##########*/
@media (min-width:768px) {





  /* 概要*/

  /* ピックアップ */
  .pickup h1{font-size: 30px}

  /*  BOX3と４を横に並べる*/
  .contents:after {content: "";
  display: block;
  clear:both}

  .box3{float: left;
  width: 70%}

  .box4{float: left;
  width: 30%}

  /*  box3とbox4の左右の間隔*/
  .box3{padding-right: 30px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box}



  /* 概要*/

  body{margin:0}



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


  .kijicatloop ul {margin: 0;
  padding: 0;
  list-style: none}

  .kijicatloop li a{display: block;
    margin-right: 5px;
    padding: 0px 5px;
    border-radius: 2px;
    background-color:#66CCFF		;
    color: #ffffff;
    font-size: 14px;
    text-decoration: none}

    .kijicatloop li a:hover{background-color: #BAD3FF}

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

  .kijicatloop li{
    float: left;
    width: auto}




      /*  記事登校日loop*/
    .kijiinfoloop {margin-right: 3px;
    color: #aaaaaa;
    font-size: 14px;
    float: left;
    margin-top: 0 ;
  padding: 0}



  }




  /*  ############1040px以上##########*/
  @media (min-width:1040px) {

  	.header-site {

  	}

  	.site {

  	}

  	.site a {

  	}

  	.site a img {

  	}



  	.header-nav {
  		padding: 0px 0px 0px 0px;
  			background-color: #e88c38;

  	}

  	.header-nav-inner {
  		  		margin: 0px;
  		  		padding: 0px;


    }

    .header-nav ul {
    	margin: 0px;
    	padding: 0px;
    	height: 50px;
overflow: auto;
    }

    .header-nav ul li {
    	margin: 0px;
    	padding: 0px;
    }


.header-nav ul li a{
	font-size: 13px;
  padding-left:30px;
  padding-right: 30px;
  font-weight: bold;
color:#fff;
font-style:bold;
text-align: center;

}

.headerimg-pc {
padding: 0px;
      margin: 0px;
}


.header-image-pc {

-webkit-box-shadow: 0px 0px 10px 0px #ccc;
	-moz-box-shadow: 0px 0px 10px 0px #ccc;
	box-shadow: 0px 0px 10px 0px #ccc;
	-webkit-box-shadow: 0px 0px 10px 0px #ccc;
	-moz-box-shadow: 0px 0px 10px 0px #ccc;
	box-shadow: 0px 0px 10px 0px #ccc;
padding: 0px;
      margin: 0px;
}

.header-image-pc img {
  padding: 0px;
      margin: 0px;
      display: block;
max-width: 100%;
      height: auto;
}

#homepageimagetag {


}

#homepageimagetag a{
	border-radius: 7px;
}

#homepageimagetag a:hover {
  opacity: 0.75;
}

#homepageimagetag {
  box-shadow: 2px 2px 4px ;
  border-radius: 7px;
}


.hpageimgbutton {

		border: 1px solid #666;

}



    /*  全体の幅を固定*/
    .contents {
    	width: 1150px;
    	margin-left: auto;
  		margin-right: auto;
	}





/*タブ切り替え全体のスタイル*/
.tabs {
margin-top: 50px;
padding-bottom: 40px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
width: 800px;
margin: 0 auto;}
/*タブのスタイル*/
.tab_item {
width: calc(100%/4);
height: 50px;
border-bottom: 3px solid #66CCFF	;
background-color: #d9d9d9;
line-height: 50px;
font-size: 16px;
text-align: center;
color: #565656;
display: block;
float: left;
text-align: center;
font-weight: bold;
transition: all 0.2s ease;
}
.tab_item:hover {
opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
display: none;
padding: 40px 40px 0;
clear: both;
overflow: hidden;
}
/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content,
#junbi:checked ~ #junbi_content
 {
display: block;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
background-color: #66CCFF	;
color: #fff;
}



/*  記事投稿ページ*/
.post p{color:#333333}

.post h1{color:#222222}




/*  記事*/
.kiji h1{margin-top:0;
margin-bottom:10px;
font-size: 26px;
color: #444444}



.kiji img {max-width: 100% ;
}



body{margin:0}


.single-bottom-share { margin: 20px 0px 0px 0px; }
.single-bottom-share h1 { margin: 0px; padding: 0px; width: 400px; margin: 0px auto 0px; }
.single-bottom-share ul { margin: 0px; padding: 0px; }
.single-bottom-share ul li { margin: 0px 5px 5px 0px; padding: 0px; float: left; list-style: none;  }
.single-bottom-share ul li a { display: block; padding: 10px 15px 10px 15px; color: #fff; width: 210px; text-align: center; text-decoration: none; transition: 0.9s; }
.single-bottom-share ul li a:hover { opacity: 0.5; filter: alpha(opacity=50); }
.single-bottom-share .twitter-share { background: #55acee; }
.single-bottom-share .facebook-share { background: #304f97; }
.single-bottom-share .hatena-share { background: #32a4de; }
.single-bottom-share .google-share { background: #dd4b39; }
.single-bottom-share .pocket-share { background: #f04055; }
.single-bottom-share .feedly-share { background: #4ab547; }



}

.datecategory ul{list-style: none;}


.select-red {
	border: 1px solid red;
}

.rounded-corner {
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;

	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;

	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}


/*初めてボタン*/
.hajimetebutton a
{
    padding: 0.3em 0.6em;
}





@media (max-width:599px) {

  .headerimg-pc {display: none;}
.header-image-pc {display: none;}

      .headerimg-sp {/*親div*/
        position: relative;
        }

      .headerimg-sp p {
        position: absolute;
        color: #666666;/*文字は白に*/
        font-weight: bold; /*太字に*/
        font-size: 1.5em;/*サイズ2倍*/
        font-family :Quicksand, sans-serif;/*Google Font*/
        position: absolute;
  top:300px;
  right: 80px;
        }

      .headerimg-sp img {
        width: 100%;

        }

  .header-image-sp{position: relative;}
.guitarippon {  position:absolute;
  top: 220px;
  right:17%;
  width:107.5px;
height:25px;}

   .gaiyou {margin-bottom: 20px}

    .gaiyou a{
      display: block;
      border: solid  1px #cdcdcd;
      color: #000000;
      text-decoration:none;
      height:auto;
      content: "";
      display: block;
      clear: both;
      position: relative;
      -webkit-box-shadow: 0px 0px 5px 0px #bbb;
      -moz-box-shadow: 0px 0px 5px 0px #bbb;
      box-shadow: 0px 0px 5px 0px #bbb;
    }


  .moji{
    display: block;

    height: 120px;
  }

    .gaiyou img{
      max-width: 40%;
      height: auto;
      border: none;
      padding-right: 20px;
      vertical-align: bottom;
      display: block;
      margin-left: 5px;
}



    .gaiyou h1{
    color: #444444;
    font-size: 15px;
    }

    .gaiyoucategory{
      background-color:#e88c38;
      color:#ffffff;
      font-size: 10px;
      display: inline-block;
      width:auto;
      padding-left: 10px;
      padding-right:10px;
      position:absolute;
      top: 0;
      right:0;
    }


    .gaiyou p{display: none}

    .datetime {
      color:#888888;
      font-size: 12px;
      margin-left: 15px
    }

.rounded-corner {
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;

  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;

  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

#homepageimagetag { position: absolute; bottom: 10%; left: 10%; }
#homepageimagetag a { display: block; border: 1px solid #e88c38; padding: 10px; background: #e88c38; color: #fff; font-size: 11px; text-decoration: none;}
#homepageimagetag a:hover { background: #e88c38; }
#homepageimagetag {
  box-shadow: 2px 2px 4px ;
  border-radius: 7px;
}
.header-image-sp img {
  -webkit-box-shadow: 0px 0px 10px 0px #ccc;
  -moz-box-shadow: 0px 0px 10px 0px #ccc;
  box-shadow: 0px 0px 10px 0px #ccc;
}

.gaiyou a{
  border: solid  1px #ddd;
  -webkit-box-shadow: 0px 0px 10px 0px #eee;
  -moz-box-shadow: 0px 0px 10px 0px #eee;
  box-shadow: 0px 0px 10px 0px #eee;
}

.gaiyou img{
  max-width: 40%;
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 20px;
  padding: 0px;
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;

  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;

  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

.box3 { padding-top: 20px; }
.box3 h1 {}



.wp-embedded-content {
  min-width: 100%;
    max-width: 100%;
    -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;

  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;

  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;

  border: solid  1px #ddd;
  -webkit-box-shadow: 0px 0px 10px 0px #eee;
  -moz-box-shadow: 0px 0px 10px 0px #eee;
  box-shadow: 0px 0px 10px 0px #eee;

}

.single-bottom-share { margin: 20px 0px 0px 0px; }
.single-bottom-share h1 { margin: 0px; padding: 0px; width: 100%; margin: 0px auto 0px; font-size: 25px; text-align: center;}
.single-bottom-share ul { margin: 10px 0px 0px 0px; padding: 0px; }
.single-bottom-share ul li { margin: 0px 5px 5px 0px; padding: 0px; display: inline-block; list-style: none;  }
.single-bottom-share ul li a { display: block; padding: 10px 0px 10px 0px; margin: 0px; color: #fff; width: 160px; text-align: center; text-decoration: none; transition: 0.9s; border-radius: 5px; }
.single-bottom-share ul li a:hover { opacity: 0.5; filter: alpha(opacity=50); }
.single-bottom-share .twitter-share { background: #55acee; }
.single-bottom-share .facebook-share { background: #304f97; }
.single-bottom-share .hatena-share { background: #32a4de; }
.single-bottom-share .google-share { background: #dd4b39; }
.single-bottom-share .pocket-share { background: #f04055; }
.single-bottom-share .feedly-share { background: #4ab547; }


}

@media (min-width:600px) {

.rounded-corner {
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;

  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;

  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

#homepageimagetag { position: absolute; bottom: 10%; left: 15%; }
#homepageimagetag a { display: block; border: 1px solid #e88c38; padding: 10px 20px 10px 20px; background: #e88c38; color: #fff; font-size: 15px; text-decoration: none;}
#homepageimagetag a:hover { background: #e88c38; }
#homepageimagetag {
  box-shadow: 2px 2px 4px ;
  border-radius: 7px;
}

}

.tokusyuichiran {
border:solid #f7f7f7 1px;
padding: 20px 0px 20px 0px;
margin-top: 25px;
text-align: center;
width: 1150px;
margin-left: auto;
margin-right: auto;

}

.tokusyuichiran ul{
  list-style: none;
}

.tokusyuichiran ul li{
display: inline;
margin-right: 20px;
}

.tokusyuichiran img{
  width: 22%;
  height: auto;
}


.tokusyuichiran text{
  color: #444444;
}



@media (max-width:599px) {
.tokusyuichiran{
  width: auto;
  margin-top: 15px;
  padding: 0px 0px 0px 0px;
  margin-top: 10px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  }


.tokusyuichiran img{
  width: 42%;
  height: auto;
  }

.tokusyuichiran ul{
  width: 100%;
  margin-left: -38px
}

.tokusyuichiran ul li{
  display: inline;
  margin-right: 0px;
  }

.tokusyu1{
  margin-right: 10px
}
.tokusyu3{
  margin-left: -10px
}


}





.table th, table td {
  border: solid 1px #666666;
  /*実線 1px 黒*/
}