@charset "UTF-8";

/* @import "/wp-media/wp-content/themes/media/css/default.css";
@import "/wp-media/wp-content/themes/media/css/layout.css";
@import "/wp-media/wp-content/themes/media/css/contents.css";
@import "/wp-media/wp-content/themes/media/css/class.css";
@import "/wp-media/wp-content/themes/media/css/print.css"; */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
//Google [Noto Sans Japanese]

/*
Theme Name: kaneko-shouten
Theme URI: http://www.aimluck.com/
Description: ごくシンプルなHTMLで構成されたWPテーマです。　必要に応じたウィジェットを設定し、CSSの編集程度で大体のレイアウトを賄えるように作っています。　問題などあれば<a href="mailto:goto@aimluck.com">後藤まで連絡</a>を。</p>
Version: 1
Author: 後藤
Author URI: http://www.aimluck.com/
*/

/***************************************************
	Layout Style
----------------------------------------------------
	●概要
	基本となる大枠レイアウトとそのHTMLスタイルを定義

	●許可
	HTMLスタイルの追加
	スタイルの適宜変更

	●禁止
	ID/クラスの追加

--------------------------------------------------*/

/***** HTML ***************************************/
body {
  font-size: smaller;
}

/***** WRAPPER ************************************/
#wrapper {
  margin-right: auto;
  margin-left: auto;
  text-align: left;
}

/***** HEADER *************************************/
#header {
}
#head_widget {
  float: right;
}
#head_widget h2 {
  display: none;
}

/***** CONTENTS ***********************************/
#contents {
}

/***** MAIN BLOCK *********************************/
#mainWrapper {
}
#mainBlock {
}
.breadcrumb {
  width: 100%;
  line-height: 25px;
  margin-right: 0;
  margin-left: 0;
  font-size: smaller;
  background: #ccffff;
}
.breadcrumb li {
  float: left;
  list-style: none;
}
.breadcrumb li a {
  display: block;
  padding: 0 5px;
}
.breadcrumb li span {
  padding-left: 5px;
}

/***** CONTENT ************************************/
/* エントリーブロック */
.single,
.content {
  width: 100%;
  padding: 1em 0;
}
.postmetadata {
  width: 100%;
}
.title {
  font-size: larger;
  font-weight: bold;
}
.content h3 {
}
.content h4 {
}
.content h5 {
}
.content h6 {
}
.content p {
  line-height: 1.8em;
}
.content pre {
  line-height: 1.8em;
}
.content code {
}
.content .postmetadata {
  padding: 5px;
  background: #f0f0f0;
}

/* navigation */
.navigation {
  width: 100%;
}
.navigation .prev {
  float: left;
}
.navigation .next {
  float: right;
}

/***** SIDE BLOCk *********************************/
#sideWrapper {
}
#sideBlock {
}
#sidebar1 {
}
#sidebar2 {
}

/***** FOOTER *************************************/
#footer {
}
#foot_widget {
}
#foot_widget h2 {
  display: none;
}

/***** COMMENT ************************************/
#commentArea {
}

/* list */
#commentArea ol.commentlist {
  margin: 0;
  font-size: large;
}
#commentArea ol.commentlist li {
  list-style-position: inside;
}
#commentArea ol.commentlist li.even {
}
#commentArea ol.commentlist li.odd {
  background: #f0f0f0;
}
#commentArea ol.commentlist li div.comment-body {
  font-size: small;
}
#commentArea ol.commentlist li div.comment-author {
  background: #cccccc;
}
#commentArea ol.commentlist img.avatar {
}
#commentArea ol.commentlist li cite {
}
#commentArea ol.commentlist li div.comment-meta {
}
#commentArea ol.commentlist li em {
}

/* form */
#commentArea input#author {
}
#commentArea input#email {
}
#commentArea input#url {
}
#commentArea textarea#comment {
  width: 100%;
}
#commentArea input#submit {
  width: 50%;
}

/***************************************************
	ClearFix
--------------------------------------------------*/
.commentlist:after,
#commentArea:after,
.postmetadata:after,
.single:after,
#breadcrumb:after,
#foot_widget:after,
#sidebar2:after,
#sidebar1:after,
#sideBlock:after,
#sideWrapper:after,
.navigation:after,
.breadcrumb:after,
#mainBlock:after,
#mainWrapper:after #head_widget:after,
#header:after,
#wrapper:after,
.clearfix:after {
  content: ".";
  height: 0px;
  clear: both;
  display: block;
  visibility: hidden;
}
.commentlist,
#commentArea,
.postmetadata,
.single,
#breadcrumb,
#foot_widget,
#sidebar2,
#sidebar1,
#sideBlock,
#sideWrapper,
.navigation,
.breadcrumb,
#mainBlock,
#mainWrapper,
#head_widget,
#header,
#wrapper,
.clearfix {
  display: inline-block;
}
* html .commentlist,
* html #commentArea,
* html .postmetadata,
* html .single,
* html #breadcrumb,
* html #foot_widget,
* html #sidebar2,
* html #sidebar1,
* html #sideBlock,
* html #sideWrapper,
* html .navigation,
* html .breadcrumb,
* html #mainBlock,
* html #mainWrapper,
* html #head_widget,
* html #header,
* html #wrapper,
* html .clearfix {
  height: 1%;
}
.commentlist:after,
#commentArea:after,
.postmetadata:after,
.single:after,
.navigation:after,
#breadcrumb:after,
#foot_widget:after,
#sidebar2:after,
#sidebar1:after,
#sideBlock:after,
#sideWrapper:after,
.breadcrumb:after,
#mainBlock:after,
#mainWrapper:after,
#head_widget:after,
#header:after,
#wrapper:after,
.clearfix:after {
  display: block;
}
#completeMessage {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 90%;
  padding: 2em;
  background: #fff;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
  transform: translate(-50%, -50%);
  z-index: 1000;
  text-align: center;
  font-size: 1.1em;
}

#completeMessage p {
  margin: 0;
  line-height: 1.8em;
}
/* モーダルの背景 */
#completeMessage.modal {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* モーダル本体 */
.modal-content {
  background-color: #fff;
  padding: 2em;
  border-radius: 8px;
  position: relative;
  width: 90%;
  max-width: 400px;
  text-align: center;
}

/* 閉じるボタン */
.modal-close {
  position: absolute;
  top: 8px;
  right: 12px;
  background: none;
  border: none;
  font-size: 1.5em;
  line-height: 1;
  cursor: pointer;
}

form#inquiryForm {
  margin: 0 auto;
  background-color: #f1e6db;
  padding: 0;
  border-radius: 8px;
  font-family: "Noto Sans JP", sans-serif;
}

form#inquiryForm .form-group {
  display: flex;
  align-items: flex-start;
  margin-bottom: 16px;
}

form#inquiryForm .form-group label {
  width: 140px;
  padding-top: 10px;
  font-weight: bold;
  color: #4b2c1c;
  font-size: 14px;
}

form#inquiryForm .form-group input,
form#inquiryForm .form-group textarea {
  flex: 1;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
  background-color: #fff;
}

form#inquiryForm .form-group textarea {
  min-height: 100px;
  resize: vertical;
}

form#inquiryForm .error {
  color: #c00;
  font-size: 12px;
  margin-top: 4px;
  display: block;
}

#submitBtn {
  margin-top: 24px;
  padding: 10px 20px;
  font-size: 15px;
  background-color: #7c4f3b;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

#submitBtn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

#completeMessage {
  display: none;
  background-color: #fff;
  padding: 24px;
  text-align: center;
  position: fixed;
  z-index: 1000;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

#completeMessage .modal-close {
  position: absolute;
  top: 8px;
  right: 12px;
  font-size: 18px;
  color: #444;
  cursor: pointer;
}
.action {
  margin: 0 0 0 140px;
}

@media screen and (max-width: 768px) {
  form#inquiryForm .form-group {
    flex-direction: column;
  }
  .action {
    margin: 0;
  }
}
