@charset "UTF-8";

/* Reset & Base */
*{box-sizing:border-box}
html,body{height:100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	font-size: 62.5%; /* 16px x 0.625 = 10px(=1rem) */
}
body{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,Helvetica,Arial,sans-serif;color:#1f2937;background:#f6f8fa;line-height:1.85;margin:0;padding:0;
	font-size: 1.6rem;/* 16px★ */
}
a{color:inherit;text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:28px 20px;}
.header{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{font-weight:800;color:#0b5fa5;font-size:20px}
.kicker{font-size:13px;color:#5b6b72}

/* Hero */
.hero{background:linear-gradient(180deg,#ffffff 0%, #f7fbfe 100%);padding:36px;border-radius:10px;box-shadow:0 6px 18px rgba(9,30,45,0.04);margin-bottom:20px}
.h-title{font-size:28px;color:#083a66;line-height:1.25;margin-bottom:10px;font-weight:800}
.h-sub{font-size:16px;color:#355168;margin-bottom:18px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;justify-content: center;}
.btn{display:inline-block;padding:12px 18px;border-radius:8px;font-weight:700;cursor:pointer}
.btn-primary{background:#0b5fa5;color:#fff;border:0}
.btn-ghost{background:#fff;color:#0b5fa5;border:1px solid #cfeef9}

/* Image */
.kv-image{width:100%;height:auto;border-radius:8px;display:block;object-fit:cover;margin-top:12px}

/* Sections */
.section{padding:36px;border-radius:8px;margin-bottom:18px}
.section + .section{margin-top:8px}

/* Alternating backgrounds */
.bg-white{background:#ffffff}
.bg-blue{background:linear-gradient(180deg,#f7fbfe 0%,#eef8ff 100%)}
.bg-green{background:linear-gradient(180deg,#f6fff7 0%,#effff3 100%)}

/* Headings & text */
.h2{font-size:20px;color:#083a66;margin-bottom:12px;font-weight:800}
.lead{font-size:16px;color:#2f4f60;margin-bottom:12px}
.article p{margin:12px 0;color:#2e3a3f;font-size:15.5px}
.article .muted{color:#6b7780;font-size:13.5px}

/* Grid */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
@media(max-width:820px){.grid{grid-template-columns:1fr}}
.grid01{background-color:#fefee2;padding:10px;}
.grid02{background-color:#defcdf;padding:10px;}

/* Feature boxes */
.feature{background:#fff;padding:14px;border-radius:8px;border:1px solid #e6f3fb}
.feature-title{font-weight:700;color:#0b5fa5;margin-bottom:8px}
.feature p{margin:8px 0;color:#34424a}

/* Price box */
.price-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:10px}
.price-card{background:#fff;padding:14px;border-radius:8px;border:1px solid #f0f4f6;min-width:260px}
.price-card .price{font-weight:800;color:#0b5fa5;font-size:18px}
.small{font-size:13px;color:#6b7780}

/* Reviews */
.reviews{display:flex;flex-direction:column;gap:12px}
.review{background:#ffffff;padding:12px;border-radius:8px;border-left:4px solid #d6eef7}

/* FAQ */
.faq dt{font-weight:700;margin-top:12px;color:#153b56}
.faq dd{margin-left:0;padding-left:10px;color:#3a4950}

/* Footer */
.footer{padding:18px 0;text-align:center;color:#6b7280;font-size:13px;margin-top:18px}

/* Responsive tweaks */
@media(max-width:540px){
  .h-title{font-size:20px}
  .hero{padding:20px}
  .section{padding:20px}
}

/* Accessibility focus */
a:focus, button:focus{outline:3px solid rgba(11,95,165,0.15);outline-offset:2px}



/*  追加スタイル（既存スタイルに追記して利用可能）*/
    .container-inner{max-width:920px;margin:0 auto;padding:28px;}
    .section{padding-top:28px;padding-bottom:28px;}
    .section-title{color:#0b5fa5;font-size:20px;margin-bottom:8px;font-weight:700;}
    .lead{color:#1f4f66;font-size:16px;}
    .review-meta{font-weight:700;color:#0f3b57;}
    .review-body{font-size:15px;}
    .faq-q{font-weight:700;color:#153b56;}
    .faq-a{color:#334a52;}
    .small{font-size:13px;}
    .section-muted{background:#f6fbfe;}
    .section-accent{background:#f0fbf7;}
    .price-card .price-amount{font-size:16px;}
    @media(max-width:720px){
      .container-inner{padding:18px;}
      .price-grid{flex-direction:column;}
    }


/* Custom Section 2 */
.section-contact {
  background: #f9f9f9; /* 白より少しグレー寄り、柔らかい印象 */
  padding-top: 32px;
  padding-bottom: 32px;
}

.section-contact .section-title {
  color: #0b5fa5; /* ブルー基調で既存と統一 */
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 12px;
}

.section-contact .lead {
  color: #2d3e46;
  font-size: 16px;
  line-height: 1.8;
}



.submit_btn {
	margin: 0 auto 30px auto;
	text-align: center;
	;
}
.submit-button {
	background-color: #f86600; /* 緑色の背景 */
	color: white; /* テキストの色を白に */
	padding: 10px 50px; /* パディングでボタンの大きさを調整 */
	border: none; /* ボーダーを無くす */
	border-radius: 5px; /* 角を丸く */
	cursor: pointer; /* カーソルをポインターに */
	font-size: 16px; /* フォントサイズを調整 */
	transition: background-color 0.3s; /* 背景色の変化にアニメーションをつける */
}
.submit-button:hover {
	background-color: #de6816; /* ホバー時の背景色を少し暗く */
}




/*-------------------関連情報-----------------------------*/
.kanren_box {
    margin: 10px auto 10px auto;
      color: #111;

}
 @media screen and (min-width: 768px) {
 .kanren_box summary {
 width:600px;
}
}

.kanren_box details {
	margin: 0px 0 0px 0px;
}
.kanren_box summary {
	margin: 0px auto 10px auto;
    text-align:left;
}
 @media screen and (min-width: 768px) {
 .kanren_box summary {
 width:200px;
}
}



/* ポリシー*/
.policy {
	padding: 0;
	width: 90%;
	margin-left: 10px;
	margin-bottom: 30px;
    text-align:left;
}
dl {
	margin: 10px auto ;
	width: 80%;
}
.policy dt {
	color: #039;
	background-color: #f2f2f2;
	padding: 3px 0 3px 10px;
	margin: 10px 0 5px 0;
}
.policy dd {
	padding: 10px 0 20px 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #d6d6d6;
}
.policy ol {
	padding-left: 35px;
}
.policy ul {
	padding-left: 35px;
}
/*-------------------会社概要-----------------------------*/
.gaiyoutable {
	border: 1px #356aa0 solid;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 10px auto ;
	width: 80%;
	text-align:left;

}
.gaiyoutable th {
	padding: 15px 15px 0px 5px;
	font-weight: bold;
	display: block;
	color: #FFF;
	background: #5085bb;
}
.gaiyoutable td {
	padding: 15px;
	border: 1px #356aa0 solid;
	border-width: 0 0 1px 1px;
	display: block;
}
 @media screen and (min-width: 768px) {
.gaiyoutable th {
	padding: 15px;
	border: #356aa0 solid;
	border-width: 0 0 1px 1px;
	font-weight: bold;
	white-space: nowrap;
	display: table-cell;
	width: 20%;
}
.gaiyoutable td {
	padding: 15px;
	border: 1px #356aa0 solid;
	border-width: 0 0 1px 1px;
	display: table-cell;
}
}




/* ★パーツ
------------------------------------------------------------*/

/* 上部に戻るボタン */
.back-to-top {
  position: fixed;
  right: 1em;
  bottom: 1em;
  background-color: #666;
  color: #fff;
  font-size: 1.2rem;
  width: 2.8rem;
  height: 2.8rem;
  line-height: 2.8rem;
  text-align: center;
  border-radius: 50%;
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  z-index: 999;
}

/* お問い合わせボタン */
.contact-fix-button {
  position: fixed;
  right: 1em;
  bottom: 4.5em;
  background-color: #f86600e3;
  color: #fff;
  font-size: 0.95rem;
  padding: 0.7em 1.2em;
  border-radius: 30px;
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  z-index: 999;
}
/* 注文するボタン */
  .order-fix-button {
  position: fixed;
  right: 1em;
  bottom: 9em;
  background-color: #4CAF50;
  color: #fff;
  font-size: 0.95rem;
  padding: 0.7em 1.2em;
  border-radius: 30px;
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  z-index: 999;
}
  
  
  
  
/* === PC・タブレット拡張（769px以上） === */
@media screen and (min-width: 769px) {

  /* .back-to-top */
  .back-to-top {
    right: 2em;
    bottom: 2em;
    font-size: 1.5rem;
    width: 3.2rem;
    height: 3.2rem;
    line-height: 3.2rem;
  }

  /* .contact-fix-button */
  .contact-fix-button {
    right: 2em;
    bottom: 6em;
    font-size: 1.05rem;
    padding: 0.8em 1.6em;
  }
  /* .contact-fix-button */
  .order-fix-button{
    right: 2em;
    bottom: 10em;
    font-size: 1.05rem;
    padding: 0.8em 1.6em;
  }
}

/* 商品セクション全体：スマホファースト（縦並び） */
.item-block {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 1.5em;
  margin: 2em auto;
  text-align: center;
}

/* テキストエリア */
.item-details {
  margin-bottom: 1.5em;
}

/* タイトル（h4） */
.item-details h4 {
  font-size: 1.2rem;
  color: #0078D4;
  margin-bottom: 0.4em;
  font-weight: 700;
}

/* 価格表示 */
.item-price {
  font-size: 1.1rem;
  color: #d22;
  font-weight: bold;
  margin-bottom: 1em;
}

/* 注文ボタン */
.cta-btn-large {
  display: inline-block;
  background-color: #4CAF50;
  font-size: 1.2rem;
  color: #fff;
  font-weight: bold;
  padding: 0.8em 1.6em;
  border-radius: 6px;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.2s ease-in-out;
  margin-bottom: 1em;
}
.cta-btn-large:hover {
  background-color: #45a049;
}

/* 注意書き（やや小さめ） */
.item-note {
  font-size: 0.9rem;
  color: #555;
  margin-bottom: 1.5em;
}

/* 商品画像 */
.item-img {
  width: 100%;
  max-width: 500px;
  height: auto;
  border-radius: 4px;
  display: block;
  margin: 0 auto;
}

/* PC表示用（中央寄せ・横並び） */
@media screen and (min-width: 769px) {
  .item-block {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    gap: 2em;
    max-width: 1060px !important; /* ←中央寄せ用の最大幅指定 */
    padding: 2em;
  }

  .item-details {
    flex: 1;
    max-width: 440px; /* ←説明エリアを抑えて間延び防止 */
    text-align: left;
  }

  .item-image {
    flex-shrink: 0;
  }

  .item-img {
    max-width: 260px;
  }

  .item-details h4 {
    font-size: 1.5rem;
  }

  .item-price {
    font-size: 1.3rem;
  }

  .cta-btn-large {
    font-size: 1.3rem;
    padding: 1em 2em;
  }

  .item-note {
    font-size: 1rem;
  }
}

.item_list{
text-align:left;
list-style:disc;
margin:0px 0px 0px 20px;
}

/* CTAの、よくある質問のリンクボタン */
.cta-btn-contact,
.cta-box-contact a {
  display: inline-block;
  background-color: #f86600e3;
  font-size:1.6rem !important;
  color: #fff;
  font-weight: bold;
  padding: 1.1em 2.0em;
  border-radius: 6px;
  text-align: center;
  transition: background-color 0.2s ease-in-out;
}
.cta-btn-contact:hover {
  background-color: #de6816;
}




/* ★サンプルダウンロードページ
------------------------------------------------------------*/




.download-section {
  text-align: center;
  margin: 20px 0;
}

.microcopy {
  font-size: 1.1rem;
  color: #333;
  margin-bottom: 8px;
  font-weight: 600;
}

.download-btn {
  display: inline-block;
  background-color: #007acc;
  color: #fff;
  text-decoration: none;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 1.3rem;
  font-weight: bold;
  transition: background-color 0.3s ease;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  margin: 5px 0 10px 10px;
  width: 220px;
}

.download-btn:hover {
  background-color: #005fa3;
}

.download-btn:active {
  background-color: #004d80;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2) inset;
}




.note {
	padding: 10px 15px;
	margin: 20px 0;
	font-size: 1.2rem;
	background-color: #FFFFE1;
	border-left-width: 4px;
	border-left-style: solid;
	border-left-color: #FFFF00;
}

h3.kouri {
    font-size: 1.4rem;
    font-weight: 600;
    color: #333;
    margin-top: 2em;
    margin-bottom: 0.6em;
    border-bottom: 2px solid #0078D4;
    padding-bottom: 0.3em;
    line-height: 1.0;
}
.img-responsive {
  display: block;
  height: auto;
  max-width: 100%;
}
.centerblock{
	display:block;
	margin-left:auto;
	margin-right:auto;
}

.wrap12 {
	background-color: #FFF8D9;
    max-width: 920px;
    margin: 0 auto;
    padding: 28px;
}
.wrap12 h2{
  font-size: 1.6rem;
  font-weight: bold;
  color: #005a9e;
  margin-bottom: 1em;
  border-left: 6px solid #0078D4;
  padding-left: 0.8em;
  background: linear-gradient(to right, #eaf4ff 0%, transparent 100%);
}

.contact-submit {
    display: block;
    margin: 5px auto 70px auto;
    text-align: center;
}


/* ★ページ
------------------------------------------------------------*/


@media screen and (min-width: 768px) {
}