@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

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

.logo-text {
    padding: 11px 0 0px;
    font-size: 1em;
}

.tagline {
    text-align: center;
    font-size: 14px;
    margin: -0.4em 1em;
}

div#quoted {
    margin: 1em 0;
padding-top:30px;
padding-bottom:30px;
padding-left:5%;
padding-right:5%;
    border-left: solid 3px #848484;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;
}

div#meigen {
    margin: 1em 0;
    border-radius: 6px;
margin-top:40px;
margin-bottom:40px;
padding-top:30px;
padding-bottom:30px;
padding-left:5%;
padding-right:5%;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

.meigen vk_balloon_content_outer div {
    margin: 1em 0;
    border-radius: 6px;
margin-top:40px;
margin-bottom:40px;
padding-top:30px;
padding-bottom:30px;
padding-left:5%;
padding-right:5%;
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

div#quoted_dorama {
    margin: 1em 0;
padding-top:15px;
padding-bottom:15px;
padding-left:5%;
padding-right:5%;
    border-left: solid 3px #848484;
    background: #fff;
    box-shadow: 0 0 10px #ddd inset;
    -moz-box-shadow: 0 0 10px #ddd inset;
    -webkit-box-shadow: 0 0 10px #ddd inset;
}

p#nextpage {
    background-color: #f4f4f4;
    width: 100%;
    align:center;
    text-align: center;
    font-weight: bold;
}

/*  名言募集タイトル*/

h2.mailbox{
  position: relative;
  padding: 1.5rem 1rem !important;
}

h2.mailbox:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

h3.aaa{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #EE7800;
}

h3.aaa:first-letter{
    font-size:40px;
    margin-right: 5px;
}

h3.aaa02{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #6e00dc;
}

h3.aaa02:first-letter{
    font-size:40px;
    margin-right: 5px;
}

h3.aaa03{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #00b400;
}

h3.aaa03:first-letter{
    font-size:40px;
    margin-right: 5px;
}

h3.aaa04{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #FFFF33;
}

h3.aaa04:first-letter{
    font-size:40px;
    margin-right: 5px;
}

h3.aaa05{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #0066CC;
}

h3.aaa05:first-letter{
    font-size:40px;
    margin-right: 5px;
}

h3.aaa06{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #FF9999;
}

h3.aaa06:first-letter{
    font-size:40px;
    margin-right: 5px;
}

h3.aaa07{
    color: #111;
    font-weight: bold;
    margin: 0 0 1.5em;
    border-bottom: 4px solid #FF3333;
}

h3.aaa07:first-letter{
    font-size:40px;
    margin-right: 5px;
}


div#aaa01 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #EE7800;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;
}

div#aaa02 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #6e00dc;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;
}

div#aaa03 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #00b400;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;
}

div#aaa04 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #FFFF33;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;}

div#aaa05 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #0066CC;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;}

div#aaa06 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #FF9999;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;}

div#aaa07 {
    margin: 1em 0;
    padding: 20px 55px;
    border-left: solid 3px #FF3333;
    background: #fff;
    box-shadow: 0 0 50px #ddd inset;
    -moz-box-shadow: 0 0 50px #ddd inset;
    -webkit-box-shadow: 0 0 50px #ddd inset;
}


button#send{
  background:#1AAB8A;
  color:#fff;
  border:none;
  position:relative;
  height:60px;
  font-size:1.6em;
  padding:0 2em;
  cursor:pointer;
  transition:800ms ease all;
  outline:none;
}
button#send:hover{
  background:#fff;
  color:#1AAB8A;
}
button#send:before,button#send:after{
  content:'';
  position:absolute;
  top:0;
  right:0;
  height:2px;
  width:0;
  background: #1AAB8A;
  transition:400ms ease all;
}
button#send:after{
  right:inherit;
  top:inherit;
  left:0;
  bottom:0;
}
button#send:hover:before,button#send:hover:after{
  width:100%;
  transition:800ms ease all;
}

div#aaasend {
  width:100%;
  height:auto;
  background-size:cover;
  background-image: url(/wp-content/uploads/2015/10/aaasenda.jpg);
}

div#aaasend a {
  collar:white;
}

.abc {
  color:white;
  text-shadow: 3px 2px 1px #000000;
  font-size: large; 
}

div#46 {
  width:100%;
  height:auto;
  background-size:cover;
  background-image: url(/wp-content/uploads/2016/05/46senda.jpg);
}

div#46 a {
  collar:white;
}



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

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

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

span.role {
    font-size: 15px;
    display: block;
    margin-top: 0;
    padding-bottom: 10px;
    color: #F00;
}

span.good{
        background-color: transparent;
        border: none;
        cursor: pointer;
        outline: none;
        padding: 0;
        appearance: none;
}