@import "reset.css";

* {
 line-height: 1.5;
 font-family:"ＭＳ Ｐゴシック","平成角ゴシック",sans-serif;
}

strong{font-weight:bold;}

/* リンク色（ページ全体） */
a { color: #0000ff; text-decoration: underline; }
a:hover { color: #FF0099; text-decoration: none;}

a:hover img {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha(opacity=60)";
}


hr{
 color:#CCCCCC;
 margin: 10px 20px;
}


.none{
font-weight:normal;
}


/**▼サイトレイアウト*****/

#wrap{
 max-width:800px;
 margin: auto;
 background: url(img/bg2.jpg);
}





/**▼ヘッダー*****/

#head{
 max-width:780px;
 margin:0 auto;
}

#head_img{
 height: 160px;
 background: url(img/health-beauty059.jpg) no-repeat;
 margin-bottom:10px;
}

h1{
 font-family: "HGP創英角ｺﾞｼｯｸUB";
 font-weight: normal;
 color: #56350D;
 font-size:300%;
/* margin:0 30px; */
 padding:42px 0;
text-align: center;
}
h1 a{
 font-family: "HGP創英角ｺﾞｼｯｸUB";
 font-weight: normal;
	color: #FF99CC;
/*	color: #56350D; */
	text-decoration: none;
}




/**▼メインコンテンツ*****/

h2{
/* height: auto; */
/* height: 45px; */
 background: url(img/bg_h2o.jpg);
 background-repeat: no-repeat;
 line-height: 45px;
 font-size: 136%;
 font-weight:bold;
 margin:10px 15px;
 padding-left:50px;
 clear:both;
}

.wrapper {
     float: left;
     margin: 0;
     width: 100%;
     margin-left: -220px;
}

#cnt{
	margin-left: 220px;
 max-width:570px;
 padding: 0px 10px 0 20px;
/*	float:left; */
}

.in_cnt{
 margin:10px 30px;
 padding-bottom: 10px;
}

.in_cnt p{
 background: url(img/note_line3.gif) left bottom;
 margin:0 15px 15px;
 font-size:114%;
 line-height: 25px;
 text-align:justify;
}

.ap_txt{
 margin-top: 5px;
 padding-bottom: 0px;
}

.ap_txt p{
 font-size:160%;
 line-height: 40px;
 text-align:center;
}

.ap_txt a{
 padding: 5px 10px;
 font-weight: bold;
 text-decoration: none;
 background-color: #FF99FF;
}

.in_foot{
 margin:10px 30px;
 padding-bottom: 10px;
}

.in_foot p{
/* background: url(img/note_line3.gif) left bottom; */
 margin:0 15px 15px;
 font-size:90%;
 line-height: 20px;
 text-align:justify;
}



/**▼サイドコンテンツ*****/

#side{
/*	float: right; */
 _width:200px;
 overflow:hidden;
 margin-top:20px;
}

#side_inner{
 margin-right:25px;
}

.side_title {
 background: url(img/side_title.gif);
 border-bottom: 1px solid #6F2C58;
 color: #FFFFFF;
 display: block;
 width:170px;
 _width:168px;
 font-size: 107%;
 font-weight:bold;
 text-align: center;
 padding:3px 0;
}

.side_cont {
 margin:5px auto 0;
 padding-top: 2px;
}

.side_cont ul{
 border-top: 1px solid #D5D1AA;
 border-left: 1px solid #D5D1AA;
 border-right: 1px solid #D5D1AA;
 margin: 0px 0px 0px 0px;
 _width:160px;
}

.side_cont li a {
 background:url(img/side_cont_li.gif) no-repeat 5px center;
 border-bottom: 1px solid #D5D1AA;
 color:#333;
 display: block;
 font-size: 100%;
 padding:4px 0 4px 15px;
 text-decoration:underline;
 _width:151px;
}

.side_cont li a:hover {
 background-color: #FCF9E4;
 color: #000000;
 text-decoration: none;
}




/**▼フッター*****/

#footer{
 text-align: center;
 clear: both;
 overflow:hidden;
}

address {
 font-style: normal;
 color: #FFFFFF;
 text-align: center;
 padding: 5px 0;
 display: block;
 background: #000;
 font-size: 92%;
 margin: 30px 30px 10px;
}




/**▼フッターリンク*****/

#linkspace{
 margin: 0 15px 15px;
 padding:15px 0;
 font-size:100%;
 border-top:1px #ccc solid;
 clear:both;
}

#linkspace ul{
 margin:0 35px;
}

#linkspace a{color:#333;text-decoration:underline;}
#linkspace a:hover{color:#f00;text-decoration:none;}





/**▼ランキング表*****/

.rh3{
 background-image: url(img/bg_h3.jpg);
 line-height: 25px;
 background-repeat: no-repeat;
 padding-left: 25px;
 margin-bottom: 15px;
 font-size:115%;
}


.rank_table{
 margin:0 45px 40px;
 border: 2px solid #CCCCCC;
 clear:both;
}

.rank_table th{
 max-width:150px;
 border: 1px solid #999999;
 vertical-align:top;
 padding-top:10px;
 text-align:center;
}
.rank_table td{
 border:1px solid #999999;
 vertical-align: top;
}

.rank_table td p{
 margin:10px;
 font-size:107%;
 max-width:35em;
}


.rank{
 padding:0px;
 margin:0px;
 background-image: url(img/th_bg.jpg);
}

.rank h3{
 background-image:none;
 padding-left: 10px;
 margin-bottom: 0px;
 margin: 0px;
 font-size:136%;
 font-weight:bold;
 line-height:52px;
 height:50px;
 overflow:hidden;
}


/**▼お申込みボタン*****/

.btn{
 text-align:center;
 margin: 10px 0 20px;
 padding: 10px;
 clear:both;
}



/**▼文字装飾*****/

/*赤文字*/
.rb{ color:#f00;}

/*緑文字*/
.gb{ color:#006400;}

/*下線*/
.uline{ text-decoration:underline;}

/*文字色背景を黄色*/
.yb{ background:#ff0;}

/*文字列を左寄せにする*/
.tl{ text-align:left;}

/*文字列を中央に配置*/
.tc{ text-align:center;}

/*文字列を右寄せにする*/
.tr{ text-align:right;}

/*画像を左に配置し、後に続く文字を右に回り込ませる*/
.left{
 float:left;
 margin:0 20px 0 0;
}

/*画像を右に配置し、後に続く文字を左に回り込ませる*/
.right{
 float:right;
 margin:0 0 0 20px;
}


/*回り込み解除*/
.c_both{ clear:both;}




h3.s1mk {
	font-size:15px;
	margin: 5px 50px 5px 0px;
	padding: 2px 0px 2px 20px;
	font-weight:bolder;
	color: #333;
	background-color: #e1e1b8;
	background-position: 7px 9px ;
	background-repeat: no-repeat;
}

ul.s1mk {
	margin: 10px 0 20px 20px;
/*	list-style-image: url(img/checkmark.gif) ; */
}
.s1mk li {
	font-size:14px;
	font-weight:bolder;
	color: #006400;
	margin: 5px 5px 5px 50px;
/*	text-indent: 50px; */
	list-style-image: url(img/checkmark.gif) ;
}

.s1mk dl {
	margin: 0px 0 20px 0px;
	font-size:14px;
	font-weight:bold;
	color: #3A3A8B;
}
.s1mk dt {
	color: #3A3A8B;
	margin: 10px 0 0 20px;
	padding: 0 0 0 0px;
}
.s1mk dd {
	font-weight:normal;
	color: #003939;
	margin: 0 0 0 40px;
	padding: 0 0 0 0px;
}

/* pr アフィリエイト記事紹介 */
.box-pr{
	margin:5px 30px;
	padding: 2px ;
  }
.box-pr p{
	font-size: 90%;
	color: #494949;
	background-color: #f5f6f7;
	text-align:justify;
  }


/*ボタン変化対応*/
.L-btons{
	text-align:center;
 position: relative;
 width: 100%;
}

.L-btons span{
 margin: 5px;
 width: 100%;  /*ボタンの横サイズをピクセル数で*/
/* width: 450px; */ /*ボタンの横サイズをピクセル数で*/
 float: left;
}

.L-btons span a{
 display: block;
 width: 100%;
 height: 83px;　/*ボタンの縦サイズをピクセル数で*/
 text-indent: -9999px;
 background-repeat: no-repeat;
 overflow: hidden ;
}

.L-btons span a:hover{
 background-repeat: no-repeat;
}

.L-btons span a:active{
 background-repeat: no-repeat;
}

.L-btnlink a,L-btnlink a:hover,L-btnlink a:active{ background-image: url(img/kousiki-lbanner.jpg);}/*ボタンの画像urlを指定してください*/
.L-btnlink a{   background-position: 50px 0; }
.L-btnlink a:hover{ background-position: 50px -83px; }/*ボタンの縦サイズで変更してください*/
.L-btnlink a:active{ background-position: 50px -0px; }/*ボタンの縦サイズで変更してください*/

@media (max-width: 800px) {
     .wrapper, #cnt, #side {
          float: none;
          margin: 5px;
          padding: 0px 5px 0 5px;
          width: auto;
     }

     #side {
		 text-align: center;
     }

	.side_title {
		background-position: center;
		width: auto;
		font-size: 120%;
	}

	.side_cont li a {
		font-size: 120%;
		padding: 10px 0 10px 15px;
	}

	img	{
	max-width: 100%;
	height: auto;
	width /***/:auto;
	display:block;
	}

	#head_img h1{
		font-size:250%;
	}

	.in_cnt, .in_cnt p{
		margin:5px;
	}

	.rank_table{
		margin: auto;
	}
}