@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.widget-page-content-top-title main-widget-label{
	background: none;
    border-top: none;
    border-bottom: solid 3px #c1385f;
    padding: 4px 10px;
    color: #333435;
    position: relative;
	background-color: #f3f4f5;
    padding: 14px 10px;
    margin: 16px 0;
    border-radius: 2px;
}
.widget-page-content-top-title h3:after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 3px #43a8ca;
    bottom: -3px;
    left: 0px;
    width: 15%;
}
/*****蛍光ペン*****/
.hilight-pink{
	background: linear-gradient(transparent 80%, #ff66ff 80%);
}
.hilight-yellow{
	background: linear-gradient(transparent 80%, #ffff66 80%);
}
/*****マーキー*****/
.marquee-anim {
  padding: .5em 0; /* ボーダーや背景が不要ならばここもたぶん不要 */
  overflow: hidden;
  border: 1px solid rgb(200,222,245); /* ボーダー, 不要ならこの一行削除 */
  background-color: rgb(233,247,250); /* 背景色, 不要ならこの一行削除 */
  color: rgb(51,51,51); /* 文字色 */
}

.marquee-anim span {
  display: inline-block;
  padding-left: 100%;
  white-space: nowrap;
  animation: marquee 30s linear infinite;
}

@keyframes marquee {
  from {
    transform: translate(0);
  }
  to {
    transform: translate(-100%);
  }
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}