@charset "UTF-8";

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

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

.iframe-wrap {
  position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.iframe-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}
.entry-card-wrap:hover{
    box-shadow: 0 10px 20px -5px rgba(0,0,0,0.2);
    transform: translateY(-2px);
    background-color: white; 
    transition: all .3s ease;
}
/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
  display: none;
}

/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
  display: none;
}

/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
  display: none;
}

/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
  display: none;
}

/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
  display: none;
}

/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{
  display: none;
}
/* グローバルメニューの背景を透過 */
#header {
    opacity: 0.7;
}

/* BIKEOU 125 header redesign */
#header {
  opacity: 1;
}
.header-container {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 78% 15%, rgba(0,208,255,.20), transparent 30%), linear-gradient(120deg, #071426 0%, #0b2740 55%, #083956 100%) !important;
  color: #fff;
  border-bottom: 1px solid rgba(89,224,255,.35);
}
.header-container::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .32;
  background-image: linear-gradient(rgba(93,220,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(93,220,255,.08) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, #000, transparent 78%);
}
.header-container-in {
  min-height: 0;
  position: relative;
  z-index: 1;
  display: block;
}
#header {
  min-height: 150px;
  display: flex;
  align-items: center;
  background: transparent !important;
}
.logo {
  text-align: left !important;
  padding-left: clamp(24px, 6vw, 84px);
}
.logo .site-name-text {
  display: block;
  font-size: 0 !important;
  line-height: 1;
  letter-spacing: 0;
  color: #fff !important;
  text-shadow: none;
}
.logo .site-name-text::before {
  content: "PCXorNMAX";
  display: block;
  font-size: clamp(34px, 4.5vw, 58px);
  font-weight: 900;
  font-style: italic;
  letter-spacing: -.035em;
  color: #fff;
}
.logo .site-name-text::after {
  content: "PCX125  •  NMAX125  •  原付二種";
  display: inline-block;
  margin-top: 12px;
  padding: 7px 14px;
  border: 1px solid rgba(86,224,255,.62);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  font-style: normal;
  letter-spacing: .14em;
  color: #75eaff;
  background: rgba(2,15,27,.42);
}
.tagline {
  display: none !important;
}
.navi {
  background: rgba(4,15,28,.97) !important;
  border-bottom: 1px solid rgba(89,224,255,.25);
  box-shadow: 0 9px 28px rgba(0,14,30,.16);
}
.navi-in > ul {
  justify-content: center;
  gap: 4px;
}
.navi-in a {
  position: relative;
  min-height: 58px;
  display: flex;
  align-items: center;
  padding: 0 22px !important;
  color: #eaf8ff !important;
  font-size: 14px;
  font-weight: 750;
  letter-spacing: .035em;
  transition: color .2s ease, background .2s ease;
}
.navi-in a::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 0;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: #41dcff;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .2s ease;
}
.navi-in a:hover,
.navi-in .current-menu-item > a {
  color: #67e6ff !important;
  background: rgba(54,211,255,.07);
}
.navi-in a:hover::after,
.navi-in .current-menu-item > a::after {
  transform: scaleX(1);
}
@media (max-width: 834px) {
  #header { min-height: 108px; }
  .logo { padding: 20px 18px 18px; text-align: center !important; }
  .logo .site-name-text::before { font-size: 36px; }
  .logo .site-name-text::after { margin-top: 10px; padding: 6px 11px; font-size: 10px; letter-spacing: .08em; }
  .navi { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .navi::-webkit-scrollbar { display: none; }
  .navi-in > ul { display: flex; flex-wrap: nowrap; justify-content: flex-start; width: max-content; min-width: 100%; }
  .navi-in > ul > li { flex: 0 0 auto; width: auto; }
  .navi-in a { min-height: 50px; padding: 0 17px !important; white-space: nowrap; font-size: 12px; }
  .navi-in a::after { left: 17px; right: 17px; }
}

/* Keep homepage feature headings readable over their dark/gradient sections. */
.bikeou-home h2.bo-heading,
.bikeou-home .bo-footer-cta h2 {
  background: transparent !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: 0 3px 18px rgba(0, 8, 20, .55);
}