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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* 背景色 */
body .container {
  background:#F5F1E8;
}

/* 全体テキスト */
body .container {
  font-family: 'Sacramento', cursive;
  font-family: 'Zen Kaku Gothic New', sans-serif;
}
.site-name-text {
  font-weight: 700;
}

/*===== TOPメインコンテンツ =====*/
.content-top.wwa {
  margin: 0;
  padding: 1rem 0;
  background: #FFFFFF;
}
.content-top-in.wrap {
  width: 100%;
}
/* slick */
.slick-list {
  margin: 0 -15px;
}
.slick-slide {
  /*
  margin: 0 15px;
  */
  position: relative;
}
.slick-slide a {
  text-decoration: none;
}
.slick-slide a img {
  height: 100vh;
  margin: auto;
  max-height: 100%;
  max-width: 100%;
  object-fit: cover;
  width: 100%;
}
.slick-slide a.c-slick-slide-text--travel::after {
  content: "Travel";
}
.slick-slide a.c-slick-slide-text--reading::after {
  content: "Reading";
}
.slick-slide a.c-slick-slide-text--game::after {
  content: "Game";
}
.slick-slide a.c-slick-slide-text--soccer::after {
  content: "Soccer";
}
.slick-slide a::before {
  content: "";
  position: absolute;
  background-color: #000000;
  opacity: 0.5;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.slick-slide a::after {
  position: absolute;
  color: #FFFFFF; 
  font-size: 2.4rem;
  z-index: 2;
  font-family: "Cormorant Garamond", serif;
  bottom: 0;
  right: 0;
  padding: 1.6rem;
}
.slick-slide a:hover:before {
  opacity: 0;
}
/*
.slick-item {
  aspect-ratio: 1 / 1;
}
  
.slick-item.slick-item--01 {
  background: url(/wp-content/uploads/2026/01/tarvel_pc.jpg) 100%;
  background-repeat:no-repeat;
  background-size: cover;
}
.slick-item.slick-item--02 {
  background: url(/wp-content/uploads/2026/01/reading_pc.jpg) 100%;
  background-repeat:no-repeat;
  background-size: cover;
}
.slick-item.slick-item--03 {
  background: url(/wp-content/uploads/2026/01/game_pc.jpg) 100%;
  background-repeat:no-repeat;
  background-size: cover;
}
.slick-item.slick-item--04 {
  background: url(/wp-content/uploads/2026/01/soccer_pc .jpg) 100%;
  background-repeat:no-repeat;
  background-size: cover;
}
  */

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

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

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