@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 {
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
.logo img {

}
.navi-in > ul li {
  width:auto!important;
  padding: 0 2em!important;
}
.widget-sidebar th,
.widget-sidebar td,
.widget-sidebar p,
.widget-sidebar li {
  font-size: 14px!important;
}

.widget-sidebar th,
.widget-sidebar td {
  padding: 0.75em;
}

.widget-sidebar .wpp-list {
  padding: 0;;
}
.widget-sidebar .wpp-list li span {
  display: block;
  text-align: right;
  font-size: 12px!important;
}

.prof-read {
  border-bottom:5px solid #aaa!important;
  padding:0 0 1em!important;
  margin-bottom:1em!important;
}

/* 投稿ページのレイアウト崩れ対処 */
@media(min-width:1650px){
.header-container{
	width:100%;
}
.header-container-in.hlt-top-menu {
	width:100%;
}
.content-in{
	max-width:1140px;
	width:100%;
}
.main{
	width:70%;
}
.sidebar{
	width:30%;
	}}

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

/*834px以下*/
@media screen and (max-width: 834px){
  /* ヘッダー */
  .header-container-in.hlt-top-menu {
    flex-direction: column;
  }
  .header-container-in .logo-header {
    text-align: center;
    width: 100%;
  }
  #navi {
    display: none;
  }

  /* メインコンテンツ */
  .content-in {
    flex-direction: column;
  }
  .main,
  .sidebar {
    width: 100% !important;
    margin: 0;
  }
  .wrap {
    width: 100% !important;
    max-width: 100%;
    padding: 0 15px;
  }

  /* フッター */
  .footer-menu .col-lg-3,
  .footer-menu .col-lg-6,
  .footer-menu .col-md-6,
  .footer-menu .col-md-12 {
    width: 100% !important;
    float: none;
    padding: 0;
  }
  .footer-menu {
    padding: 30px 0;
  }
  .footer-menu .row {
    display: flex;
    flex-direction: column;
  }
  .footer_shop-info {
    text-align: center;
  }
  footer .map {
    display: inline-block;
    margin-top: 0.5em;
    margin-left: 0;
  }
  footer .address {
    font-size: 0.9rem;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  #header .site-name-text img {
    width: auto;
    max-width: 200px;
    margin: auto;
  }
  .header-container {
    padding: 10px 0;
  }
  .menu-drawer li {
    padding: 0.75em 0.75em 0.75em 0.75em!important;
    border-bottom: 1px solid #999;
  }
  .entry-title, .archive-title {
    font-size: 1.4rem!important;
    margin: 0 0 0.8em 0!important;
    padding: 0!important;
    line-height: 1.4;
  }
  #main {
    padding: 2vh 0;
  }
  body {
    font-size: 15px;
  }

  /* 記事カード */
  .entry-card-wrap {
    flex-direction: column;
  }
  .entry-card-thumb {
    width: 100%;
    margin-bottom: 8px;
  }

  /* フッター */
  .footer-logo {
    padding: 5vh 0 0 0;
  }
  .footer-logo-text {
    font-size: 1.2rem;
  }
  .footer-menu {
    padding: 20px 15px;
  }
  .footer-menu li {
    padding-bottom: 1em;
  }
  footer .company-name {
    font-size: 1.1rem;
  }

  /* ショップ情報 */
  .shop-info {
    padding: 20px 15px;
  }
  .shop-info h3 {
    width: 80%;
    font-size: 1.1rem;
  }

  /* コンテンツはみ出し防止 */
  img, iframe, video, table {
    max-width: 100%;
    height: auto;
  }
  .content,
  .content-in,
  #content,
  .main {
    overflow-x: hidden;
  }

  /* チャットウィジェットがモバイルフッターメニューと被らないように */
  #ai-chat-toggle {
    bottom: 70px;
    right: 16px;
  }
  #ai-chat-panel {
    bottom: 145px;
  }
}
