@charset "utf-8";
/*
Theme Name: Omoya
Theme URI: https://omoya.co.jp/
Description: 有限会社御母家（新潟県上越市）ブランドサイト用WordPressテーマ。カラーミーショップで公開していたオリジナルテンプレート（HTML+CSS）のデザインを忠実に移植したクラシックテーマです。
Author: 御母家Webサイト移転プロジェクト
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: omoya
Tags: two-columns, right-sidebar, custom-menu, translation-ready
*/

/* =================================================================
 * 御母家サイト固有スタイル
 * （カラーミーショップ「共通.css」を移植し、テンプレート変数を
 *   ショップ設定の実値に置き換えたもの）
 * ================================================================= */

body {
  background-color: #efece6;
  color: #464e54;
}
a       { color: #464e54; }
a:hover { color: #5e5e5e; }

/* 画像リンクのホバー（旧サイトのjQuery fadeToをCSSで再現） */
a img {
  transition: opacity .5s ease;
}
a:hover img {
  opacity: .6;
}

/* -----------------------------------------------------------------
 * レイアウト
 * ----------------------------------------------------------------- */
#wrapper {
  max-width: 960px;
}

/* -----------------------------------------------------------------
 * コンテンツ
 * ----------------------------------------------------------------- */
#contents {
  float: left;
  padding-left: 20px;
  padding-right: 20px;
}
#contents .topicpath-nav {
  margin-bottom: 5px;
}
#contents .topicpath-nav li { padding: 0; }
#contents .topicpath-nav a  { margin-left: 5px; }

/* -----------------------------------------------------------------
 * サイド
 * ----------------------------------------------------------------- */
#side .unstyled img {
  display: block;
  margin-bottom: 5px;
}
#side hr {
  border-top: 10px solid #7b783e;
  border-bottom: 0;
  margin: 0 0 2px;
}
#side_menu {
  border-top: 4px solid #7b783e;
}
#side_menu li { width: 20%; }
#side_menu li:nth-child(1),
#side_menu li:nth-child(2) { width: 50%; }

/* -----------------------------------------------------------------
 * お知らせ
 * ----------------------------------------------------------------- */
#rss-news {
  border-top: 2px solid #7b783e;
  border-bottom: 2px solid #7b783e;
}
#rss-news li { padding: 5px 5px; }

iframe { border: none; max-width: 100%; }

/* -----------------------------------------------------------------
 * タイトル
 * ----------------------------------------------------------------- */
.title-right {
  float: right;
  width: 25%;
  margin-left: 9%;
}
.title-left {
  float: left;
  width: 66%;
}
.titlebar {
  padding-left: .75em;
  border-left: 10px solid #7b783e;
}
.subtitlebar {
  padding-left: .75em;
  border-left: 26px solid #7b783e;
}

/* -----------------------------------------------------------------
 * フッター
 * ----------------------------------------------------------------- */
#footer {
  background-color: #7b783e;
  color: #fff;
}
#footer ul.footer-menu {
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
}
#footer ul.footer-info { display: flex; }
#footer ul.footer-info li {
  width: 33.33%;
  padding: 0 1.5%;
}
#footer a:link,
#footer a:visited { color: #fff; }
#footer a img,
#footer a:hover img { opacity: 1; }

/* -----------------------------------------------------------------
 * スライドショー
 * （旧サイトのbxSlider〈フェード・ランダム開始〉を再現）
 * ----------------------------------------------------------------- */
.omoya-slider {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
.omoya-slider__item {
  opacity: 0;
  transition: opacity 2s ease;
}
.omoya-slider__item.is-active { opacity: 1; }
.omoya-slider__item:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.omoya-slider img {
  display: block;
  width: 100%;
  height: auto;
}

/* -----------------------------------------------------------------
 * 商品ページ
 * ----------------------------------------------------------------- */
#product .product-image img { max-width: 100%; }
#product .product-order-exp img { max-width: 100%; height: auto; }
.product-order .btn-block { max-width: 480px; margin: 0 auto; }
.omoya-order-note {
  border: 2px solid #7b783e;
  padding: 20px;
  background-color: #fff;
}
.omoya-order-note p:last-child { margin-bottom: 0; }

/* -----------------------------------------------------------------
 * お問い合わせ（Contact Form 7）
 * ----------------------------------------------------------------- */
.wpcf7 { margin-bottom: 50px; }
.wpcf7 .omoya-form-table { width: 100%; margin-bottom: 20px; }
.wpcf7 .omoya-form-table th,
.wpcf7 .omoya-form-table td {
  padding: 12px 10px;
  border-bottom: 1px solid #ddd;
  text-align: left;
  vertical-align: top;
}
.wpcf7 .omoya-form-table th { width: 30%; font-weight: bold; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  box-sizing: border-box;
  width: 100%;
  height: auto;
  padding: 8px;
}
.wpcf7 textarea { min-height: 200px; }
.wpcf7 .wpcf7-submit {
  display: inline-block;
  padding: 10px 40px;
  border: 1px solid #7b783e;
  border-radius: 3px;
  background-color: #7b783e;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}
.wpcf7 .wpcf7-submit:hover { background-color: #666339; }
.wpcf7 .omoya-required {
  display: inline-block;
  margin-left: .5em;
  padding: 1px 6px;
  background-color: #7b783e;
  color: #fff;
  font-size: 10px;
  vertical-align: 2px;
}
@media (max-width: 480px) {
  .wpcf7 .omoya-form-table,
  .wpcf7 .omoya-form-table tbody,
  .wpcf7 .omoya-form-table tr,
  .wpcf7 .omoya-form-table th,
  .wpcf7 .omoya-form-table td { display: block; width: auto; }
  .wpcf7 .omoya-form-table th { border-bottom: 0; padding-bottom: 0; }
}

/* -----------------------------------------------------------------
 * お知らせ（投稿）一覧
 * ----------------------------------------------------------------- */
.omoya-news-list { margin: 0 0 50px; list-style: none; }
.omoya-news-list li {
  padding: 10px 5px;
  border-bottom: 1px dotted #b7b49a;
}
.omoya-news-list .omoya-news-date {
  display: inline-block;
  min-width: 7em;
  color: #7b783e;
}
.omoya-entry-meta { margin-bottom: 30px; color: #7b783e; }
.omoya-pagination { margin: 50px 0; text-align: center; }
.omoya-pagination .page-numbers {
  display: inline-block;
  margin: 0 3px;
  padding: 4px 12px;
  border: 1px solid #ccc;
  border-radius: 3px;
  background-color: #f5f5f5;
}
.omoya-pagination .page-numbers.current {
  background-color: #7b783e;
  border-color: #7b783e;
  color: #fff;
}

/* WordPress標準クラス */
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}
.alignleft   { float: left;  margin: 0 20px 20px 0; }
.alignright  { float: right; margin: 0 0 20px 20px; }
.aligncenter { display: block; margin: 0 auto 20px; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 12px; text-align: center; }

/* =================================================================
 * ユーティリティ（旧テンプレートのクラス名を踏襲）
 * ================================================================= */

/* font */
.txt_l { text-align: left; }
.txt_c { text-align: center; }
.txt_r { text-align: right; }
.txt_fwn { font-weight: normal; }
.txt_fwb { font-weight: bold; }
.txt_10 { font-size: 10px; }
.txt_12 { font-size: 12px; }
.txt_14 { font-size: 14px; }
.txt_16 { font-size: 16px; }
.txt_18 { font-size: 18px; }
.txt_20 { font-size: 20px; }
.txt_24 { font-size: 24px; }
.txt_28 { font-size: 28px; }
.txt_c_333 { color: #333; }

/* background */
.bgc_gray { background-color: #f1f1f1; }

/* margin */
.mar_auto { margin: 0 auto; }
.mar_0 { margin: 0; }
.mar_t_0 { margin-top: 0; }
.mar_r_0 { margin-right: 0; }
.mar_b_0 { margin-bottom: 0; }
.mar_l_0 { margin-left: 0; }
.mar_5 { margin: 5px; }
.mar_t_5 { margin-top: 5px; }
.mar_r_5 { margin-right: 5px; }
.mar_b_5 { margin-bottom: 5px; }
.mar_l_5 { margin-left: 5px; }
.mar_t_10 { margin-top: 10px; }
.mar_r_10 { margin-right: 10px; }
.mar_b_10 { margin-bottom: 10px; }
.mar_l_10 { margin-left: 10px; }
.mar_t_20 { margin-top: 20px; }
.mar_r_20 { margin-right: 20px; }
.mar_b_20 { margin-bottom: 20px; }
.mar_l_20 { margin-left: 20px; }
.mar_t_30 { margin-top: 30px; }
.mar_r_30 { margin-right: 30px; }
.mar_b_30 { margin-bottom: 30px; }
.mar_l_30 { margin-left: 30px; }
.mar_t_50 { margin-top: 50px; }
.mar_r_50 { margin-right: 50px; }
.mar_b_50 { margin-bottom: 50px; }
.mar_l_50 { margin-left: 50px; }

/* padding */
.pad_v_10 { padding: 10px 0; }
.pad_v_20 { padding: 20px 0; }
.pad_v_30 { padding: 30px 0; }
.pad_0 { padding: 0; }
.pad_t_0 { padding-top: 0; }
.pad_r_0 { padding-right: 0; }
.pad_b_0 { padding-bottom: 0; }
.pad_l_0 { padding-left: 0; }
.pad_5 { padding: 5px; }
.pad_t_5 { padding-top: 5px; }
.pad_r_5 { padding-right: 5px; }
.pad_b_5 { padding-bottom: 5px; }
.pad_l_5 { padding-left: 5px; }
.pad_10 { padding: 10px; }
.pad_t_10 { padding-top: 10px; }
.pad_r_10 { padding-right: 10px; }
.pad_b_10 { padding-bottom: 10px; }
.pad_l_10 { padding-left: 10px; }
.pad_20 { padding: 20px; }
.pad_t_20 { padding-top: 20px; }
.pad_r_20 { padding-right: 20px; }
.pad_b_20 { padding-bottom: 20px; }
.pad_l_20 { padding-left: 20px; }
.pad_30 { padding: 30px; }
.pad_t_30 { padding-top: 30px; }
.pad_r_30 { padding-right: 30px; }
.pad_b_30 { padding-bottom: 30px; }
.pad_l_30 { padding-left: 30px; }

/* border */
.bor_t_1 { border-top: 1px solid #eee; }
.bor_r_1 { border-right: 1px solid #eee; }
.bor_b_1 { border-bottom: 1px solid #eee; }
.bor_l_1 { border-left: 1px solid #eee; }

/* vertical align */
.va-10 { vertical-align: -10%; }
.va-20 { vertical-align: -20%; }
.va-30 { vertical-align: -30%; }
.va-35 { vertical-align: -35%; }
.va-40 { vertical-align: -40%; }

/* =================================================================
 * レスポンシブ（旧テンプレート踏襲）
 * ================================================================= */
@media (max-width: 768px) {
  #contents { padding-left: 0; }
  #footer ul.footer-info { display: block; }
  #footer ul.footer-info li { width: 100%; }
}

/* -----------------------------------------------------------------
 * 検索アイコン（旧テンプレートのスプライト画像をSVGで置き換え）
 * ----------------------------------------------------------------- */
.omoya-icon-search {
  display: inline-block;
  width: 24px;
  height: 24px;
  vertical-align: -35%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cline x1='15.5' y1='15.5' x2='20.5' y2='20.5'/%3E%3C/svg%3E");
}

/* -----------------------------------------------------------------
 * サイドメニュー画像の余白調整（旧テンプレートのinline styleを移設）
 * ----------------------------------------------------------------- */
#side_menu li img { margin-bottom: 0; }