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

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

a:hover,button:hover{
	/*opacity: 0.6; filter: 
	brightness(110%);*/
	color: var(--skin-grayish-site-main-hover)!important;
}

p{
	padding: 0 1em;
}

table{
	background-color: #fff;
}

body.public-page::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background-image: url(https://sub.xn--ec-lg4a3bnm3j5mmce.com/wp-content/uploads/back.jpg);
    background-size: cover;
    background-position: right;
    background-repeat: no-repeat;
}

.breadcrumb.sbp-main-before, .breadcrumb.sbp-footer-before, .breadcrumb.pbp-main-before, .breadcrumb.pbp-footer-before,
.skin-grayish .content .main,
.skin-grayish.front-top-page .content{
	background-color: transparent;
}

.cstm-wave-top-bottom {
  --mask:
    radial-gradient(3.05vmin at 50% 4.3vmin, #000 99%, #0000 101%) calc(50% - 4vmin) 0/8vmin 51% repeat-x,
    radial-gradient(3.05vmin at 50% -2.3vmin, #0000 99%, #000 101%) 50% 2vmin/8vmin calc(51% - 2vmin) repeat-x,
    radial-gradient(3.05vmin at 50% calc(100% - 4.3vmin), #000 99%, #0000 101%) calc(50% - 4vmin) 100%/8vmin 51% repeat-x,
    radial-gradient(3.05vmin at 50% calc(100% + 2.3vmin), #0000 99%, #000 101%) 50% calc(100% - 2vmin)/8vmin calc(51% - 2vmin) repeat-x;
  -webkit-mask: var(--mask);
  mask: var(--mask);
}

.entry-content .wp-block-cover,
.entry-content .wp-block-cover-image {
  margin: 0 calc((100% - 100vw)/2) 1.5em;
  min-height: 600px;
  width: auto;
}

/* アニメーション */
.fade{
    animation-name: fadein;
    animation-duration: 2s;
}
@keyframes fadein{
    from{
    opacity: 0;
    transform: translatey(20px);
    }
    to{
    opacity: 1;
    transform: translatey(0);
    }
}

/* 投稿日・更新日を非表示 */
.page .date-tags {
	display: none;
}

.pagination-next {
	display: none;
}

.skin-grayish .content .main .entry-content{
	border-bottom: none;
}

.skin-grayish .toc-checkbox:checked~.toc-content{
	background-color: #fff;
}

.smf-action .smf-button-control__control{
    color: #fff;
    background-color: #333631;
		background-image: none;
    border-radius: 0px;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    font-size: 1.125em;
    padding: calc(0.667em + 2px) calc(1.333em + 2px);
    text-align: center;
    text-decoration: none;
    word-break: break-word;
    box-sizing: border-box;
}

.wp-block-table .has-fixed-layout {
	display: block;
}

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

/*992px以上*/
/* スマホの時だけ改行 */
@media (min-width:992px){
  .d-lg-none{
    display:none!important
  }
}
/* PCの時だけ改行*/
.d-none{
	display:none;
}
@media (min-width:992px){
	.d-lg-inline{
    display:inline-block!important;
  }
}

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

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