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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* =========================
   共通カラー変数
========================= */
:root {
  --yellow: #fcd639;
  --orange: #ffb74d;
  --pink: #ff6f89;
  --white: #ffffff;
}

/* =========================
   基本設定
========================= */
html {
  scroll-behavior: smooth;
}
.body {
  font-weight: 500;
}
body.no-scroll {
  overflow: hidden;
  height: 100vh;
}
ol, ul {
  padding-left: 0px;
  list-style: none;
}
/* =========================
   リセット寄り
========================= */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
}
a:hover {
  opacity: 0.8;
}
.container-0 {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-bottom: 0;
}
.main {
    padding: 0;
}
main {
	margin-top:120px;
}
.wp-block-group div, .wp-block-group p, .wp-block-group figure {
	max-width:100%;
}
@media screen and (max-width: 834px) {
    .article ul, .article ol {
        padding-left: 0px;
    }
}
.entry-title {
  display: none;
}
.tabs__panel {
  display: none;
}

.tabs__panel.is-active {
  display: block;
}
/* =========================
   >←これ
========================= */
.arrow-right-white,
.arrow-right-pink {
  position: relative;
}

.arrow-right-white-big,
.arrow-right-pink-big {
  position: relative;
}

/* 共通 */
.arrow-right-white::after,
.arrow-right-pink::after,
.arrow-right-white-big::after,
.arrow-right-pink-big::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: transform 0.3s ease, opacity 0.3s ease;
  margin-left: 4px
}

/* サイズ */
.arrow-right-white::after,
.arrow-right-pink::after {
  width: 10px;
  height: 10px;
}

.arrow-right-white-big::after,
.arrow-right-pink-big::after {
  width: 16px;
  height: 16px;
}

.arrow-right-white::after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.arrow-right-white-big::after {
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
}
.arrow-right-pink::after {
  border-top: 2px solid var(--pink);
  border-right: 2px solid var(--pink);
}
.arrow-right-pink-big::after {
  border-top: 4px solid var(--pink);
  border-right: 24px solid var(--pink);
}

.arrow-right-parent:hover .arrow-right-white::after,
.arrow-right-parent:hover .arrow-right-pink::after,
.arrow-right-parent:hover .arrow-right-white-big::after,
.arrow-right-parent:hover .arrow-right-pink-big::after {
  transform: translateY(-50%) translateX(4px) rotate(45deg);
  opacity: 0.5;
}


/* =========================
   ヘッダー
========================= */
.siteHeader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 120px;
  background-color: var(--white);
  z-index: 1100;
  display: flex;
  justify-content: center;
  align-items: center;
}
.siteHeader__main {
  display: flex;
  max-width: 1200px;
  justify-content: space-around;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}
.siteHeader__logo {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 20%;
  min-width: 200px;
}
.siteHeader__logo a {
	display:flex;
	flex-direction:column;
	gap:4px;
}
.siteHeader__logo__text {
  font-size:24px;
	line-height:28px;
	display:block;
	text-align:center;
	background-color:var(--pink);
	color:var(--white);
}
.siteHeader__logo img{
  width: 100%;
}

.siteHeader__navTop a{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
}
.siteHeader__navTop img{
	width:52px;
}

.siteHeader__globalNav {
  display: flex;
  justify-content: center;
  align-items: center;
}
.siteHeader__globalNavItem a {
  all: unset;
  cursor: pointer;
  font-size: 20px;
  padding:4px 8px;
}
.siteHeader__globalNavItem a span {
  display: block;
  font-size: small;
  color: var(--pink);
}
  .siteHeader__globalNavItem {
  display: flex;
  align-items: center;
  position: relative;
  }

/* ハンバーガー */
.siteHeader__hamburger {
  display: none;
  width: 30px;
  height: 20px;
  position: relative;
  cursor: pointer;
  background: none;
  border: none;
  z-index: 1100;
}

.siteHeader__hamburger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: #333;
  transition: 0.3s;
}

.siteHeader__hamburger span:nth-child(1) { top: 0; }
.siteHeader__hamburger span:nth-child(2) { top: 9px; }
.siteHeader__hamburger span:nth-child(3) { bottom: 0; }

/* 開いたとき（×） */
.siteHeader__hamburger.active span:nth-child(1) {
  transform: rotate(45deg);
  top: 9px;
}
.siteHeader__hamburger.active span:nth-child(2) {
  opacity: 0;
}
.siteHeader__hamburger.active span:nth-child(3) {
  transform: rotate(-45deg);
  bottom: 9px;
}

body.no-scroll {
  overflow: hidden;
}



/* =========================
   フッター
========================= */
.siteFooter {
  background-color:var(--yellow);
  padding-top:40px;
  z-index: 1000;
  font-size: 0.9rem;
}
.siteFooter__inner {
  max-width: 1000px;
  width: 80%;
  margin-right: auto;
  margin-left: auto;
}
.siteFooter__ {
  display:grid;
  grid-template-columns:repeat(2,1fr);
	justify-content:flex-start;
  align-items:flex-start;
}
.siteFooter__top {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction:column;
  gap: 20px;
  margin-bottom: 40px;
}
.siteFooter__logo a {
	display:flex;
	flex-direction:column;
	gap:4px;
	width:80%;
}
.siteFooter__logo img{
	width:100%;
  max-width:300px;
}
.siteFooter__logo__text {
  font-size:24px;
	line-height:28px;
	display:block;
	text-align:center;
}
.siteFooter__navTitle a {
  display: block;
}
.siteFooter__navGroup {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 40px;
  margin-bottom: 20px;
  padding-bottom: 20px;
}
.siteFooter__navGroup--single {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 20px;
}
.siteFooter__navColumn--single {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}
.siteFooter__cta {
  display: flex;
  gap: 40px;
}
.siteFooter__ctaTel a {
  display: block;
  text-align: center;
  text-decoration: none;

);

  color: var(--white);
  width: 100%;
  height: 100%;
  padding: 4px 20px;
}

.siteFooter__ctaLabel {
  display: block;
  font-size: 12px;
}

.siteFooter__policyList {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: smaller;
}
.siteFooter__policyList li a {
  padding: 4px 8px;
}
.siteFooter__policyList li+ li::before {
  content: "";
  width: 1px;
  height: 16px;
  background: var(--pink);
  margin: 0px 8px;
  display: inline-block;
  vertical-align: middle;
  pointer-events: none;
}
.siteFooter__copyright {
  padding-top: 16px;
  padding-bottom: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.siteFooter__ctaContact a {
	font-size:24px;
	padding:12px 20px;
	background-color:var(--white);
}
.fixedCta {
  z-index: 999;
  position: fixed;
  right: 0;
  bottom: 70px;
}
.fixedCta__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.fixedCta__item {
	font-weight:800;
background: linear-gradient(
  to right,
  var(--pink) ,
  var(--yellow)
);
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}
.fixedCta__link--bot {
  display: none;
}
.fixedCta__box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 8px 20px;
}
.fixedCta__image {
  width: 32px;
}
.fixedCta__text {
	line-height:24px;
	padding-top:4px;
}

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


/*834px以下*/
@media screen and (max-width: 834px){
main {
    margin-top: 40px;
}
  /* ハンバーガー表示 */
.siteHeader {
  height: 80px;
}
  .siteHeader__hamburger {
  display: block;
  }


  /* ナビ隠す */
.siteHeader__nav {
  position: fixed;
  top: 80px;
  right: -100%;
  width: 100%;
  height: calc(100vh - 80px);
  display: flex;
  flex-direction: column;
  background: var(--white);
  transition: 0.3s;
}
.siteHeader__navBottom {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
  /* 開いた状態 */
.siteHeader__nav.active {
  right: 0;
  flex-direction: column;
  gap: 40px;
}

.siteHeader__navTop {
  flex-direction: column;
  gap: 40px;
}
.siteHeader__utilityList {
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 40px;
}
  .siteHeader__utilityList li a{
    padding: 12px 20px;
  }


  /* メニュー縦並び */
    .siteHeader__globalNav {
    flex-direction: column;
    gap: 20px;
    padding:20px 20px 60px;
    align-items: flex-start;
    }

  /* 区切り消す（SPでは不要） */
    .siteHeader__globalNav .siteHeader__globalNavItem + .siteHeader__globalNavItem::before,
        .siteHeader__globalNav .siteHeader__globalNavItem + .siteHeader__globalNavItem span::before{
      content: none;
    }
	.siteHeader__globalNavItem {
      display:flex;
      flex-direction:column;
      justify-content:flex-start;
      align-items:flex-start;
	}
    .siteHeader__globalNavItem .submenu {
      position: static;
      display: block;
      background-color: transparent;
      color: var(--sub-text-color);
      font-size: 16px;
      list-style: none;
    }
  /* ナビ開いた状態 */
  .siteHeader__navBottom.active {
  right: 0;
  }
  .siteHeader__navTop.active {
  right: 0;
  }
  .siteHeader__nav {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 80px);
  }
.siteFooter__ {
  grid-template-columns:repeat(1,1fr);
	}
	
}
/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}