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

/*-------------------------★　共通設定　★-------------------------*/

* { /*アスタリスクのセレクタは、「あらゆる全ての要素」の意味*/
	margin: 0px;/*各ブラウザ固有の、外余白をリセット*/
	padding: 0px;/*各ブラウザ固有の、内余白をリセット*/
	font-size: 100%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /*各ブラウザの持つ、フォントの種類を指定する*/
	list-style-type: none;/*各ブラウザ固有の、リストのマーカーのタイプをリセット*/
}

img {
border: none;/*各ブラウザ固有の、画像枠をリセット*/
	/*box-shadow: 1px 1px 3px #666666;*/
	overflow: hidden;
}

html {
	background-color: #ffffff;
}

ul, ol, dl {
	padding: 0;
	margin: 0;
}



/*-------------------------★　基本設定　★-------------------------*/

body {
	line-height: 1.6;/*行の高さの、体裁を整える　文字の大きさの160%が標準*/
	font-size: 100%;/*フォントの大きさを指定*/
	font-weight: 500;
	text-align: center;/*幅指定のメインをブラウザ(body)の中央に配置*/
	color: #444444;/*標準の文字色：濃いグレー*/
	background-image:url(../imgtool/white0017.png);
	background-repeat: repeat;
}



/*-------------------------★　背景基本設定　★-------------------------*/

/*-----☆　背景色の設定　☆-----*/

/*☆　背景　単色　☆*/
.bg-red {
	background-color: #EE0000;
}
.bg-blue {
	background-color: #0066FF;
}
.bg-green {
	background-color: #009933;
}
.bg-gray {
	background-color: #C0C0C0;
}


/*☆　背景　ちょっとグラデーション（中央濃い）　☆*/
.grabk-red {
	background: linear-gradient(#EE3333,#EE0000,#EE3333);
    background: -moz-linear-gradient(top, #EE3333,#EE0000,#EE3333); /*mozilla*/
    background: -webkit-gradient(linear, center top, center bottom, from(#EE3333), color-stop(#EE0000), to(#EE3333)); /*Webkit*/
}



/*-------------------------★　ヘッダーの設定　★-------------------------*/

#header {
	width: 100%;
	color: #ffffff;
	/*margin-bottom: 5px;*/
	background-color: #777777;
}

/*はみ出し防止のマージン・パディングなしの枠だけ---*/
#header_container {
	width: 960px;
	height: 30px;
	/*max-width: 1260px;  最大幅を指定。IE6では無視。*/
	/*min-width: 780px;  最小幅を指定、行の長さを保つ。IE6では無視。*/
	margin: 0 auto;
	padding-top: 10px;
	text-align: center;
/*	background-color: #CF0;*/
}

/*左上見出しh1---*/

h1 {
	float: left;
	font-weight: normal;/*文字の太さ*/
	text-align: left;
}

/*右上コメント---*/

/*p.shop_rin { 文字罫線の設定
	background-image: url(file:///S|/lolipop/imgtool/text_line.gif);
	background-repeat: repeat;
}*/

#shop_rin {
	float: right;
	font-weight: normal;/*文字の太さ*/
	text-align: right;
}

.border {
	width: 100%;
	height: 10px;
	background: linear-gradient(#aaa, #333);
    background: -moz-linear-gradient(top, #aaa, #333); /*mozilla*/
    background: -webkit-gradient(linear, center top, center bottom, from(#aaa), to(#333)); /*Webkit*/
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#aaa', endColorstr='#333'); /*IE5.5以上*/
/*	background-color: #333333;*/
	box-shadow: 1px 1px 5px #666666;
}


/*-------------------------★　大枠の設定　★-------------------------*/

#wrapper {/*大枠*/
	width: 1000px;
	border-style: solid;
	border-color: #ccc;
	border-width: 1px;
	box-shadow: 1px 1px 5px #666666;
	background-color: #FDFDFD;
	margin: 0 auto;
}

#inner {/*大枠内枠*/
	width: 960px;
	/*width: 80%;*/
	/*max-width: 1260px;  最大幅を指定。IE6では無視。*/
	/*min-width: 780px;  最小幅を指定、行の長さを保つ。IE6では無視。*/
	margin: 15px auto;
	/*background-color: #eeeeee;確認用に色付け中、後から#ffffffに変更*/
}


/*-------------------------★　トップメニューの設定　★-------------------------*/
#index {
	text-align: center;
	margin: 0 0 10px 0;
	/*background-color: #ffffff;確認用に色付け中、後から#ffffffに変更*/
	background-image:url(../imgtool/white0017.png);
}

#index ul {
	width: 100%;
	background-position: left top;
	clear: both;
}

ul#index li {
	padding-left: 6px;/*縦ラインと文字の余白*/
	padding-right: 2px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #999999;
	display:  inline;/*横並びにする*/
	list-style-type: none;
}

ul#index li.last {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #999999;
}

ul#index li a {
	padding-top: 10px;
	padding-bottom: 10px;
	text-decoration: none;/*下線なし*/
	color: #666666;
}


/*-------------------------★　メインの設定　★-------------------------*/

.container {/*メイン内の各項目（h2）の外枠　内枠はbox.cssにあり*/
	width: 100%;
	margin-bottom: 5px;
	text-align: center;
/*	border-style: solid;
	border-color: #ccc;
	border-width: 1px;*/
	/*box-shadow: 1px 1px 5px #666666;*/
/*	background-color: #ffffff;*/
}


/*-----☆汎用の子ボックス☆-----*/
.contents {
	margin: 30px;
	text-align: center;
}



/*画像混在、文字を回り込ませる設定*/

.img-left,
.img-right {
   overflow: hidden;
   height: auto;
}
 
.img-left img {
   float: left;
   margin: 0 15px 0 0 !important;
   padding: 0 !important;
   border: 0 !important;
}
 
.img-right img {
   float: right;
   margin: 0 0 0 15px !important;
   padding: 0 !important;
   border: 0 !important;
}
 
.img-left p,
.img-right p {
   overflow: hidden;
   height: auto;
}

/*編集まだ～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～*/

/* ~~ このセレクターグループは、.content 内のリストに領域間隔を指定します。~~ */
.contents ul, .contents ol { 
	padding: 0 15px 15px 40px; /* この余白は、上述の見出しと段落ルールの右の余白を表します。下の余白はリスト内の他のエレメントとの間隔用に配置され、左の余白はインデント作成用に配置されています。これは必要に応じて調整できます。 */
}

/* ~~ その他の float/clear クラス ~~ */
.fltrt {  /* このクラスを使用すると、ページ内でエレメントを右にフローティングさせることができます。フローティングさせるエレメントは、ページ内で横に並べて表示するエレメントの前に指定する必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスを使用すると、ページ内でエレメントを左にフローティングさせることができます。フローティングさせるエレメントは、ページ内で横に並べて表示するエレメントの前に指定する必要があります。 */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、.container で overflow:hidden が削除されている場合に、<br /> または空の div で、フローティングさせる最後の div に続く最後のエレメントとして (#container 内に) 配置できます。 */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/*編集まだ～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～*/



/*-------------------------★　カウンターの設定　★-------------------------*/

.counter {
	height: 20px;
	margin-top: 10px;
	text-align: left;
}

/*-------------------------★　ページトップへ　★-------------------------*/

.pagetop {
	height: 20px;
	text-align: right;
}

/*-------------------------★　フッターの設定　★-------------------------*/

#footer {
	width: 100%;
	height: auto;
	text-align: center;
	margin: 0 auto;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #ffffff;
	background-color: #666666;
	background-position: left top;
	box-shadow: 1px 1px 3px #666666;
	clear: both;
}

#footer ul {
	width: 960px;
	margin: 0 auto;
	padding: 0 auto;
	text-align: center;
	overflow: hidden;
}


/*フッターメニュー　----------*/

#footer ul li {
	padding-left: 6px;
	padding-right: 1px;
	color: #ffffff;
	border-left-width: 1px;/*各リンク間の区切り線太さ*/
	border-left-style: solid;/*各リンク間の区切り線スタイル*/
	border-left-color: #ffffff;/*各リンク間の区切り線の色*/
	display: inline;
	list-style-type: none;
}

#footer ul li.last {
	border-right-width: 1px;/*リンク部分の一番右端に表示される線太さ*/
	border-right-style: solid;/*リンク部分の一番右端に表示される線スタイル*/
	border-right-color: #ffffff;/*リンク部分の一番右端に表示される線の色*/
}

#footer ul li a {
	color: #ffffff;
}

#footer ul li a:hover {
	color: #ffcc00;
}


/*コピーライト　----------*/

#copy_r {
	padding: 3px  auto;
	font-size: 11px;/*文字サイズ*/
	color: #aaaaaa;/*文字色*/
}


/*address　----------*/

#address {
	text-align: center;
	font-size: 11px;
	color: #aaaaaa;/*文字色*/
}

#address a {
	color: #aaaaaa;/*文字色*/
}

#address a:hover {
	color: #ffffff;
}



/*-------------------------★　変更削除禁止！ブラウザの問題を回避する設定開始
参考サイト：http://c-brains.jp/blog/wsg/07/03/05-200203.php　★-------------------------*/

.clearfix:after {/*モダンブラウザ用。IE7・IE6・Mac版IE5には、after擬似要素が未対応。*/
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {/*IE7とMac版IE5対策用。*/
	display: inline-table;
	min-height: 1%;
}

/*IE6以前への対応*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}

/*-------------------------変更削除禁止！ブラウザの問題を回避する設定終了-------------------------*/