@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
*/

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

/*モバイルヘッター用*/
.mobile-menu-buttons {
background: #ffc0cb;
color: white;
}

.mobile-menu-buttons .menu-button > a {
color: white;
}
/*モバイルフッター用*/
.mobile-footer-menu-buttons,
.navi-menu-content,
.mobile-footer-menu-buttons .menu-button > a,
.mobile-footer-menu-buttons .menu-button:hover,
.navi-menu-content a,
.navi-menu-content a:hover {
  background: #ffc0cb;
  color: #fff;
}
/*お知らせラベル*/
.cat-label {
    top: 0.5em; /*上からの距離*/
    left: 0.5em; /*左からの距離*/
    border: none; /*ボーダーを消す*/
    font-size: 12px; /*文字サイズ*/
    color: #fff; /*文字色*/
    background-color: #ffc0cb; /*背景色*/
    padding: 1px 10px; /*余白*/
    border-radius: 14px; /*角を丸く*/
}
/*著者情報を消す*/
.page .author-info {
display: none;
}
/*著者情報を消す*/
.post .author-info {
display: none;
}

.page .date-tags {
display: none;
}
/*見出し用*/
.heading10 {
	position: relative;
	padding-top: 30px;
	font-size: 45px;
	border-bottom: 2px solid rgba(5,62,98,1);
	border-bottom-color: pink;
}

.heading10 span {
	position: relative;
	z-index: 2;
}

.heading10::before {
	content: attr(data-en);
	position: absolute;
	top: 0px;
	left: 0;
	color: rgba(5,62,98,0.2);
	font-size: 50px;
	text-transform: uppercase;
	z-index: 1;
}

/*電話ボタン用*/
@import "https://use.fontawesome.com/releases/v5.13.0/css/all.css";

*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 55%;
}

/* 背景用*/
body {
  padding: 30px 10px;
}

.btn,
a.btn,
button.btn {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn-wrap-pc-sp {
  max-width: 435px;
  margin: 0 auto 20px;
}

a.btn-pc-sp {
  line-height: 1.4;

  width: 49.5%;
  padding: 1.25rem 0;

  color: #ffff;
}

a.btn--tel {
  display: block;

  margin-top: 15px;
  padding: 1rem 0 1rem 2.2rem;

  color: #fff;
  border-radius: 100vh;
  background: #ffc0cb;
  -webkit-box-shadow: 0 3px 0 #db7093;
  box-shadow: 0 3px 0 #db7093;
}

a.btn--tel i {
  font-size: 2rem;
}

a.btn--tel i.fa-position-left {
  font-size: 4rem;

  left: 2rem;
}

a.btn--tel .number {
  line-height: 1;

  display: inline-block;

  margin-top: 0.5rem;
  padding: 0.25rem 2rem;

  letter-spacing: 0;

  color: #ffc0cb;
  border-radius: 0.5rem;
  background: #fff;
}

a.btn--tel:hover {
  color: #fff;
}

.fa-position-left {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1rem;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 1rem;
}
/*リスト用*/
.list-1 li{
  color: #ff69b4;
}

.list-1 li span {
  color: black;
}

/*レイアウトのためのCSS*/
body{
  line-height:1.8;
}
/* サイドバー見出し変更 */
.sidebar h3 {
  background: #dfefff;
  box-shadow: 0px 0px 0px 5px #dfefff;
  border: dashed 1px #96c2fe;
  padding: 0.2em 0.5em;
  color: #454545;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

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