@charset "shift_jis";
/* CSS Document */

html {
	font-size: 62.5%;
	margin:0 auto;
	text-align:center;
}
* {
	margin:0;
	padding:0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
img {
	width:100%;
	max-width:980px;
	height: auto;
	margin:0;
	font-size:1px;
	line-height:1px;
	border:none;
}
body {
	margin:0px auto 0 auto;
	background:url(../img/bg-all.jpg) #1986f4 repeat-x;
	font-size:1.8rem;/* 18px*/
	line-height:2.5em;
	padding-bottom:30px;
}
#wrapper {
	display:inline-block;
	text-align:center;
	max-width: 900px;
	text-align:center;
	margin:0 auto 0 auto;
	padding:0 0 0 0;
	background:#FFF;
	text-align:center;
	font-size:1em;
	border-top:none;
}
#wrapper a:hover img {
	filter: alpha(opacity=60);
	opacity:0.6;
	background:#fff;
}
h1 {
	position:relative;
	top:5px;
	color:#0099FF;
	font-size:12px;
	line-height:14px;
	font-weight:normal;
	text-align:left;
	overflow:hidden;
	margin:0 auto 0 auto;
	padding:0 0 0 5px;
	z-index:1;
}
h1 span {
	text-align:left;
	padding:0 0  10px;

}
h2 {
	text-align:center;
	margin:-14px auto 0 auto;
	padding:0 0 0;
}
h2 img {
	vertical-align:top;
	margin:0 auto;
	padding:0;
}
div.topimg {
	text-align:center;
	margin:0 auto;
}
div.topimg img {
	vertical-align:top;
	text-align:center;
}
#wrapper div.text {
	width:92%;
	margin:0 auto 0px auto;
	text-align:center;
	padding:0;
	overflow:hidden;
}
#wrapper div.text p {
	margin:15px 10px;
	text-align:left;
	clear:both;
	font-size:1em;
}
 @media screen and (max-width: 600px) {
#wrapper div.text p {
	line-height:1.6em;
	margin-bottom:1.2em;
}
}
#wrapper div.text img {
	max-width:800px;
}
/*コンテンツ*/



/*タイマー*/
#wrapper div.time {
	height:55px;
	line-height:60px;
	text-align:center;
	background:url(../img/top-timer.jpg) no-repeat;
	color:#FFFFFF;
	margin:0px 0 30px 0;
	overflow:hidden;
	padding:0 0 0;
}
/*タイマーここまで*/


/*色付ボックス*/
#wrapper div.box-color {
	width:92%;
	background:url(../img/color-box-bg.jpg) repeat-x #feffef;
	margin:10px auto 10px auto;
	text-align:center;
	padding:0 10px;
	padding-bottom:10px;
	overflow:hidden;
	border: solid 1px #FF9933;
	border-radius: 10px;        /* CSS3草案 */
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 10px;   /* Firefox用 */
}
#wrapper div.box-color h3 {
	background:#FFFFFF;
	margin:30px auto;
	text-align:center;
	font-size:18px;
	border-top:#FF9900 solid 1px;
	border-bottom:#FF9900 solid 1px;
}
#wrapper .box-color h4 {
	text-align:left;
	background:url(../img/point2.gif) 0 8px no-repeat;
	padding:0 0 0 20px;
	color:#06F;
	margin:20px 0 0px 10px;
	list-style:none;
	font-weight:bold;
	font-size:24px;
}


#wrapper div.box-color img {
	width:90%;
	max-width:668px;
	margin:20px auto 20px auto;
	text-align:center;
	border: 1px solid #ccc;
	padding: 5px;
}
#wrapper div.box-color img.tit {
	margin:10px auto 0 auto;
	text-align:center;
	border:none;
	padding: 5px;
}
#wrapper .box-color p{
	margin:10px auto;
	padding:0px 20px;
	text-align:left;
	
}

#wrapper .box-color .line{

text-decoration:underline;
}

/*テキスト見出し*/
div.text-title {
	padding:30px 0;
	background-color:#C00;
	display:block;
	margin:30px auto;
}
div.text-title h3 {
	color:#FFF;
	font-size:1.7em;
}
 @media screen and (max-width: 600px) {
div.text-title h3 {
	font-size:1.2em;
	line-height:1.5em;
}
}
/*ここまで*/
#wrapper .box-color dl.list, #wrapper .box-color dl.tokuten {
	text-align:left;
	list-style:none;
	margin:20px 20px 10px 20px;
	clear:both;
}
#wrapper .box-color dl.tokuten dt {
	text-align:left;
	clear:both;
	color:#F00;
	line-height:1.5em;
	font-size:20px;
	font-weight:bold;
	margin:0 0 10px 0;
	padding:10px 0 0 0;
}


 @media screen and (max-width: 600px) {
#wrapper .box-color dl.tokuten dt ,
dl.list-text {
	font-size:1.2em;
	line-height:1.5em;
}
}
#wrapper .box-color dl.tokuten dd {
	text-align:left;
	padding:0px 0 10px 0;
	margin:0 0 1em 10px;
	list-style:none;
	clear:both;
}
 @media screen and (max-width: 600px) {
#wrapper .box-color dl.tokuten dd {
	line-height:1.6em;
}
}
#wrapper .box-color dl.tokuten dt img {
	float:left;
	display:block;
	width:174px;
	border:none;
	margin:-10px 0 10px 0;
	padding:0;
}
#wrapper .box-color dl.tokuten ul {
	text-align:left;
	padding:0 0 0 0;
	margin:0 0 20px 20px;
	list-style:none;
	font-weight:100;
}
#wrapper .box-color dl.tokuten ul li {
	background:url(../img/check.gif) 0 0 no-repeat;
	line-height:40px;
	padding:0 0 0 25px;
	margin:0;
}


#wrapper .box-color dl.list dt{
	text-align:left;
	background:url(../img/point2.gif) 0 8px no-repeat;
	padding:0 0 0 20px;
	margin:5px 0 15px 10px;
	list-style:none;
	font-weight:bold;
	font-size:24px;
}
#wrapper .box-color dl.list dt.none {
	color:#009;
	background-color:none;
	background-image:none;
	margin:0 0 20px 0;
	padding:0;
}
#wrapper .box-color dl.list dt.none img {
	border:none;
	margin:0;
	padding:0;
}
#wrapper .box-color dl.list dd{
	position: relative;
	margin:0px 0 0px 30px;
}


#wrapper .box-color dl.list dd::after, #wrapper .box-color dl.list dd::before {
	display: block;
	content: '';
	position: absolute;
}
#wrapper .box-color dl.list dd::after {
	top: .8em;
	left: -1.2em;
	width: 14px;
	height: 14px;
	background-color: #3498db;
	border-radius: 100%;
}
#wrapper .box-color dl.list dd::before {
	z-index: 2;
	top: 1.05em;
	left: -.975em;
	width: 4px;
	height: 4px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#wrapper .box-color dl.list dd.redbold {
	font-size:20px;
	text-align:left;
	padding:0 0 0 0;
	margin:0 0 10px 10px;
	list-style:none;
	font-weight:bold;
	color:#F00;
}
#wrapper .box-color ul {
	text-align:left;
	padding:0 0 0 0;
	margin:0 0 20px 30px;
	list-style:none;
	font-weight:100;
}
#wrapper .box-color ul li{
	background:url(../img/point1.gif) 0 center no-repeat;
	font-weight:bold;
	line-height:40px;
	padding:0 0 0 25px;
}
#wrapper .box-color ul li span.y-line{
background: linear-gradient(transparent 50%, yellow 50%);
}


#wrapper div.text img.right-img {
	float:right;
}
#wrapper ul.riyu {
	margin:0px 0 20px 0;
}
#wrapper ul.riyu li {
	text-align:left;
	list-style:none;
	line-height:1.4em;
	padding: 0.25em 0.5em;/*上下 左右の余白*/
	color:#F00;/*文字色*/
	background: transparent;/*背景透明に*/
	border-left: solid 5px #7db4e6;/*左線*/
	font-weight:bold;
	margin:20px 0 20px 20px;
}
#wrapper ol.line {
	background-color:#999;
	background: linear-gradient(#FFF, #ecffb9);
	border:double 5px #F00;
	margin:10px auto;
	width:90%;
	counter-reset: item;
	list-style-type: none;
	padding-left: 0;
}
#wrapper ol.line li {
	font-weight:bold;
	line-height:1.5em;
	text-align:left;
	margin:10px 30px;
	text-indent: -1.3em;
	padding-left: 1.3em;
}
#wrapper ol.line li:before {
	counter-increment: item;
	content: counter(item)'.';
	/* 以下は自由に装飾... */
  padding-right: .5em;
	font-weight: bold;
	color: #b40000;
}
/*特典*/
#wrapper ul.tokuten {
	width:676px;
	height:160px;
	background:url(../img/sedori-bg.gif) no-repeat;
	margin:0 auto 0 50px;
	padding:10px 0 0 0;
	text-align:center;
	list-style:none;
	font-weight:bold;
}
#wrapper ul.tokuten li {
	font-size:16px;
	color:#000;
	line-height:28px;
	text-align:left;
	background:url(../img/step-pink.gif) left 5px no-repeat;
	padding:0 0 0 30px;
	margin:8px 0 10px 30px;
}
#wrapper ul.tokuten02 {
	width:676px;
	height:100px;
	background:url(../img/sedori-bg02.gif) no-repeat;
	margin:0 auto 0 50px;
	padding:15px 0 0 0;
	text-align:center;
	list-style:none;
	font-weight:bold;
}
#wrapper ul.tokuten02 li {
	font-size:16px;
	color:#000;
	line-height:28px;
	text-align:left;
	background:url(../img/step-pink.gif) left 5px no-repeat;
	padding:0 0 0 30px;
	margin:8px 0 10px 30px;
}
#wrapper div.text ul.check, #wrapper dl.check {
	text-align:left;
	list-style:none;
	font-weight:bold;
}
#wrapper div.text ul.check li, #wrapper dl.check dd {
	text-align:left;
	color:#0066ff;
	padding:0px 0 0 8px;
	margin:5px 20px;
border-left:5px solid #7ED1E6;

}
#wrapper div.text ul.check li span {
	color:#06C;
}
#wrapper div.text ol.no {
	text-align:left;
	font-weight:bold;
	margin:0;
	padding:0;
}
#wrapper div.text ol.no li {
	text-align:left;
	color:#FF0000;
	padding:5px 0 0 0px;
	margin:0 0 0 70px;
}
/*商品画像*/
#wrapper div.text img.item {
	
	margin:10px auto 20;
	display: inline-block;
box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.8);
}
/*商品画像*/
#wrapper div.text img.other {
	border:none;
	text-align:center;
	margin:20px auto;
}
#wrapper div.text img.right {
	float:right;
	width:260px;
}
/*物語 追伸*/

#wrapper div.text .story-box h3 {
	color:#C03;
	text-align:left;
	margin:20px 20px;
}
#wrapper div.text .story-box {
	background:#fefdf9;
	box-shadow: 0px 0px 10px #e7e4d3 inset;
	width:90%;
	overflow:hidden;
	margin:40px auto;
	padding:20px 0;
	clear:both;
}
#wrapper div.text .story-box p {
	width:90%;
	margin:0 auto;
	padding:0;
	text-align:left;
	line-height:32px;
	clear:both;
}
#wrapper .story-box p img.center {
	margin:0 0 0 40px;
	text-align:center;
}
#wrapper .story-box ul {
	text-align:left;
	list-style:none;
	margin:10px 0;
}
#wrapper .story-box ul li {
	text-align:left;
	background:url(../img/step-green.gif) left no-repeat;
	padding:0 0 0 30px;
	margin:5px 0 0 50px;
}
/*フッター*/
#footer {
	width:100%;
	margin-top:50px;
	background:#031dd9;
	font-size:12px;
	padding:5px 0 10 0;
}
#footer p {
	margin:0;
	padding:5px 0;
	color:#fff;
	line-height:14px;
}
#footer p a {
	margin:0 20px 0 0;
	padding:5px 0;
	color:#fff;
}
/*見出し*/

#wrapper h3 {
	margin:0 auto;
	text-align:center;
	padding:0;
}
#wrapper h3.tit {
	margin:00px 0 30px 0;
	padding:0;
}
#wrapper h4 {
	margin:40px 0 20px 0;
	text-align:center;
	padding:0;
}
#wrapper h4.sub {
	margin:20px 0 20px 0;
	text-align:center;
	padding:0;
}
/*申し込み*/

#wrapper .buy-box {
	width:800px;
	margin:20px auto 20px auto;
	padding:10px 0 0px 0;
	text-align:center;
	border:solid 3px #FFCC00;
	border-radius: 10px;        /* CSS3草案 */
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 10px;   /* Firefox用 */
}
img.form {
	margin:5px auto;
}
img.btn-btm {
	margin:20px auto 20px auto;
}
#wrapper .buy-box p {
	margin:10px auto 10px auto;
	text-align:center;
	font-size:12px;
	line-height:18px;
}
#wrapper .buy-box ul {
	text-align:left;
	width:700px;
	margin:10px auto 40px;
	list-style:none;
}
#wrapper .buy-box li {
	text-align:left;
	line-height:26px;
	margin:10px 30px 10px;
}
#wrapper .buy-box .g-tokuten {
	width:500px;
	padding:5px 0;
	border-bottom:#CF0 solid 3px;
	border-top:#CF0 solid 3px;
	margin:0px auto 20px auto;
	text-align:center;
}
#wrapper .buy-box .g-tokuten dl {
	margin:10px 0;
}
#wrapper .buy-box .g-tokuten dl dt {
	text-align:left;
	font-weight:bold;
	color:#F00;
	margin:0 0 0 20px;
}
#wrapper .buy-box .g-tokuten dl dd {
	text-align:left;
	margin:0 0 0 30px;
}
/*使ってみた*/
#wrapper .box700r {
	text-align:center;
	margin:10px auto;
	border:solid 3px #b6bdf4;
	width:95%;
	overflow:hidden;
	margin:0px auto 20px auto;
	padding:20px 0;
	clear:both;
	border-radius: 10px;        /* CSS3草案 */
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 10px;   /* Firefox用 */
	
	  background: -moz-linear-gradient(top, #F0F0FF, #FFF);
  background: -webkit-linear-gradient(top, #F0F0FF, #FFF);
  background: linear-gradient(to bottom, #F0F0FF, #FFF);
}
#wrapper .box700r p {

	text-align:left;
	margin:0 auto;
	width:90%;
	padding:0px 0 20px;
	line-height:3em;

}
 @media screen and (min-width:300px) {
#wrapper .box700r p {
line-height:2em;
}
}
#wrapper .box700r p img {
	vertical-align:bottom;

}
#wrapper .box700r p.left {
	text-align:left;
	font-size:1.2em;
	line-height:1.2em;
	font-weight:bold;
	color:#00F;
	margin:0 20px 30px 20px;
	border-bottom:dotted #b6bdf4 1px;
	padding:0 10px;
}
#wrapper .box700r p.left span{
	font-weight:100;
	font-size:0.8em;
	padding-left:20px;}
#wrapper .box700r p.imgcenter {
	margin:10px auto;
	text-align:center;
}
#wrapper .box700r p.imgcenter img {
	border:solid 1px;
	width:80%;
}
/*リスト*/

#wrapper dl.fanda {
	text-align:left;
	list-style:none;
	font-weight:bold;
	line-height:25px;
	padding:0 0 0 10px;
	margin:10px 20px;
}
#wrapper dl.fanda dt {
	color:#009;
	text-align:left;
	border-left:7px #C03 solid;
		padding:5px 0 0 5px;
	font-size:1.3em;
	margin:15px 0 10px 0px;
}
#wrapper dl.fanda dd {
	text-align:left;
	line-height:2em;
	font-weight:100;
	padding:0 0 0 5px;
	margin:0 0 30px 20px;
}

/*目立たせる*/
#wrapper h4.midasi {
position: relative;
padding: .75em .5em;
border: 1px solid #0066ff;
}
h4.midasi:after{
content: "入会特典";
position: absolute;
top: -1em;
left: 10px;
background: #fff;
font-size: 1em;
color: #0066ff;
padding: 0 10px;
}
#wrapper h4.bold{
	text-align:left;
	border-bottom:#CCC solid 1px;	
	padding:0 ;
	color:#06F;
	margin:20px 0 0px 10px;
	list-style:none;
	font-weight:bold;
	font-size:24px;
	
	
	}
	
/*Ｑ&Ａ*/
.qaContainer dl{
	text-align:left;}
.qaContainer dt {
padding: 10px 10px 10px 35px;
border-radius: 5px;
background: #cce6ff;
text-indent: -25px;
}
.qaContainer dt:before {
content: "Q.";
font-weight: bold;
margin-right: 7px;
}
.qaContainer dd {
margin: 20px 10px 40px 35px;
text-indent: -25px;
}

.qaContainer dl dt span{
	background:#FFF;
	font-size:0.8em;
	margin-right:10px;
	padding:5px;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}
.qaContainer dl dd span{
	background:#FC3;
	font-size:0.8em;
	margin-right:10px;
	padding:5px;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}
.qaContainer dd:before {
content: "A.";
color: #1771c6;
font-weight: bold;
margin-right: 7px;
}
/*動画一覧*/

#wrapper div.repo-box {
	width:92%;
	background:url(../img/color-box-bg.jpg) repeat-x #feffef;
	margin:10px auto 10px auto;
	text-align:center;
	padding:0 0;
	padding-bottom:10px;
	overflow:hidden;
	border: solid 1px #FF9933;
	border-radius: 10px;        /* CSS3草案 */
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 10px;   /* Firefox用 */
}
#wrapper div.repo-box h4 {
	background:#FFFFFF;
	color:#EC0000;
	font-weight:bold;
	margin:30px auto;
	text-align:center;
	font-size:2em;
	line-height:1.8em;
	border-top:#FF9900 solid 1px;
	border-bottom:#FF9900 solid 1px;
}

#wrapper div.repo-box p{
	padding:10px 0 0 15px;
}


#wrapper div.repo-box ul.repo {
	text-align:center;
	margin:0 auto;
	width:95%;

	list-style-type:none;

}
#wrapper div.repo-box ul.repo li{
	background-image:none;
	margin:0 auto;
	font-weight:bold;
	line-height:2.em;
	text-align:left;
position:relative;
	padding: 0em 0.3em 0.3em 1em;
	width:98%;

}


#wrapper div.repo-box ul.repo li:after, ul.repo li:before {
position:absolute;
	content:'';
	display:block;
	background: #FFC107;
	top: 0.8em;
	left: 0.3em;
	height: 13px;
	width: 4px;
	border-radius: 10px;
	transform: rotate(45deg);
}
#wrapper div.repo-box ul.repo li:before {
	top: 1em;
	left: 0em;
	height:8px;
	transform:rotate(-45deg);
}


/*汎用*/

 p.center24 {
	margin:10px auto;
	font-size:24px;
	color:#ff0000;
}
div.text p.name {
	color:#72001a;
	font-weight:bold;
	margin:0px;
	padding:0;
	font-size:16px;
	text-align:right;
	float:right;
}
img.photo150 {
	width:150px;
	float:left;
	margin:0 10px 10px 10px;
	vertical-align:top;
}
img.photo200 {
	width:200px;
	float:right;
	margin:0 10px 10px 10px;
	vertical-align:top;
}
strong.big {
	font-size:24px;
	font-weight:bold;
	border-bottom:solid 1px #FF0000;
}
strong.line {
	border-bottom:solid 1px #FF0000;
}
.red {
	color:#ff0000;
	font-weight:bold;
}
b {
	color:#0066ff;
	font-weight:bold;
}
b.font20 {
	font-size:20px;
	color:#0066ff;
	font-weight:bold;
}
.font20r {
	font-size:20px;
	color:#ff0000;
	font-weight:bold;
}
.font20black {
	font-size:20px;
	font-weight:bold;
}
.font24 {
	font-size:24px;
	border-bottom:solid 5px #9F0;
	color:#ff0000;
	font-weight:bold;
	background-color:#FFC;
}
em {
	background-color:#FFFF33;
	font-style:normal;
	padding:2px 0;
	font-weight:bold;
}
em.red {
	color:#ff0000;
}
em.font20 {
	font-size:20px;
	color:#ff0033;
	font-style:normal;
	padding:2px 0;
	font-weight:bold;
	background:#FFC;
}
em.font24 {
	font-size:24px;
	color:#ff0033;
 background::#FFFF33;
	font-style:normal;
	padding:2px 0;
	font-weight:bold;
}
img.btmimg {
	margin:0 0 40px 0;
	padding:0;
	background:top;
	clear:both;
}
p img.photo {
	float:right;
	width:150px;
	margin:0 10px 0 10px;
}
p img.photo100 {
	vertical-align:top;
	float:left;
	width:100px;
	margin:0 10px 0 10px;
}
p.name {
	width:200px;
	float:right;
	text-align:right;
}
#wrapper div.text p.center24red {
	font-size:24px;
	margin:10px auto 20px auto;
	text-align:center;
	font-size:24px;
	color:#ff0033;
	font-weight:bold;
}
/*汎用*/
.center{
	margin:0 auto;
	text-align:center;}
.voice-btm {
	vertical-align:bottom;
	margin:0 auto 0 auto;
}
.btm30 {
	margin:0 0 30px 0;
}
.btm10 {
	margin-bottom:10px;
}

img.lineimg {
	border:solid 1px #666;
	margin:10px auto 30px;
}
/*申し込みボタン*/
#wrapper div.text img.mousikomi {
	max-width:400px;
}
/*フォーム*/
#content_form h2{
	font-size:2em;
	color:#fff;
	padding:20px 0;
	margin:40px auto 0;
	background:#06F;
	 border-top-left-radius: 10px;
  border-top-right-radius: 20px;}


div.f-box{
border:solid #C00 2px;
	padding-bottom:10px;
	 border-bottom-left-radius: 10px;
  border-bottom-right-radius: 20px;
  margin:0 auto;
  text-align:center;
	
	}
form ul{
	margin:30px 0;
	text-align:left;
	width:100%;
	list-style:none;}
form ul li{}	
form p{
	text-align:center;
	margin:10px auto;
	font-weight:bold;}
.form_input_label{
	color:#000;
	text-align:left;
		
		margin:0 auto;}
div.right_block02 
{
    width:70%;    word-break: break-all;
    display: inline-block;
}
form .redform{
	background-color:#C00;
	font-weight:bold;
	color:#FFF;
	width:100%;}
form .redform span{
	font-size:1.2em;
	color:#FFF;
}


form .form_input_label{
	width:18%;
	color:#FFF;
	padding:3px;
	margin-bottom:5px;}
 @media screen and (max-width: 600px) {
	form .form_input_label{
		font-size:1em;
	padding:2px;
	width:100%;} 
	
	
	#content_form h2{
	font-size:1em;
	margin:10px auto 0;
	padding:10px 0} 
input{	padding:2px;	 
	 }
	 form .form_input_input{
	margin-bottom:5px;

	}
	 	
	 }

	
	
form .bg-color{
		margin:1px;
		background:#39F;
		padding:0 5px;}
		
input#submit_button{
    padding: 15px 40px;
    font-size: 1.2em;


}
div.f-text{
	text-align:center;
	margin:10px auto;
	width:85%;

	
	}	
	div.f-text p{
	text-align:center;
	margin:10px auto;
	color:#009;
	
	}			
div.f-text p span{
	text-align:center;
	margin:10px auto;
	color:#009;
	
	}	
	
