@charset "utf-8";

/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
/*@media screen and (min-width: 769px){
img{
max-width: 100%;
height: auto;
width /***//*:auto;　
}
#container{
width:100%;
}
*/

/*****************************************/
/*** HTMLデフォルトのスタイルをリセット ***/
/*****************************************/
* {
	margin: 0;
	padding: 0;
	font-weight: normal;
}
html {
	height: 100%;
}
/* Border
---------------------------------------------------------*/
img, a img, fieldset, abbr {
	border: 0 none;
}
img {
	vertical-align:top;
}
hr {
	clear: both;
	display: none;
	border: none;
}
/* Text
---------------------------------------------------------*/
strong, b, em {
	font-weight: bold;
}
/* List
---------------------------------------------------------*/
ul, ol {
	list-style-type: none;
}
/* Form
---------------------------------------------------------*/
legend {
	visibility: hidden;
}
/* Header
---------------------------------------------------------*/
#header{
	position:relative;
	width:800px;
	height:100%;
	background-size:800px;
}
#header-txt{
	position:absolute;
	top:20px;
	left:20px;
}
#header-txt p{
	font-size:15px;
}
h1{
	font-size:15px;
	text-align:left;
	/* color:#fff;
	background:#222;
	padding:0px 30px; */
}

/* Table
---------------------------------------------------------*/
table {
	border-collapse: collapse;
}
caption {
	text-align: left;
}

/*****************************************/
/*** 初期設定 ***/
/*****************************************/

/* ページ全体の背景と背景色
---------------------------------------------------------*/
#body {
	margin:0 auto;
	background-color:#fff;
}

/* デザインエリアの幅と位置
---------------------------------------------------------*/
#container{
	width:800px;
	margin: 0 auto;
	background:#fff;
}


/*****オファー*****/
.offer{
	width:800px;
	background:url(../img/vclp-img8.jpg)repeat-y;
	background-size:800px;
}
.teiki-btn{
	width:800px;
	text-align:center;
}

.comment p{
	width:580px;
	margin: 20px auto;
}

/*****返金保証*****/
.henkin1{
	position:relative;
	width:800px;
	height:545px;
	background:url(../img/vclp-henkin.jpg)no-repeat;
	background-size:800px;

}
.henkin1 p{
	position:absolute;
	top:168px;
	left:80px;
	font-size:20px;
	width:627px;
	margin: 26px auto;
}

/*****ビタミンC誘導体とは*****/
.about-vc{
	width:800px;
	background:url(../img/vclp-img18.jpg)repeat-y;
	background-size:800px;
}

#vc-title{
	font-size:34px;
	text-align:center;
	padding:20px 0;
}
.vc-txt{
	font-size:21px;
	width:525px;
	margin:0 auto;
	padding:20px 0;
}

/*****新型ビタミンC誘導体GO-VCって何？*****/
#about-govc{
	position:relative;
	width:800px;
	height:260px;
	background:url(../img/vclp-img22.jpg)no-repeat;
	background-size:800px;
}
#about-govc2{
	position:relative;
	width:800px;
	height:228px;
	background:url(../img/vclp-img23.jpg)no-repeat;
	background-size:800px;
}
#about-govc3{
	position:relative;
	width:800px;
	height:592px;
	background:url(../img/vclp-img24.jpg)no-repeat;
	background-size:800px;
}
.govc-txt{
	position:absolute;
	top:30px;
	left:280px;
	font-size:22px;
	line-height:34px;
	width:434px;
}

/*****持続型ビタミンC誘導体VC-IPって何？*****/
#about-vcip{
	position:relative;
	width:800px;
	height:420px;
	background:url(../img/vclp-img27.jpg)no-repeat;
	background-size:800px;
}
#about-vcip2{
	position:relative;
	width:800px;
	height:495px;
	background:url(../img/vclp-img28.jpg)no-repeat;
	background-size:800px;
}
.vcip-txt{
	position: absolute;
    top: 30px;
    right: 300px;
    font-size: 22px;
    line-height: 34px;
    width: 400px;
}

/*****さらにビタミンB（ナイアシンアミド）配合*****/
#about-vb{
	width:800px;
	height:601px;
	background:url(../img/vclp-img31.jpg)no-repeat;
	background-size:800px;
}
.vb-txt{
	font-size:21px;
	line-height:33px;
	font-size:23px;
	width:610px;
	padding:10px 70px;
}


/*****2回目のオファー*****/
.offer2{
	width:800px;
	background:url(../img/vclp-img42.jpg)repeat-y;
	background-size:800px;
}
.teiki-btn2{
	width:800px;
	text-align:center;
}
.teiki-btn2 a:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
.comment p{
	width:580px;
	margin: 20px auto;
}

/*****返金保証*****/
.henkin2{
	position:relative;
	width:800px;
	height:556px;
	background:url(../img/vclp-henkin2.jpg)no-repeat;
	background-size:800px;

}
.henkin2 p{
	position:absolute;
	top:168px;
	left:80px;
	width:627px;
	margin: 26px auto;
}

/*****C-マックスローションについて詳しく見る*****/
.cmax-link{
	width:800px;
	height:100px;
	padding-top:20px;
	text-align:center;
	background:#ace8ea;
}
.cmax-link a{
	text-align:center;
}

/*****C-マックスローションとVCセラム両方使うと計4種類のビタミンでケアできる！*****/
#vitamin-list{
	position:relative;
	width:750px;
	height:585px;
	background:url(../img/vclp-img60.jpg)no-repeat;
}
#vitamin-list ul{
	position:absolute;
	top:55px;
    left:450px;
}
#vitamin-list li{
	margin-top:30px;
	font-size:23px;
	font-weight:500;
}

/*****ビタミントリートメントコース　オファー*****/
#vt-offer{
	width:750px;
	background:url(../img/vclp-img8.jpg)repeat-y;
	background-size:800px;
}


/*****EXの説明*****/
#about-ex{
	width:750px;
	height:730px;
	background:url(../img/vclp-img71.jpg)no-repeat;
	background-size:800px;
}
#about-ex p{
	width:580px;
	margin:0px auto;
	padding-top:80px;
	font-size:23px;
}


/*****EXについて詳しく見る*****/
.ex-link{
	width:750px;
	height:100px;
	padding-top:40px;
	text-align:center;
	background:#ace8ea;
}
.ex-link a{
	text-align:center;
}


/*****通常価格で購入*****/
.usual{
	text-align: center;	
	padding-top: 30px;
	padding-bottom: 50px;
}
.usual  a:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}




/* フッター
---------------------------------------------------------*/
#link {
	width:680px;
	margin:auto;
	text-align:center;
	padding:30px;
}
#link li {
	padding-right:4px;
}
#link a {
	font-size:13px;
	text-align:center;
	color:#333b3a;
}

#footer {
	width:800px;
	padding:30px 0px;
	margin:auto;
	background:#59aca6;
	color:#ffffff;
}
#footer p {
	margin:auto;  
	font-size:13px;
	text-align:center;
	color:#ffffff;
}



/* ベースフォントサイズ
---------------------------------------------------------*/
body, input, textarea, select, option, table, th, td, p, div, small, big {
	font-size:20px;
	line-height:30px;
	color:#333b3a;
	/* font-family: "KozGoPro", "小塚ゴシック Pro", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif; */
	font-family: "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
	font-weight:500;
	}

/* アンカーテキスト
---------------------------------------------------------*/
a {
	cursor: pointer;
	text-decoration: none;
}
/* a:hover{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}
a:link {
	color: #0000cd;
}
a:visited {
	color: #0000cd;
}
a:active {
	color: #ffd700;
} */

/*****************************************/
/*** 基本汎用クラス ***/
/*****************************************/

/* Display
---------------------------------------------------------*/
.hidden {
	visibility: hidden;
	display: none;
}

/* Float
---------------------------------------------------------*/
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}
.fl {float:left;}
.fr {float:right;}

/* Text
---------------------------------------------------------*/
.alignright {text-align: right;}
.alignleft {text-align: left;}
.aligncenter {
	margin: auto;
	padding: auto;
	text-align: center;
}
.small {font-size: 75%;}
.smaller {font-size: 60%;}
.large {font-size: 140%;}
.larger {font-size: 200%;}
.largest {font-size: 240%;}
.strong {
	color: #900;
	font-weight: bold;
}
.red {color:red;}

/* padding
---------------------------------------------------------*/
.p10 {padding:10px;}
.p20 {padding:20px;}
.p30 {padding:30px;}
.p40 {padding:40px;}
.p50 {padding:50px;}
.p50 {padding:60px;}

.pl10 {padding-left:10px;}
.pl20 {padding-left:20px;}
.pl30 {padding-left:30px;}
.pl40 {padding-left:40px;}
.pl50 {padding-left:50px;}
.pl60 {padding-left:60px;}

.pr10 {padding-right:10px;}
.pr20 {padding-right:20px;}
.pr30 {padding-right:30px;}
.pr40 {padding-right:40px;}
.pr50 {padding-right:50px;}
.pr50 {padding-right:60px;}

.pt10 {padding-top:10px;}
.pt20 {padding-top:20px;}
.pt30 {padding-top:30px;}
.pt40 {padding-top:40px;}
.pt50 {padding-top:50px;}
.pt50 {padding-top:60px;}

.pb10 {padding-bottom:10px;}
.pb20 {padding-bottom:20px;}
.pb30 {padding-bottom:30px;}
.pb40 {padding-bottom:40px;}
.pb50 {padding-bottom:50px;}
.pb60 {padding-bottom:60px;}

.plr50 {padding-left:50px; padding-right:50px;}
.plr60 {padding-left:60px; padding-right:60px;}
.plr70 {padding-left:70px; padding-right:70px;}
.plr80 {padding-left:80px; padding-right:80px;}

/* margin
---------------------------------------------------------*/
.m10 {margin:10px;}
.m20 {margin:20px;}
.m30 {margin:30px;}
.m40 {margin:40px;}
.m50 {margin:50px;}

.ml10 {margin-left:10px;}
.ml20 {margin-left:20px;}
.ml30 {margin-left:30px;}
.ml40 {margin-left:40px;}
.ml50 {margin-left:50px;}
.ml60 {margin-left:60px;}

.mr10 {margin-right:10px;}
.mr20 {margin-right:20px;}
.mr30 {margin-right:30px;}
.mr40 {margin-right:40px;}
.mr50 {margin-right:50px;}

.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}

.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
}