/*
Theme Name: maintheme
Theme URI: http://taisetsu-mizu.jp/
Description: 平成の名水百選「大雪旭岳源水」専用テーマです。
Version: 1.0
Author: Coop-Sapporo
Author URI: http://www.coop-sapporo.or.jp/
*/

@charset "utf-8";
/* CSS Document */

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

	リセット

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

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 100%;
}
img {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
ul li,
ol li {
  list-style: none;
  background-image: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
input,
textarea,
select {
  *font-size: 100%;
}
a img {
  border: none;
}

* {
  margin: 0;
  padding: 0;
  outline: none;
}

img {
  border: none;
  margin: 0;
  padding: 0;
  clear: both;
  vertical-align: bottom;
}

body,
textarea {
  font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
}
input,
select {
  font-family: Arial, "ＭＳ Ｐゴシック", sans-serif;
}
p {
  margin: 0;
  padding: 0;
}

* {
  margin: 0;
  padding: 0;
  outline: none;
}

img {
  border: none;
  margin: 0;
  padding: 0;
  clear: both;
  vertical-align: bottom;
}

body,
textarea {
  font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
}
input,
select {
  font-family: Arial, "ＭＳ Ｐゴシック", sans-serif;
}
p {
  margin: 0;
  padding: 0;
}

/* ------ ページの先頭へ ------*/

#pagetop {
  position: fixed;
  bottom: 50px;
  right: 50px;
  clear: both;
  xbackground: none;
  width: 180px !important;
  height: 40px;
  text-align: center;
  display: block;
}

#pagetop a {
  background-color: #416e98;
  color: #fff;
  padding: 15px;
  text-align: center;
  display: block;
  display: inline-block;
  border-radius: 5px;
}

#pagetop a:hover {
  background-color: #5eadcd;
}

/*--------------------------------
■ロールオーバーあれこれ
--------------------------------*/

a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha( opacity=80 )";
  background: #fff;
}
a:hover img {
  filter: Alpha("opacity=80");
  opacity: 0.8;
  /* For IE 5-7 */
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  /* For IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

a,
a:visited,
a:link {
  color: inherit;
  text-decoration: none;
  background-image: none;
}

a:hover {
  color: inherit;
  text-decoration: underline;
  background-image: none;
}

/* ------ cleafix ------*/
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
  overflow: hidden;
  font-size: 0.1em;
  line-height: 0;
}
/* IE7,MacIE5 */
.clearfix {
  display: inline-block;
}
/* WinIE6 below, Exclude MacIE5 \*/
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}

/*--------------------------------
■基本のブロックとレイアウト
--------------------------------*/

/* ------ 大外 ------*/

body {
  width: 100% !important;
  height: 100%;
  background: #fff;
  text-align: center;
  padding: 0;
  word-break: break-all;
  background: #5faece;
  xmin-width: 900px;
  xmin-height: 100%;

  font-size: 14px;
  color: #333;
}

#wrapper {
  text-align: left;
  background: #fff;
  width: 100%;
  margin: 0 auto 0 auto;
  padding: 0;
  clear: both;

  xmin-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

/* ------ 背景入りヘッダ・フッター部分 ------*/

#headwrap,
#footwrap {
  background: url(/wp-content/themes/maintheme/images/common/sky_back.jpg);
  background-position: center;
  width: 100%;
  xmin-width: 900px;
  clear: both;
}

/* ------ ヘッダの中身BOX ------*/

#headcontents {
  width: 900px;
  margin: 0 auto 0 auto;
  text-align: center;
}

/* ------ 最上部の帯 ------*/

#headline {
  background: #416e98;
  height: 30px;
  color: #fff;
  width: 100%;
  xpadding-left: 15px;
  xtext-align: left;
  line-height: 30px;
}

/* ------ 最上部帯のセンタリングBOX ------*/

#headlineinbox {
  width: 900px;
  height: 30px;
  margin: auto;
  text-align: center;
}

/* ------ サイトタイトル ------*/

h1.htitle {
  display: block;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  xfont-weight: 100;
  float: left;
}

/* ------ 最上部帯内リンク ------*/

ul.headtextwrap {
  display: block;
  float: left;
  font-size: 14px;
  height: 30px;
  background-image: none;
}

ul.headtextwrap li.headtextmenu {
  display: block;
  float: left;
  font-size: 14px;
  list-style: none;
  background-image: none;
}

ul.headtextwrap li.headtextmenu a {
  color: #fff;
}

/* ------ 基本のメインメニュー ------*/

ul#mainmenuwrap {
  display: block;
  width: 900px;
  height: 60px;
  margin: 0 auto 0 auto;
}

ul#mainmenuwrap li {
  list-style: none;
  xwidth: 180px;
  xheight: 60px;
  font-size: 1px;
  line-height: 0px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  float: left;
}

ul#mainmenuwrap li a {
  background-size: cover;
  background-repeat: no-repeat;
  display: block;
  width: 225px;
  height: 60px;
}

ul#mainmenuwrap li.menu1 {
  background: url(images/common/concept_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu1 a,
ul#mainmenuwrap li.menu1 a:visited {
  background: url(images/common/concept.jpg) no-repeat;
}

ul#mainmenuwrap li.menu1 a:hover {
  background: url(images/common/concept_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu2 {
  background: url(images/common/factory_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu2 a,
ul#mainmenuwrap li.menu2 a:visited {
  background: url(images/common/factory.jpg) no-repeat;
}

ul#mainmenuwrap li.menu2 a:hover {
  background: url(images/common/factory_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu3 {
  background: url(images/common/oem_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu3 a,
ul#mainmenuwrap li.menu3 a:visited {
  background: url(images/common/oem.jpg) no-repeat;
}

ul#mainmenuwrap li.menu3 a:hover {
  background: url(images/common/oem_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu5 {
  background: url(images/common/prof_on.jpg) no-repeat;
}

ul#mainmenuwrap li.menu5 a,
ul#mainmenuwrap li.menu5 a:visited {
  background: url(images/common/prof.jpg) no-repeat;
}

ul#mainmenuwrap li.menu5 a:hover {
  background: url(images/common/prof_on.jpg) no-repeat;
}

/* ------ ヘッダ下のコンテンツBOX ------*/

#maincontents {
  width: 900px;
  background: #fff;
  clear: both;
  margin: 0 auto 0 auto;
  text-align: center;
  margin-top: 30px;
}

#maincontents > * {
  text-align: left;
}

/* ------ フッタ下のコンテンツBOX ------*/

#footwrap #footcontents {
  width: 840px;
  max-width: 900px;
  margin: auto;
  text-align: left;
  background: #5eadcd;
  padding: 30px 30px 10px 30px;
  color: #fff;
}

#footertop {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #fff;
  line-height: 24px;
}

td.drop {
  width: 25px;
  height: 25px;
}

td.footmenu {
  width: 130px;
}

td.footmenul {
  width: 170px;
}

.footmenu a,
.footmenul a {
  background: none;
  font-size: 13px;
  color: #fff;
}

address {
  font-style: normal;
  font-size: 13px;
  line-height: 16px;
  margin-bottom: 20px;
}

#footerbottom p {
  font-size: 12px;
}

/* ------ 大バナー2個並列用 ------*/

.lbanwrap {
  width: 780px;
  margin: 40px 60px;
  overflow: hidden;
}

.lbanboxl {
  width: 350px;
  float: left;
  height: 480px;
}

.lbanboxr {
  width: 350px;
  float: right;
  height: 480px;
}

p.lbantxt {
  padding: 8px;
  line-height: 18px;
}

/*--------------------------------
■固定ページ・ブログ関連レイアウト
--------------------------------*/

/* ------ 基本の記事ブロック ------*/

.magazinewrap {
  width: 780px;
  margin: 40px 60px;
  overflow: hidden;
}

.magbox {
  width: 820px;
  overflow: hidden;
  padding: 20px;
  margin-bottom: 15px;

  clear: both;
}

.magpbox {
  width: 300px;
  float: left;
  overflow: visible;
  margin-top: 20px;
  margin-left: 20px;
  float: left;
}

.magapbox img {
  vertical-align: top;
}

.magtextbox {
  width: 420px;
  float: left;
  margin: 20px;
}

.magtextbox h4.magtitle {
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3",
    "Hiragino Mincho Pro", serif;
  font-size: 20px;
  color: #171c61;
  line-height: 1.4em;
  width: 420px;
  margin-bottom: 20px;
  xheight: 1.4em;
  min-height: 1.4em;
  overflow: visible;

  font-weight: bolder;
}

.magbox p {
  font-size: 14px;
  line-height: 1.5em;
  color: #444;
  width: 420px;

  font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
}

.magbox p.pcap {
  width: 300px;
  padding: 8px;
  font-size: 12px;
  line-height: 15px;
  color: #555;

  font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
}

img.wline {
  margin: 20px auto 20px 10px;
}

/* ------ Check it!ボックス ------*/

.checkitwrap {
  width: 620px;
  margin-left: 100px;
  margin-bottom: 30px;
}

h6.checkittitle {
  width: 620px;
  height: 40px;
  background: url(images/common/check_title.jpg) no-repeat;
  font-size: 15px;
  color: #fff;
  padding-left: 120px;
  line-height: 40px;
}

.checkitbox {
  width: 440px;
  background: url(images/common/pickback.jpg) repeat-x;
  background-position: top;
  margin-top: 0;
  margin-left: 70px !important;
  padding: 10px 40px 30px 40px;
  color: #fff;
  font-size: 13px;
  line-height: 1.5em;
}

/* ------ ぱんくずリスト用 ------*/

p.crumbs {
  display: block;
  height: 18px;
  margin: 15px 0 40px 5px;
  font-size: 12px;
  color: #555;
}

p.crumbs a.crum,
a:visited.crum {
  color: #555;
  text-decoration: none;
}

p.crumbs a:hover.crum {
  color: #171c61;
  text-decoration: underline;
}

/* ------ 固定ページタイトル用 ------*/

.commontitlewrap {
  overflow: hidden;
  width: 820px;
  margin-left: 20px;
  margin-bottom: 0px;
  height: 50px;
}

.commontitlewrap img {
  float: left;
  margin-right: 10px;
  height: 50px;
  /*vertical-align:central;
	vertical-align:bottom;
	vertical-align:text-top;
	vertical-align:middle;
	vertical-align:baseline;
	vertical-align:sub;
	vertical-align:super;
	vertical-align:text-bottom;*/
}

.commontitlewrap h3 {
  font-size: 20px;
  color: #333;
  float: left;
  line-height: 50px;
  height: 50px;

  xfont-weight: bolder;
}

/* ------ 成分テーブル用 ------*/

table.simpletbl {
}

table.simpletbl tr td {
  height: 1.8em;
  line-height: 1.8em;
  padding: 5px;
  border-bottom: dashed 1px #ccc;
  vertical-align: text-top;
}

/* ------ ページ下部横並びバナー用 ------*/

#ftbanwrap {
  width: 800px;
  border-top: solid 1px #ccc;
  padding: 20px 0 20px 100px;
  overflow: hidden;
  margin-bottom: 25px;
  margin-top: 60px;
}

#ftbanwrap a,
#ftbanwrap a:hover {
  width: 200px;
  height: 50px;
  float: left;
  margin-right: 30px;
  display: block;
  background: none;
}

/* ------ ブログ用 ------*/

#blogwrap {
  width: 880px;
  overflow: hidden;
  margin-left: 15px;
  margin-top: 40px;
  margin-bottom: 40px;
}

#sidebar {
  width: 240px;
  float: right;
  height: 100%;
  border-left: 1px solid #5eadcd;
  font-size: 12px;
  line-height: 2em;
  padding-left: 20px;
}

#bmain {
  width: 550px;
  float: left;
  word-break: keep-all;
  xborder-right: 1px solid #5eadcd;
  overflow: hidden;
}

#bmain a {
  color: #333;
}

#bmain h2 {
  color: #171c61;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.2em;
  border-bottom: dashed 1px #171c61;
  margin-bottom: 12px;
}

#bmain h2 a {
  color: #171c61;
}

#bmain p a {
  color: #333;
}

#bmain p.post-meta {
  font-size: 12px;
  margin-bottom: 15px;
  text-align: right;
}

div.blogcontbox {
  padding: 10px;
  padding-bottom: 20ppx;
  border-bottom: dashed 1px #ccc;
}

/*---- ブログ等一覧の1件の高さ固定用 ----*/
div.bloglistbox {
  max-height: 470px;
  overflow: hidden;

  border-bottom: dashed 1px #ccc;
  padding-bottom: 10px;
}

/*---- ブログ投稿部分用 ----*/

div.blogcontbox strong {
  font-weight: bold;
}
div.blogcontbox p {
  color: inherit;
  margin: 10px;
}

div.blogcontbox p a {
  color: #333;
}

div.blogcontbox h4 {
  border-left: 4px solid #5eadcd;
  padding-left: 7px;
  color: #171c61;
  font-weight: bolder;
  font-size: 1.2em;
  margin-bottom: 15px;
  margin-top: 15px;
}

div.blogcontbox h5 {
  color: #c30d23;
  font-weight: bolder;
}

div.blogcontbox h6 {
  color: #5eadcd;
  letter-spacing: 0.5em;
}

div.blogcontbox p.blogconf {
  color: #555;
  font-size: 11px;
}

div.blogcontbox p.bluep {
  color: #5eadcd;
}
div.blogcontbox p.redp {
  color: #c30d23;
}
div.blogcontbox p.blackwhite {
  background: #000;
  color: #fff;
  line-height: 1.5em;
  padding: 3px;
}

div.blogcontbox span.bluesp {
  color: #5eadcd;
}
div.blogcontbox span.dbluesp {
  color: #0d1449;
}
div.blogcontbox span.redsp {
  color: #c30d23;
}
div.blogcontbox span.greensp {
  color: #448e2f;
}
div.blogcontbox span.pinksp {
  color: #bf4085;
}
div.blogcontbox span.orangesp {
  color: #ea5514;
}
div.blogcontbox span.purplesp {
  color: #920783;
}
div.blogcontbox span.brownsp {
  color: #40220f;
}
div.blogcontbox span.dgraysp {
  color: #444;
}
div.blogcontbox span.mgraysp {
  color: #727171;
}
div.blogcontbox span.whitesp {
  color: #fff;
}

div.blogcontbox span.yewsp {
  background: #f7deb0;
  color: #40220f;
  padding: 3px;
}

div.blogcontbox span.pnkwsp {
  background: #e2a8ca;
  color: #444;
  padding: 3px;
}

div.blogcontbox span.lblwsp {
  background: #91b4d8;
  color: #000;
  padding: 3px;
}

div.blogcontbox span.bwsp {
  background: #000;
  color: #fff;
  padding: 3px;
}

div.blogcontbox span.blbsp {
  background: #0d1449;
  color: #92c8dd;
  padding: 3px;
}

div.blogcontbox span.rwsp {
  background: #c30d23;
  color: #fff;
  padding: 3px;
}

div.blogcontbox span.owsp {
  background: #e83828;
  color: #fff;
  padding: 3px;
}

div.blogcontbox span.gwsp {
  background: #004c26;
  color: #fff;
  padding: 3px;
}

div.blogcontbox img {
  border: none;
}

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

#bmain img {
  margin-top: 15px;
  margin-bottom: 15px;
}

div.navigation {
  margin-top: 40px;
  margin-bottom: 20px;
  font-size: 12px;
}

.post-author {
  width: 90%;
  text-align: right;
  font-size: 12px;
  color: #666;
}

/* ------ サイドバー用 ------*/

#sidebar h2.widget_title {
  color: #171c6c;
  font-weight: bold;
  border-bottom: dashed 1px #ccc;
  margin-bottom: 15px;
}

#sidebar ul {
  xmargin-top: 20px;
  margin-bottom: 30px;
}

#sidebar select {
  xmargin-top: 20px;
  margin-bottom: 30px;
}

#sidebar ul li a {
  color: #333;
}

/*--------------------------------
■汎用
--------------------------------*/

blockquote {
  font-style: italic;
  padding: 28px;
  border-left: solid 1px #ccc;
  font-family: "ＭＳ Ｐゴシック", "メイリオ", sans-serif;
  line-height: 1.3em;
  color: #555;
}
cite {
  font-style: normal;
  padding-left: 28px;
}

.cautcap {
  padding: 8px;
  font-size: 12px;
  line-height: 15px;
  color: #555;

  font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
}

.test {
  border: solid 1px red;
}
.clr {
  clear: both;
}

.fl {
  float: left;
}
.fr {
  float: right;
}

.tlr {
  text-align: right;
}

.mt5 {
  margin-top: 5px;
}
.mt10 {
  margin-top: 10px;
}
.mt15 {
  margin-top: 15px;
}
.mt20 {
  margin-top: 20px;
}
.mt25 {
  margin-top: 25px;
}
.mt30 {
  margin-top: 30px;
}
.mt35 {
  margin-top: 35px;
}
.mt40 {
  margin-top: 40px;
}

.mb5 {
  margin-bottom: 5px;
}
.mb10 {
  margin-bottom: 10px;
}
.mb15 {
  margin-bottomp: 15px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb25 {
  margin-bottom: 25px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb35 {
  margin-bottom: 35px;
}
.mb40 {
  margin-bottom: 40px;
}

.ml5 {
  margin-left: 5px;
}
.ml10 {
  margin-left: 10px;
}
.ml15 {
  margin-left: 15px;
}
.ml20 {
  margin-left: 20px;
}
.ml25 {
  margin-left: 25px;
}
.ml30 {
  margin-left: 30px;
}
.ml35 {
  margin-left: 35px;
}
.ml40 {
  margin-left: 40px;
}
.ml100 {
  margin-left: 100px;
}

.mr5 {
  margin-right: 5px;
}
.mr10 {
  margin-right: 10px;
}
.mr15 {
  margin-right: 15px;
}
.mr20 {
  margin-right: 20px;
}
.mr25 {
  margin-right: 25px;
}
.mr30 {
  margin-right: 30px;
}
.mr35 {
  margin-right: 35px;
}
.mr40 {
  margin-right: 40px;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
  border: 1px solid ##5eadcd;
  background: #fff;
  -webkit-box-shadow: 0 0 3px rgba(94, 173, 205, 1);
  -moz-box-shadow: 0 0 3px rgba(94, 173, 205, 1);
  box-shadow: 0 0 3px rgba(94, 173, 205, 1);
  color: #444;
}
.alignleft {
  float: left;
}

.alignright {
  float: right;
}