@charset "UTF-8";

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

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

.wakuchan{
background: #fef9fe;
box-shadow: 0px 0px 0px 10px #fef9fe;
border: dashed 1.5px #e489c8;
padding: 1em 1em;
}


/*　グリーンボタンをLINEと同じ色に */
.btn-green{background-color: #00B900;}


/*　square_btn（女性） */
.square_btn {
  margin : 10px ;
  padding : 30px 40px ;
  border : 5px solid maroon ;
  border: 2px solid #ff7a7a;
  background-color: #FFF;
  font-weight:bold; 
  color: #ff7a7a;
    -webkit-perspective: 500px;
    -webkit-transform-style: preserve-3d;
    perspective: 500px;
    transform-style: preserve-3d;
  overflow:hidden;
}
.square_btn:hover {
	color: #FFF;
  background-color: #ff7a7a;
}

/*　shuryo_btn（女性） */
.shuryo_btn {
  margin : 20px ;
  padding : 10px 40px ;
  border : 5px solid maroon ;
  border: 2px solid #ee8b67;
  background-color: #f2a0a1;
  font-weight:bold; 
  color: #fff;
    -webkit-perspective: 500px;
    -webkit-transform-style: preserve-3d;
    perspective: 500px;
    transform-style: preserve-3d;
  overflow:hidden;
}

/*　square_btn02（新規男性） */
.square_btn02 {
  margin : 10px ;
  padding : 30px 40px ;
  border : 5px solid maroon ;
  border: 2px solid #7b95d8;
  background-color: #FFF;
  font-weight:bold; 
  color: #7b95d8;
    -webkit-perspective: 500px;
    -webkit-transform-style: preserve-3d;
    perspective: 500px;
    transform-style: preserve-3d;
  overflow:hidden;
}
.square_btn02:hover {
	color: #FFF;
  background-color: #7b95d8;
}

/*　shuryo_btn02（男性） */
.shuryo_btn02 {
  margin : 20px ;
  padding : 10px 40px ;
  border : 5px solid maroon ;
  border: 2px solid #7b95d8;
  background-color: #92b7d9;
  font-weight:bold; 
  color: #fff;
    -webkit-perspective: 500px;
    -webkit-transform-style: preserve-3d;
    perspective: 500px;
    transform-style: preserve-3d;
  overflow:hidden;
}

/*　square_btn03（リピーター男性） */
.square_btn03 {
  margin : 10px ;
  padding : 30px 20px ;
  border : 5px solid maroon ;
  border: 2px solid #2678bb;
  background-color: #f0f7ff;
  font-weight:bold; 
  color: #2678bb;
    -webkit-perspective: 500px;
    -webkit-transform-style: preserve-3d;
    perspective: 500px;
    transform-style: preserve-3d;
  overflow:hidden;
}

.square_btn03:hover {
	color: #FFF;
  background-color: #2678bb;
}

/*　shuryo_btn03（リピーター男性） */
.shuryo_btn03 {
  margin : 20px ;
  padding : 10px 40px ;
  border : 5px solid maroon ;
  border: 2px solid #3e62ad;
  background-color: #507ea4;
  font-weight:bold; 
  color: #fff;
    -webkit-perspective: 500px;
    -webkit-transform-style: preserve-3d;
    perspective: 500px;
    transform-style: preserve-3d;
  overflow:hidden;
}

.event-categories { list-style: none;}

.snsInner  {
  text-align:center;
  margin: 20px auto;
}
.snsInner a{
  display: inline-block;
  position: relative;
  font-family: Arial;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  color: white;
  border-radius: 5px;
  padding: 14px 0px;
  width:180px;
}
.facebook {
  background-color: #2e4a88;
  box-shadow: 0 4px 0 #1B3D82;
  text-shadow: 0 -1px -1px #1B3D82;
}
.facebook:hover {
  background-color: #354F84;
}
.facebook:active {
  top: 2px;
    box-shadow: 0 2px 0 #1B3D82;
}
.twitter {
  background-color: #008DDE;
  box-shadow: 0 4px 0 #0078BD;
}
.twitter:active {
  top: 2px;
    box-shadow: 0 2px 0 #0078BD;
}
.twitter:hover {
  background-color: #1397D8;
}
.google {
  background-color: #CC3622;
  box-shadow: 0 4px 0 #BA2714;
}
.google:active {
  top: 2px;
    box-shadow: 0 2px 0 #BA2714;
}
.google:hover {
  background-color: #D04829;
}
.snsInner .line  {
	background-color: #25af00;
  box-shadow: 0 4px 0 #219900;
}
.snsInner .line:active {
  top: 2px;
    box-shadow: 0 2px 0 #208f02;
}
.snsInner .line:hover {
  background-color: #28b403;
}
@media (max-width: 768px){
  .snsInner a{
    width:150pt;
  }
}


@media screen and (min-width: 650px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
}
@media screen and (max-width: 650px){	
  .br-pc { display:none; }
  .br-sp { display:block; }
}


@media screen and (min-width: 650px){	
  .img-pc { display:block; }
  .img-sp { display:none; }
}
@media screen and (max-width: 650px){	
  .img-pc { display:none; }
  .img-sp { display:block; }
}

/*アピールエリアの背景色*/
.appeal-content {background: Transparent;}
/*アピールエリアタイトルの背景色・文字色*/
.appeal-title{
	
  font-size   : 160%;
  font-weight : bold;
  color       : #ffffff;
  text-shadow:  2px  2px 10px #777 ,
               -2px  2px 10px #777 ,
                2px -2px 10px #777 ,
               -2px -2px 10px #777;
	
}
/*アピールメッセージの背景色・文字色*/
.appeal-message {
 display     : inline-block;
 font-size   : 100%;
 font-weight : bold;
 color       : #ffffff;
 text-shadow:  2px  2px 10px #777 ,
               -2px  2px 10px #777 ,
                2px -2px 10px #777 ,
               -2px -2px 10px #777;alignment-baseline
}
.appeal-message a {
 display     : inline-block;
 font-size   : 100%;
 font-weight : bold;
 color       : #FFF;
text-shadow: none; 	
 
}

@media screen and (max-width:767px) {
 .appeal-message a {
 display     : inline-block;
 font-size   : 10px;
 font-weight : bold;
 color       : #FFF;
text-shadow: none; 	

}
}


/*hタグ関連見出し関連hタグ関連*/

.article h3, .article h4, .article h5, .article h6 {
  margin-top: 5px;
  margin-bottom: 20px;
	color: #721C24;
}
.article h2{
text-align:center;
box-shadow: 0px 0px 0px 8px #e60033;	
border: dashed 2px #fff;/*白*/
padding: 0.6em 1em;	
}
	
/*h5タグイベント申し込み*/
.article h5{
	width:80%;
	margin-left: auto;
  margin-right: auto;
	text-align:center;
	background: #fff;
  box-shadow: 0px 0px 0px 5px #fff;
  border: dashed 2px #e60033;/*赤*/
  padding: 0.2em 0.5em;
}
			

/*トップページ上部「タイトル文」*/
.hentry .entry-title {
  font-size: 22px;
	text-align:center;
  margin-top: -20px;
  position: relative;
  background: #f44e59;
  box-shadow: 0px 0px 0px 5px #f44e59;
  border: dashed 2px #fff;
  padding: 0.8em 0.8em;
  color: #fff;
}
.hentry .entry-title:after {
  position: absolute;
  content: '';
  left: -7px;
  top: -7px;
  border-width: 0 0 15px 15px;
  border-style: solid;
  border-color: #fff #fff #fca4ab;/*薄ピンク*/
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}
	
}
@media screen and (max-width:767px) {
.hentry .entry-title {
  font-size: 12px;
}
}

/*サイドバーの見出しデザイン*/

.sidebar h3{
	width :100%;
  color: #fff;/*文字色*/
  padding: 0.7em;/*文字周りの余白*/
  display: inline-block;/*おまじない*/
  line-height: 1.0;/*行高*/
  background: #e60033;/*背景色赤*/
  vertical-align: middle;
  border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
	box-shadow: 0px 0px 0px 6px #e60033;
	border: dashed 2px #fff;/*赤*/
  padding: 0.2em 0.5em;
	
}
.sidebar h3:before {
  content: '●';
  color: white;
  margin-right: 8px;
}

/*フォームの幅と中央揃え*/
.form{
width:98%;
margin-left: auto;
margin-right: auto;	
}
/*フォームのテキストエリアサイズ*/
textarea {
  resize: none;
  width:100%;
  height:40px;
}

/*テーブル幅クリア（フロート効くように）*/
table  {width:auto !important;} 

/*アンカーヘッドのスペースズレを修正*/
.headspace{
   display: block;
   margin-top:-20px;
   padding-top:20px;
}




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