@charset "UTF-8";

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

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

/************************************
** フッターのなにか（覚えてない）
************************************/
#navi-footer li {
  border: none;
}
.footer-bottom-logo .logo-image {
	max-width: 300px;
}
.footer-bottom-logo img {
	height: auto;
}
.tbl{
	border-collapse: collapse;
	border: 1px none;
	background-color: white;	

}
/************************************
** 記事内のリンク色変える
************************************/
a:hover{
  color : #4682b4;
}
article .tag-link:hover {
	background: #98d3b7;
	opacity: 0.7;
	color: #fff;
}
.pagination-next-link {
  background-color: #49add1; /*背景色*/
  color: #fff; /*文字色*/
  border: none; /*ボーダーを消す*/
}
.pagination-next-link:hover { /*マウスホバー時*/
  background-color: #68caee;
  color: #fff;
}
/************************************
** メイン記事の動き（修正中）a-wrap border-element cf
************************************/
#main entry-card-wrap a-wrap border-element cf a:hover{
	box-shadow: 0 10px 20px -2px rgba(0, 0, 0, .2);
	opacity: 0.7;
}
entry-card-wrap a:hover{
	box-shadow: 0 10px 20px -2px rgba(0, 0, 0, .2);
	opacity: 0.5;
}
/************************************
** ウィジェットのサイズ（文字サイズ）
************************************/
/*必要ならばここにコードを書く*/
#sidebar {
    font-size: 14px;
}
/************************************
** サイドバーのタグ
************************************/
.widget_tag_cloud .tagcloud a:hover {
  background-color: #98d3b7;
  opacity: 0.7;
  color: #fff;
}
/************************************
** 「次のページ」ページネイション
************************************/


/************************************
** カテゴリカスタマイズ
************************************/

/*親カテゴリのカスタマイズ--------------------------------*/
.widget_categories ul li a{ 
  border-bottom: 1px dashed #CCCCCC; /* 下線の種類 */
}

.widget_categories ul li a::before{
  font-family:"Font Awesome 5 Free";
  content: "\f35a"; /* FontAwesomeのユニコード */
  color: #a5c9fc; /* アイコンの色 */
  font-weight: 900; 
  padding-right: 6px;
}

.widget_categories > ul > li > a:first-child{ 
  border-top: none;
}
.widget_categories ul li a:hover{
	 /*background-color:#eeeeee*/
  box-shadow: 0 10px 20px -2px rgba(0, 0, 0, .2);
	opacity: 1
	background: none;
	color: #a5c9fc
}


/*子カテゴリのカスタマイズ--------------------------------*/
.widget_categories ul li ul li a::before{
  font-family:"Font Awesome 5 Free";
  content: "\f35a"; /* FontAwesomeのユニコード */
  font-weight: 900; 
  color: #a5c9fc; /* アイコンの色 */
  padding-right: 6px;
}
/*カテゴリの行間を狭くする--------------------------------*/
.widget_categories ul li a{
	line-height: 1.3;
	font-size: 15px;
}


/************************************
** SNS
************************************/
.sns-share-buttons, .sns-follow-buttons {
	justify-content: center;
}
#main a .button-caption {
	display: none;
}
#main .sns-buttons a {
	height: 35px;
	width: 35px;
	border-radius: 50%;
	opacity: 0.8;
	margin-right: 10px;
}
#main .sns-buttons a:hover{
	 /*background-color:#eeeeee*/
  box-shadow: 0 10px 20px -2px rgba(0, 0, 0, .2);
	opacity: 0.7;
		
}



#main .sns-buttons a:last-child {
	margin-right: 0;
}
.article-footer .sns-share-buttons, .article-footer .sns-follow-buttons {
	justify-content: center;
}
.sns-share-message, .sns-follow-message {
	color: #69788a;
	font-size: 0.8em;
}
.sns-follow-buttons a {
	font-size: 1.3em;
	justify-content: center;
}
.sns-share-message::before, .sns-follow-message::before {
	content: ' ';
}
.sns-share-message::after, .sns-follow-message::after {
	content: ' ';
}
.sns-share, .sns-follow {
	margin: 0;
}
.sns-share-buttons a .share-count,
.sns-follow-buttons a .follow-count {
    right: -10px;
    bottom: -10px;
    color: #aaa;
}



/************************************
** プロフィール-サイドバー
************************************/
.sidebar .widget_author_box {
  background: #fff;
  padding-top: 1.2em;
  border-radius: 3px 3px 0 0;
  max-width: 360px;
  margin: 0 auto;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
}
.sidebar .author-box {
  padding: 120px 0 0;
  border: none;
  position: relative;
  margin: 0 0 3em;
  max-width: 100%;
  overflow:hidden;
}
.sidebar .author-content {
  background-image: linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%);
  border-radius: 200px 200px 0px 0px / 100px 100px 0px 0px;
  color: #fff;
  padding: 20px;
  width:110%;
  margin-left:-5% !important;
}
.sidebar .author-box .author-name a {
  color: #a1c4fd;
  text-decoration: none;
  letter-spacing: 1px;
  font-size: 18px;
}
.sidebar .author-box .author-description {
  padding: 45px 25px 0px;
  text-align: justify;
  text-justify: inter-ideograph;
}
.sidebar .author-box p {
  line-height: 1.8;
  font-size: 14px;
}
.sidebar .author-box .author-thumb {
  width: 120px;
  margin: 0 auto;
  position: absolute;
  top: 50px;
  right: 0;
  left: 0;
  bottom: 0;
}
.sidebar .author-box .author-name {
  font-size: 1.1em;
  font-weight: bold;
  position: absolute;
  margin-bottom: 0.4em;
  top: 23px;
  bottom: 0;
  right: 0;
  left: 0;
}
.sidebar .author-box .author-widget-name {
  position: absolute;
  top: 3px;
  bottom: 0;
  right: 0;
  left: 0;
  font-size: 0.7em;
  color: #bbb;
}
.sidebar .author-box .sns-follow {
  padding: 15px 10px;
}
.sidebar .author-box .sns-follow-buttons {
  display: flex;
  justify-content: space-evenly;
}
.sidebar .author-box .sns-follow-buttons a {
	height: 30px;
	width: 30px;
	border-radius: 50%;
	opacity: 1;
	margin-right: 5px;
	border: none;
	line-height: 32px; 
	background:#92dab2;	
	box-shadow: 0 0 10px rgba(66, 172, 231, .5), 0 0 5px -5px rgba(66, 172, 231)
/*  border: none;
 border-radius: 35px;
  ?width: 60px; 
  height: 45px; 
 line-height: 30px; 
  font-size: 50px 
  box-shadow: 0 0 10px rgba(66, 172, 231, .5), 0 0 5px -5px rgba(66, 172, 231);
  background:#a1c4fd;
	*/

}
.sidebar .author-box .sns-follow-buttons a:hover {
  box-shadow: 0 10px 20px -2px rgba(0, 0, 0, .2);
  opacity: 0.7;
}
.sidebar .author-box .sns-follow-buttons .follow-button span:before {
  color: #fff;
}
.sidebar .icon-instagram-new:before {
  content: "\ea92";
  font-size: 24px;
}
.sidebar .author-box .to-profile {
  position: absolute;
  background: #fff;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  text-decoration: none;
  color: #a1c4fd;
  box-shadow: 0 0 10px rgba(66, 172, 231, .5), 0 0 5px -5px rgba(66, 172, 231);
  top: 105px;
  right: 45px;
  font-size: 0.9em;
  font-weight: bold;
}
.sidebar .author-box .to-profile:hover {
  box-shadow: 0 10px 20px -2px rgba(0, 0, 0, .2);
}
.sidebar .author-box .sns-follow-message {
  margin-bottom: 10px;
  font-size: 13px;
}
.sidebar .author-box .sns-follow-message:before {
  content: "＼";
  margin-right: 5px;
}
.sidebar .author-box .sns-follow-message:after {
  content: "／";
  margin-left: 5px;
}
.sidebar .icon-twitter-logo:before {
  position: absolute;
  top: 6px;
  right: 0;
  bottom: 0;
  left: 0;
}
.sidebar .icon-facebook-logo:before {
  position: absolute;
  top: 6px;
  bottom: 0;
  right: 8px;
  left: 0;
}
.sidebar .icon-hatebu-logo:before {
  position: absolute;
  top: 8px;
  bottom: 0;
  right: 0;
  left: 0;
}
.sidebar .icon-feedly-logo:before {
  position: absolute;
  top: 6px;
  right: 0;
  bottom: 0;
  left: 0;
}
.sidebar .icon-rss-logo:before {
  position: absolute;
  top: 6px;
  right: 0;
  bottom: 0;
  left: 0;
}

/************************************
***アプリサーチ用のカスタムCSS
************************************/

.appreach {
  text-align: left;
  border: 1px solid #4DA1FF;
  background: #F2F8FF;
  max-width: 500px !important;
  width: 100% !important;
  padding: 30px;
  margin: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

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

.appreach p {
  line-height: 1.8em !important;
  margin: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  padding-bottom: 0 !important;
}

.appreach a:after {
  display: none;
}

.appreach__icon {
  float: left;
  border-radius: 10%;
  overflow: hidden;
  margin: 0% 3% 0% 0% !important;
  width: 22.5% !important;
  height: auto !important;
  max-width: 120px !important;
}

.appreach__detail {
  display: inline-block;
  line-height: 1.5;
  width: 72%;
}

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

.appreach__name {
  font-size: 15px !important;
  color: #4DA1FF !important;
  line-height: 1.5em !important;
  font-weight: bold !important;
  max-height: 3em;
  overflow: hidden;
}

.appreach__info {
  font-size: 12px !important;
  color: #929292 !important;
}

.appreach__posted {
  font-size: .9em !important;
}

.appreach__developper,
.appreach__price {
  margin-right: 0.5em;
}

.appreach__posted a {
  margin-left: 0.8em;
  color: #4DA1FF !important;
}

.appreach__links {
  float: left;
  height: 40px;
  margin-top: 8px;
  white-space: nowrap;
}

.appreach__aslink img {
  height: 40px;
  -webkit-backface-visibility: hidden;
  margin-right: 10px;
}

.appreach__gplink img {
  height: 40px;
  -webkit-backface-visibility: hidden;
}

@media(max-width:460px) {
  .appreach {
    overflow: hidden;
    max-width: 300px !important;
    padding: 15px;
    margin: 15px auto;
  }

  .appreach__icon {
    width: 25% !important;
  }

  .appreach__info {
    font-size: 10px !important;
  }

  .appreach__links {
    margin: auto;
    margin-top: 15px;
    float: inherit;
    display: table;
  }

  .appreach__aslink img,
  .appreach__gplink img {
    margin-right: 2px;
    height: 40px;

  }

}



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

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

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

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