@charset "UTF-8";
/* 共通設定
--------------------------------- */
body {
  color: #333333;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, sans-serif;
  font-size: 16px;
  background-image: none;
  padding-top: 0;
  padding-bottom: 0;
}

/* テキスト基本カラー */
.default_txt_color {
  color: #333333;
}

/* 無効カラー */
.disable_color {
  color: #999999;
}

/* テーマの強調カラー */
.theme_txt_color {
  color: #00698C;
}

.theme_bg_color {
  background-color: #FF8000;
  color: #FFF;
}

/* 反転カラー */
.alert_txt_color {
  color: #CE4E3A;
}

.alert_bg_color {
  background-color: #CE4E3A;
  color: #FFF;
}

/* メディアクエリー
--------------------------------- */
/* スマホ（xs） */
/* タブレット（sm） */
/* PCパソコン（md） */
/* ラージ（lg） */
/* オーバーライト（再定義用） 
--------------------------*/
/* 個別設定のフォントを無効化 */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.popover-title,
.shop-product h5 {
  font-family: inherit;
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 10px;
}

/* フォントサイズ */
h1 {
  font-size: 22px;
}

h2 {
  font-size: 20px;
}

h3 {
  font-size: 18px;
}

h4 {
  font-size: 16px;
}

h5 {
  font-size: 16px;
}

h6 {
  font-size: 14px;
}

h1 .small {
  font-size: 18px;
}

h2 .small {
  font-size: 16px;
}

h3 .small {
  font-size: 16px;
}

h4 .small {
  font-size: 14px;
}

/* 引用の文字サイズが大きいので */
blockquote {
  font-size: inherit;
}

/* リンクカラー */
a,
a:hover,
a:focus {
  color: #0059B2;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* ボタンの中身も色が変わるのでやめた 2022.10.13
a:visited {
	color: $text_visited_color;
}
*/
/* リンクした画像は hover時 半透明 */
a:hover img {
  opacity: 0.7;
}

/* リンクを無効にする */
a.disabled {
  pointer-events: none;
  /*リンクを非リンクに変える*/
  cursor: default;
  /*マウスカーソルを矢印のまま変えない*/
  text-decoration: none;
  /*下線を消す*/
  color: #333333;
  /*非リンクの文字色と同じにする*/
}

table.kyogi tbody td a.disabled {
  color: #CCC;
  /* 非リンクの文字色をもっと薄く */
}

/* ボタンフォーカス時の再設定 */
.btn:focus,
.btn-showup:hover,
.btn-showup:focus {
  background-color: #337AB7;
  border-color: #ADADAD;
}

/* リスト左マージンが多すぎるので */
ul {
  padding-left: 30px;
}

/* 印刷時にリンク先が表示されるので */
@media print {
  a[href]:after {
    content: "" !important;
  }

  abbr[title]:after {
    content: "" !important;
  }
}
/* bootstrap の再定義用 
--------------------------*/
/* bootstrap のカラムのネストが左右にはみ出る対処 */
.nest_container {
  margin: 0 10px;
}

/* bootstrap が色を変えてるので */
footer .small {
  color: inherit;
}

/* bootstrapのスタータテンプレート用 */
.starter-template {
  padding: 40px 15px;
  text-align: center;
}

/* ラベルが日本語だけなら padding 調整 */
.label.lang_jp {
  padding: .3em .6em .3em;
}

/* table のボーダーは top じゃなくて bottom に引く */
.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
  border-top: none;
  border-bottom: 1px solid #ddd;
}

/* ボタンのフォーカス時のカラー */
.btn:focus,
.btn-showup:hover,
.btn-showup:focus {
  background-color: #ccc;
}

.navbar-fixed-top {
  background-color: #FFF;
}

/* タイポグラフィ 
--------------------------*/
/* 行間調整 */
.gyokan_00 {
  margin-bottom: 0;
}

.gyokan_10 {
  margin-bottom: 10px;
}

.gyokan_20 {
  margin-bottom: 20px;
}

.gyokan_30 {
  margin-bottom: 30px;
}

.gyokan_40 {
  margin-bottom: 40px;
}

/* タイトル */
.title {
  font-weight: 700;
  /* noto 700 */
  padding: 2px 6px;
}

p.title {
  border-bottom: dotted 1px #CCC;
  margin-bottom: 4px;
  padding: 2px 0;
}

/* リード部分 */
h2.title {
  color: #00698C;
  border-bottom: solid 1px #00698C;
  margin-bottom: 10px;
  padding: 4px 0;
}

/* 項目名 */
.item {
  border-left: solid 5px #00698C;
  color: #00698C;
  padding-left: 5px;
  margin-bottom: 16px;
}

.item_sub {
  border-bottom: dotted 1px #CCC;
  color: #333333;
  font-weight: bold;
  margin-bottom: 10px;
}

/* 英字 */
.english {
  color: #ccc;
  margin-left: 10px;
}

/* エラーメッセージ用 */
.txt_error,
.errors {
  color: #CC0000;
}

/* インデント（マージン調整版） */
.indent {
  margin-left: 20px;
}

.indent2 {
  margin-left: 40px;
}

.indent3 {
  margin-left: 60px;
}

/* ドロップダウンのセクション名（クリック出来ない部分） */
.section_title {
  color: #CCC;
}

/* font awesome 右マージン調整 */
.fa {
  margin-right: 6px;
}

/* アイコン共通の設定 */
.icon:before {
  font-family: FontAwesome;
  display: inline-block;
  width: 1.2em;
}

/* 大きめのアイコン */
.icon.large:before {
  font-size: 1.5em;
}

/* 頭に矢印をつける */
.icon.arrow:before {
  color: #0059B2;
  content: "\f138";
}

/* リンクの頭には別の矢印をつける */
a.icon.arrow:befor {
  color: #0059B2;
  content: "\f054";
}

/* ご注意アイコンを付ける */
.icon.warning:before {
  content: "\f071";
}

.warning {
  color: #CC0000;
}

/* 各種アイコン */
.icon.check:before {
  content: "\f00c";
}

/* チェックマーク */
.icon.pdf:before {
  content: "\f1c1";
}

/* PDF */
.icon.excel:before {
  content: "\f1c3";
}

/* Excel */
.icon.word:before {
  content: "\f1c2";
}

/* Word */
.icon.link:before {
  content: "\f08e";
}

/* 内部リンク（外部リンクと同じアイコン） */
.icon.external:before {
  content: "\f08e";
}

/* 外部リンク */
.icon.before:before {
  content: "\f053";
}

/* 前を示すBEFORE */
.icon.next:before {
  content: "\f054";
}

/* 次を示すNEXT */
.icon.first:before {
  content: "\f100";
}

/* 一番最初に << */
.icon.last:before {
  content: "\f101";
}

/* 一番最後に >> */
/* ビフォー・アフター */
.txt_before {
  color: #85B200;
}

.txt_after {
  color: #E75206;
}

/* タグ、ラベルの padding が小さいので大きく */
.tag li.label {
  padding: 6px;
}

/* 外字をウェブフォント化
参考サイト：https://www.genius-web.co.jp/blog/cat-101/font-icomoon.html
*/
@font-face {
  font-family: 'gaiji';
  src: url("../fonts/gaiji/fonts/gaiji.eot?pjwfnd");
  src: url("../fonts/gaiji/fonts/gaiji.eot?pjwfnd#iefix") format("embedded-opentype"), url("../fonts/gaiji/fonts/gaiji.ttf?pjwfnd") format("truetype"), url("../fonts/gaiji/fonts/gaiji.woff?pjwfnd") format("woff"), url("../fonts/gaiji/fonts/gaiji.svg?pjwfnd#gaiji") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="gaiji-"], [class*=" gaiji-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'gaiji' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.gaiji-tsuchiyoshi:before {
  content: "\e900";
}

.gaiji-tsuji:before {
  content: "\e901";
}

.gaiji-ima:before {
  content: "\e902";
}

.gaiji-kon:before {
  content: "\e903";
}

.gaiji-nishi:before {
  content: "\e904";
}

/* レイアウト 
--------------------------*/
/* レイアウトブロック */
.block {
  margin-bottom: 30px;
}

/* ブロックの中のブロックは行間を少なく */
.block .block {
  margin-bottom: 10px;
}

/* インラインブロック */
.inline_block {
  display: inline-block;
}

/* セパレータ */
.separator {
  border-bottom: dashed 1px #CCC;
  margin-top: 10px;
  margin-bottom: 20px;
}

/* ボックス上のアイテム */
.boxed {
  border: solid 1px #CCC;
}

/* ボックスアイテムの中のコンテンツはパディング確保 */
.boxed p {
  padding: 0 10px;
}

/* メディアの下にマージンを入れればスマホでいい感じ */
.media-left {
  margin-bottom: 10px;
}

/* マストヘッド */
.masthead {
  background-color: #00698C;
  padding: 6px 0;
}

.masthead p {
  color: #FFF;
  font-size: 16px;
  margin-bottom: 0;
}

.masthead p.brand,
.masthead p.phone {
  padding: 4px 0;
}

/* マストヘッド内の要素は全て下マージンなし */
.masthead * {
  margin-bottom: 0;
}

/* ペーパーシャドウ（マテリアルデザイン） */
.paper_shadow {
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  position: relative;
}

/* ヘッダ （トップページ）
--------------------------------- */
/* ロゴマークとテキストの間のマージン */
img.header_logo {
  margin-right: 10px;
}

/* メインナビ（トップページ）
--------------------------------- */
/* ナビの背景 */
.navi {
  background-color: #0085B2;
}

.navbar-default {
  background-color: transparent;
  border: none;
}

.navbar {
  margin-bottom: 0;
}

/* ナビの間隔調整 */
.nav > li > a {
  padding: 15px 20px;
}

/* ナビゲーションのセパレータ 
.navbar-default .navbar-nav > li {
  border-left: solid 1px $theme_color_light;
}*/
/* ナビゲーションのテキスト色 */
.navbar-default .navbar-nav > li > a {
  color: #FFF;
}

/* ナビゲーションのアクティブ色 */
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
  color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.2);
}

/* ナビゲーションの hover */
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.3);
}

/* ドロップダウンメニューのボーダー不要 */
.navbar-nav .dropdown-menu {
  border: none;
}

/* ドロップダウンメニューのアクティブ背景 */
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  background-color: #0085B2;
}

/* ドロップダウンメニューのhover背景 */
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: rgba(0, 133, 178, 0.3);
}

/* スマホ時のナビゲーション */
@media (max-width: 767px) {
  /* スマホ時の文字色 */
  .navbar-default .navbar-brand,
  .navbar-default .navbar-brand:hover {
    color: #FFFFFF;
  }

  /* トグルボタンのボーダーは不要 */
  .navbar-default .navbar-toggle {
    border: 0px;
  }

  /* ハンバーガーアイコンの色 */
  .navbar-default .navbar-toggle .icon-bar {
    background-color: #FFFFFF;
  }

  /* スマホ時のボタン背景色 */
  .navbar-default .navbar-toggle:focus,
  .navbar-default .navbar-toggle:hover {
    background-color: transparent;
    border: 0px;
  }

  /* ドロップダウンメニュー全体の背景 */
  .navbar-nav .open .dropdown-menu {
    background-color: #FFF;
  }

  /* 	ドロップダウンメニューの hover 背景が透明にされてたので元に戻す */
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    background-color: rgba(0, 133, 178, 0.3);
  }

  /* ドロップダウンメニューのアクティブ背景 */
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #FFFFFF;
    background-color: #0085B2;
  }

  .navbar-nav .open .dropdown-menu > li > a,
  .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 10px 20px;
    border-bottom: dotted 1px #CCC;
  }
}
/* ジャンボトロン
--------------------------------- */
/* 下マージン調整 */
.jumbotron {
  margin-bottom: 30px;
}

/* 横幅いっぱいに調整 */
.jumbotron img {
  width: 100%;
}

/* デバイスごとにヘッダと被らないよう調整 */
/* スマホ（xs） */
@media (max-width: 767px) {
  .jumbotron {
    padding-top: 50px;
    padding-bottom: 0;
  }
}
/* タブレット（sm） */
@media (min-width: 768px) {
  .jumbotron {
    padding-top: 100px;
    padding-bottom: 0;
  }
}
/* PCパソコン（md） */
@media (min-width: 992px) {
  .jumbotron {
    padding-top: 50px;
    padding-bottom: 0;
  }
}
/* カルーセル（Slick）・スライダー
--------------------------------- */
/* スライダーの背景 */
.slider {
  background-color: #EEE;
}

/* カルーセルの左が余分 */
.slick ul {
  padding-left: 0;
}

/* 左右の位置、ナビボタンの大きさ変更 */
.slick-prev,
.slick-next {
  width: 30px;
  height: 30px;
  z-index: 100;
}

.slick-prev:before,
.slick-next:before {
  font-size: 30px;
  opacity: 0.5;
}

.carousel {
  margin-bottom: 0;
}

.carousel .slick-prev {
  left: 10px;
}

.carousel .slick-next {
  right: 10px;
}

/* slick標準のアイコンがよく文字化け起こすので FontAwesome に置換 */
button.slick-arrow:before,
.slick-dots li button:before {
  font-family: FontAwesome;
}

button.slick-prev:before {
  content: "\f137";
}

/* fa-chevron-circle-left */
button.slick-next:before {
  content: "\f138";
}

/* fa-chevron-circle-right */
button.slick-prev:before {
  content: "\f053";
}

/* fa-chevron-left */
button.slick-next:before {
  content: "\f054";
}

/* fa-chevron-right */
.slick-dots li button:before {
  content: "\f111";
}

/*  fa-circle */
/* リード
--------------------------------- */
/* リード部分 */
.lead .title {
  color: #00698C;
  margin-bottom: 0;
  border: none;
}

/* リード内のイメージの調整 */
.lead img {
  margin-bottom: 5px;
}

/* リードの文章 */
.lead p {
  font-size: 16px;
  padding-top: 10px;
  padding-bottom: 10px;
}

/* キャプションの背景・角丸 */
h2.caption {
  font-size: 28px;
  padding: 10px;
  background-image: url(../images/bg_caption.png);
  background-repeat: repeat;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
}

h2.caption > * {
  margin-bottom: 0;
  line-height: 1;
}

h2.caption > img {
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px 6px;
}

/* アイテムの背景 */
h3.caption {
  padding: 10px;
  background-image: url(../images/bg_item.png);
  background-repeat: repeat;
}

/* アイテム（アンダーバータイプ） */
h3.title {
  color: #00698C;
  border-bottom: dotted 1px #00698C;
  margin-bottom: 5px;
  padding: 2px 0;
}

h3.title b,
h3.title strong {
  color: #00698C;
  font-size: 140%;
  font-weight: 700;
}

/* ガイド（リード下）
--------------------------------- */
/* リード下のテキストバナー */
.guides .text_banner {
  height: 100px;
  border: none;
  margin-bottom: 10px;
}

.guides .text_banner.kosotai {
  background-color: #00698C;
}

.guides .text_banner.shinjin {
  background-color: #00B285;
}

.guides .text_banner.sokuho {
  background-color: #BC8E29;
}

.guides .text_banner .inner a.banner {
  color: #FFFFFF;
  padding: 20px;
  text-align: center;
  display: block;
}

/* バナーブロックの hover 反転 */
.guides .text_banner .inner a.banner:hover {
  background-color: rgba(255, 255, 255, 0.3);
}

/* お知らせ
--------------------------------- */
.info {
  margin-bottom: 20px;
}

.info li {
  border-bottom: dotted 1px #CCC;
  margin-bottom: 6px;
}

.info li a {
  color: #0059B2;
}

.info li a:hover {
  text-decoration: underline;
}

.info_date {
  color: #00698C;
  margin-bottom: 0;
}

.info_text {
  margin-bottom: 6px;
  margin-left: 1.2em;
}

/* 延期などに使っているワーニング色が薄いので濃く */
.info .label-warning,
.headline .label-warning {
  background-color: #d38312;
}

/* 大会中止等のタイトル */
.bg_danger_reverse {
  background-color: #CC0000;
  color: #FFFFFF;
}

/* バナー
--------------------------------- */
/* インフォメーションの下線と高さを合わせる */
.banners {
  margin-top: 36px;
}

/* バナー間隔 */
.banners li {
  margin-bottom: 10px;
}

/* バナー調整 */
.banners .banner {
  background-color: #EEE;
  padding: 10px;
  border: solid 1px #CCC;
  text-align: center;
}

.banners a.banner {
  display: block;
}

/* バナー 赤 */
.banners .banner.red {
  border-color: #FFC7C7;
  background-color: #FFE5E5;
  color: #FF7373;
}

/* バナー イエロー */
.banners .banner.yellow {
  border-color: #F0DA99;
  background-color: #FFF9E5;
  color: #D9A300;
}

/* バナー 青 */
.banners .banner.blue {
  border-color: #17C6FF;
  background-color: #D7F5FF;
  /*color: $color_blue;*/
}

/* バナー 緑 */
.banners .banner.green {
  border-color: #ABD28A;
  background-color: #dff0d8;
  color: #3c763d;
}

/* バナー 緑kuso */
.banners .banner.kuso {
  border-color: #ABD28A;
  background-color: #dff0d8;
  /*color: $color_yellow;*/
  color: #E9B721;
}

/* バナー 黒 */
.banners .banner.black {
  border-color: #000000;
  background-color: #000000;
  color: #FFFFFF;
}

.flex_outer {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* フッタ
--------------------------------- */
footer {
  background-color: #00698C;
  color: #FFFFFF;
  padding: 20px 0;
  font-weight: 200;
}

/* フッタのリンク */
footer a {
  color: #FFF;
}

footer a:hover {
  color: #FFF;
}

/* 会社名 */
.corporate {
  font-size: 20px;
  color: #FFF;
}

/* QRコードの左マージン */
footer .qr_code.pull-right img {
  margin-left: 10px;
}

/* フットナビ */
.footnavi li {
  margin: 0 4px 6px 5px;
  padding: 0;
  line-height: 1.4;
}

.footnavi li a {
  border-left: solid 2px #FFF;
  padding: 0 6px 2px;
  font-size: 16px;
  /* スマホでは大きめに */
}

@media (min-width: 768px) {
  .footnavi li a {
    font-size: 14px;
    /* 大きさを戻す */
  }
}
.footnavi li a:hover {
  background-color: rgba(0, 0, 0, 0.2);
}

/* スマホ用アイコンボタン内アイコンの色 */
footer .fa-inverse {
  color: #00698C;
}

/* スマホ用アイコンボタンをタップした時の色 */
footer .tap a:hover,
footer .tap a:focus {
  color: rgba(255, 255, 255, 0.5);
}

footer .tap a:hover .fa-inverse,
footer .tap a:focus .fa-inverse {
  color: #FFFFFF;
}

/* コピーライト */
.copyright {
  background-color: #004359;
  color: #FFFFFF;
  padding: 2px 0 4px;
  font-weight: 200;
}

/* ページタイトル ＆ パンくずリスト
--------------------------------- */
.page_header {
  background-color: #EEE;
  padding: 20px 10px;
  border-bottom: dotted 1px #CCC;
}

.page_header h1.title {
  margin-bottom: 0;
  padding: 0;
  color: #00698C;
}

/* パンくずリスト 
--------------------------*/
.breadcrumb {
  color: #333333;
  padding: 0;
  margin-bottom: 0;
  list-style: none;
  background-color: transparent;
  border-radius: 0;
}

/* パンくずリストでリンクさせない部分 */
.breadcrumb > .disabled {
  color: #999;
}

/* カテゴリ内サブナビ 
--------------------------*/
/* サブナビの大きさを調整 */
.subnavi .nav > li > a {
  padding: 10px 15px;
}

/* サブナビの枠を表示 */
.subnavi .nav-pills > li > a {
  border: solid 1px #CCC;
}

/* サブナビ間のマージン調整 */
.subnavi .nav-pills > li {
  margin-left: 0;
  margin-right: 5px;
  margin-bottom: 5px;
}

.subnavi .nav-pills > li + li {
  margin-left: 0;
}

/* 競技別一覧表 
--------------------------*/
/* 競技別テーブル */
table.kyogi thead th {
  background-color: #008fbf;
  color: #FFFFFF;
  vertical-align: top;
}

/* 番号、●の寄せ */
table.kyogi .number {
  text-align: right;
}

table.kyogi .circle,
table.kyogi .month {
  text-align: center;
}

/* セルの上下中央寄せ */
table.kyogi > thead > tr > th,
table.kyogi > thead > tr > td,
table.kyogi > tbody > tr > th,
table.kyogi > tbody > tr > td {
  vertical-align: middle;
}

/* リンクなしの●を薄い色に */
table.kyogi tbody td {
  color: #CCC;
  text-align: center;
}

/* アンダーラインを非表示（これは不要かも）
table.kyogi td a,
.hanrei {
	text-decoration: none;
	color: $text_link_color;
} */
/* 訪問済みはデフォルト色
table.kyogi tbody td a:visited {
	color: $text_visited_color;
} */
/* オンマウス時のhover背景 */
.table-hover > tbody > tr:hover {
  background-color: rgba(0, 105, 140, 0.1);
}

/* 実施されない競技は背景をグレーに（td, th に適用すること） */
table.kyogi td.disabled,
table.kyogi th.disabled {
  background-color: #CCC;
}

/* 左サイドに th があるテーブルは th の幅が広くなりがちなので */
table.narrow_head tbody th {
  width: 20%;
}

/* または table の width:100% を無効にする */
table.width_auto {
  width: auto;
}

/* リンクを設定したまま、リンクされていないように表示する時に利用 */
table.kyogi tbody td a.nolink {
  pointer-events: none;
  cursor: auto;
  color: #CCC;
}

/* ポスター
--------------------------------- */
/* スマホ（xs） */
@media (max-width: 767px) {
  .poster li {
    min-height: 250px;
  }
}
/* タブレット（sm） */
@media (min-width: 768px) {
  .poster li {
    min-height: 230px;
  }
}
/* PCパソコン（md） */
@media (min-width: 992px) {
  .poster li {
    min-height: 210px;
  }
}
/* メッセージボード
--------------------------------- */
.message {
  margin: 100px 10px;
}

/* 送信フォーム 
------------------------------------------------*/
/* 必須入力の前にアスタリスクをつける */
.form_require:before {
  color: #CC0000;
  content: "*";
}

.form_require {
  color: #CC0000;
}

/* 記述例 */
.form_example {
  padding-left: 1em;
  color: #666666;
}

/* フォームの注記 */
.form_chuki {
  color: #666666;
}

/* コメント欄が狭いので */
textarea {
  width: 300px;
}

/* 確認画面の調整 */
.kakunin .form-horizontal .controls {
  font-size: 16px;
  margin-top: 5px;
}

/* 資料請求ボタン、お問い合せボタンの調整 */
.btn_request p {
  font-size: 14px;
  color: #D1F0FF;
  margin-top: 10px;
}

.btn_contact p {
  font-size: 14px;
  color: #F8DCDB;
  margin-top: 10px;
}

.btn_request h4,
.btn_contact h4 {
  font-size: 20px;
}

/* .btn で a タグでないのにクリックできそうな表示になるので修正 */
div.btn:hover,
div.btn:active,
div.btn.active,
div.btn.disabled,
div.btn[disabled] {
  cursor: auto;
  color: #333333;
  background-color: #F5F5F5;
}

/* div.btn を作るとマージンが変わるのを防ぐ */
.btn-block + div.btn-block {
  margin-top: 0;
}

/* ボタンが上の項目と近いので離す */
.form-actions {
  margin-top: 10px;
}

/* 送信フォーム （postmail-utf）
------------------------------------------------*/
/* エラーメッセージ */
.msg {
  color: #CC0000;
}

/* エラ画面・確認画面のヘッダ th の背景色 */
.confirm th {
  background-color: #FFF2E5;
}

/* 詳細ページ
------------------------------------------------*/
/* 記事の前にマージンを置く */
article.post {
  margin-top: 30px;
}

/* 事例の記事の本文中の画像を img-responsive に */
article.post .case .right img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 投稿画面用（TinyMCE）
--------------------------*/
/* TinyMCE の中のDIVは点線表示 */
#editor div {
  padding: 10px;
  border: dashed 1px #CCC;
  /*clear: both;*/
}

/* インデントボックスをTinyMCE内では点線で表示させる */
#editor div.indent,
#editor div.indent2,
#editor div.indent3 {
  border: dashed 1px #CCC;
}

/* フォトギャラリーをTinyMCE内では点線で表示させる */
#editor div.gallery {
  border: dashed 1px #CCC;
}

/* TinyMCE 標準のテキスト寄せにもbootstrapと同じスタイルを */
.justifyleft {
  text-align: left;
}

.justifyright {
  text-align: right;
}

.justifycenter {
  /* これはないが一応 */
  text-align: center;
}

/* TinyMCE の中のブロックは点線表示 */
#editor div.row {
  padding: 10px;
  border: dashed 1px #CCC;
  /*clear: both;*/
}

#editor div.row div[class*="col-"],
#editor div.row p[class*="col-"] {
  padding: 10px;
  border: dashed 1px #CCC;
}

/* ドロップダウンメニューが TinyMCE で非表示になるので */
#editor ul.dropdown-menu {
  display: block;
  position: inherit;
  float: inherit;
  padding-left: 30px;
  list-style: disc;
  font-size: inherit;
  background-color: transparent;
  border: none;
  border-radius: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

#editor ul.dropdown-menu a {
  color: #0085B2;
  padding: 0;
}

#editor ul.dropdown-menu a:hover {
  background-color: transparent;
}

#editor .img-thumbnail {
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto;
}

#editor .text-danger {
  color: #a94442;
}

#editor small,
#editor .small {
  font-size: 85%;
}

/* エディタ内で row に clearfix を効かせる処置 */
#editor .row:before,
#editor .row:after {
  content: " ";
  display: table;
}

#editor .row:after {
  clear: both;
}

/* アイコン共通の設定 */
#editor .icon:before {
  font-family: FontAwesome;
  display: inline-block;
  width: 1.2em;
}

/* 頭に矢印をつける */
#editor .icon.arrow:before,
#editor article .icon.arrow:before,
#editor .post .icon.arrow:before {
  content: "\f138";
}

#editor .icon.arrow {
  color: #0059B2;
}

/* リンクの頭には別の矢印をつける */
#editor a.icon.arrow:before,
#editor article a.icon.arrow:before,
#editor .post a.icon.arrow:before {
  content: "\f054";
}

/* ご注意アイコンを付ける */
#editor .icon.warning:before {
  content: "\f071";
}

#editor .warning {
  color: #CC0000;
}

/* チェックマークアイコン */
#editor .icon.check:before {
  content: "\f00c";
}

/* 付箋 */
#editor .alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}

#editor .alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}

#editor .alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f;
}

#editor .alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

/* ビフォー・アフター */
#editor .txt_before {
  color: #85B200;
}

#editor .txt_after {
  color: #E75206;
}

/* 投稿用にチャンクで用意したスタイル 
--------------------------------------*/
/* 画像左寄せ */
.img_left {
  float: left;
  margin: 0 10px 10px 0;
  max-width: 50%;
}

/* 画像右寄せ */
.img_right {
  float: right;
  margin: 0 0 10px 10px;
  max-width: 50%;
}

/* 拡大機能付き画像 */
img.modal_photo {
  width: 25%;
  /* 元の画像の最初の表示サイズ */
  height: auto;
}

#editor img.modal_photo {
  /* TinyMCE内での表示サイズ */
  width: 25%;
  height: auto;
}

@media (max-width: 767px) {
  /* スマホ時 */
  img.modal_photo {
    width: 100%;
    /* 元の画像の最初の表示サイズ */
    height: auto;
  }
}
/* フォトギャラリー 
--------------------------------------*/
.gallery {
  padding: 20px 0;
  background-color: #e3f8d3;
}

.gallery img {
  margin: 10px 0;
}

/* 商品一覧 
--------------------------------------*/
/* 価格例 
table.price {
	margin-left: 10px;
	margin-right: 10px;
}*/
/* 商品毎にドットのアンダーラインを引く */
.product {
  border-bottom: dotted 1px #CCC;
  margin-bottom: 20px;
}

/* 商品名と価格は大きく */
.product .name,
.product .tax_price {
  font-size: 18px;
  color: #00698C;
  margin-bottom: 5px;
}

/* 商品のラベル間の間隔がないので */
.product.detail .label {
  margin-right: 5px;
}

/* 商品説明の各項目名の下にアンダーラインを */
.product.detail dl dt {
  border-bottom: dotted 1px #CCC;
}

/* 商品説明テーブルの調整 */
.product.detail table th {
  background-color: #EEE;
  white-space: nowrap;
  vertical-align: top;
}

/* カテゴリタイトル  */
.category {
  background-image: url(../images/head_border_gold.png);
  background-repeat: repeat-y;
  padding: 6px 10px;
  color: #FFFFFF;
}

/* メンテナンス中のメッセージ表示（中央に大きく） */
.maintenance {
  margin: 150px 0;
  text-align: center;
}

/* メッセージ同士の行間隔を空ける */
.maintenance * {
  margin-bottom: 10px;
}

/* タブパネル
--------------------------------------*/
.tab_panel {
  /* タブの背景色グラデーション */
  /* アクティブ時のタブ色 */
}
.tab_panel .nav-tabs {
  background: #ffffff;
  /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 80%, #eeeeee 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #ffffff 80%, #eeeeee 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #ffffff 80%, #eeeeee 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
  /* IE6-9 */
}
.tab_panel .nav-tabs > li.active > a,
.tab_panel .nav-tabs > li.active > a:hover,
.tab_panel .nav-tabs > li.active > a:focus {
  border-bottom-color: #FFF;
  background: #d8dbff;
  /* Old browsers */
  background: -moz-linear-gradient(top, #d8dbff 0%, white 50%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #d8dbff 0%, white 50%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #d8dbff 0%, white 50%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8dbff', endColorstr='#ffffff',GradientType=0 );
  /* IE6-9 */
}
.tab_panel .tab-content {
  border: solid 1px #DDD;
  border-top: none;
  padding: 10px 0;
}