@charset "utf-8";
/* ランディングページ CSS Document */

html.LC_Page_Landing body,
html.LC_Page_Landing_LpContact body,
html.LC_Page_Landing_LpComplete body {
	margin:0;
    color: #555;
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 72.5%;
    line-height: 150%;
    letter-spacing: 0.1em;
    background: #fff;
}
html.LC_Page_Landing_LpContact body,
html.LC_Page_Landing_LpComplete body {
	background:none;
}

/* フォント
----------------------------------------------- */
.lp_container h1,
.lp_container h2,
.lp_container h3,
.lp_container h4,
.lp_container h5 {
    font-size: 100%;
    line-height: 150%;
}
.lp_container .point {
    color: #f00;
    font-weight: bold;
}
.lp_container .user_name {
    font-weight: bold;
}
.lp_container .recommend_level {
    color: #ecbd00;
}

.lp_container .attention {
    color: #f00;
}
.lp_container .attentionSt {
    color: #f00;
    font-weight: bold;
}
.lp_container .st {
    font-weight: bold;
}
.lp_container .mini {
    font-size: 90%;
}

/* 行揃え
----------------------------------------------- */
.lp_container .alignC {
    text-align: center;
}
.lp_container .alignR {
    text-align: right;
}
.lp_container .alignL {
    text-align: left;
}
.lp_container .pricetd em {
    font-weight: bold;
}


/* ==============================================
 フレーム
=============================================== */
/* 全体を包括 */
.lp_frame_outer {
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

/* 共通
----------------------------------------------- */

/* リンク設定 */
.lp_frame_outer a:link,
.lp_frame_outer a:visited {
    color: #39c;
    text-decoration: none;
}
.lp_frame_outer a:link:hover,
.lp_frame_outer a[href]:hover {
    color: #f60;
}
/*リンク画像オンマウスで透過*/
.lp_frame_outer a img:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

.lp_frame_outer h1,
.lp_frame_outer h2,
.lp_frame_outer h3,
.lp_frame_outer h4,
.lp_frame_outer h5 {
    font-size: 100%;
    line-height: 150%;
}
.lp_frame_outer .attention {
    color: #f00;
}
.lp_frame_outer .attentionSt {
    color: #f00;
    font-weight: bold;
}
.lp_frame_outer .st {
    font-weight: bold;
}
.lp_frame_outer .mini {
    font-size: 90%;
}
.clearfix:after {
    display: block;
    clear: both;
    height: 0px;
    line-height: 0px;
    visibility: hidden;
    content: ".";
}
.clearfix {
    display: block; /* for IE8 */
}
.clear {
    clear: both;
}

/* ヘッダー
----------------------------------------------- */
.lp_header_wrap {
	width:100%;
    border-top: solid 3px #ccc;
    background: url("../img/common/bg_header.gif") repeat-x bottom #f7f7f7;
	/*▼ヘッダー部の高さ*/
	min-height:100px;
}
.lp_header {
    margin: 0 auto;
    text-align: left;
	position:relative;
}
.lp_header #site_description {
	display:none;
}
.lp_header #logo_area {
    width: 100%;
	margin-top:10px;
	margin-bottom:10px;
	text-align:center;
}
.lp_header #lp_header_utility {
    width: 100%;
	margin-bottom:10px;
	text-align:center;
}
.lp_header #logo_area img,
.lp_header #lp_header_utility img {
	max-width:90%;
}

/* タブレット向けのスタイル：460px～ */
@media only screen and (min-width: 460px) {
.lp_header {
	padding:0 15px;
}
.lp_header #site_description {
	display:block;
	margin-bottom:10px;
}
.lp_header #logo_area {
    float: left;
    width: 60%;
	margin-top:0;
	padding-bottom:10px;
	text-align:left;
}
.lp_header #lp_header_utility {
    float: right;
    width: 38%;
	text-align:right;
}
.lp_header #logo_area img,
.lp_header #lp_header_utility img {
	max-width:100%;
}
/*ロゴの位置*/
.lp_header #logo_area img {
	position:relative;
	top:10px;
	left:0;
}
/*活用エリアの画像の位置*/
.lp_header #lp_header_utility img {
	position:relative;
	top:0;
	left:0;
}
}

/*  PC向けのスタイル：980px～ */
@media only screen and (min-width: 980px) {
.lp_header {
    width: 950px;
}
}

/* コンテンツ
----------------------------------------------- */
/* **************
.lp_frame_on：独立したフレーム（ヘッダー・フッター）を使用した時
.lp_frame_off：サイト内に表示した時
.lp_container：両方に共通
************** */

.lp_frame_on {
    margin: 0 auto;
    padding: 10px 1.5% 20px 1.5%;
    width: 97%;
    background: #fff;
    text-align: left;
}
.lp_frame_off {
    margin: 0 auto;
    width: 100%;
    background: #fff;
    text-align: left;
}
.lp_container .cotent img {
	max-width:100%;
}

/* タブレット向けのスタイル：460px～ */
@media only screen and (min-width: 460px) {
.lp_frame_on {
    padding: 10px 1% 20px 1%;
    width: 98%;
}
}
/*  PC向けのスタイル：980px～ */
@media only screen and (min-width: 980px) {
.lp_frame_on {
    width: 950px;
	padding:10px 15px 20px 15px;
}
}

/* YouTube */
.lp_container .youtube {
	margin-bottom:40px;
	clear:both;
}
.lp_container .youtube .embed-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	width: 100%;
	margin-bottom:10px;
}
.lp_container .youtube .embed-container iframe,
.lp_container .youtube .embed-container object,
.lp_container .youtube .embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* 商品エリア
----------------------------------------------- */
.lp_container #product_area {
	margin-bottom:40px;
	clear:both;
}
.lp_container #product_area #lp_product_title {
	font-size:140%;
	text-align:center;
	padding:10px;
	margin-bottom:15px;
	background:#f5f5f5;
	margin-top:20px;
}
.lp_container #product_area .product_box1,
.lp_container #product_area .product_box2,
.lp_container #product_area .product_box3,
.lp_container #product_area .product_box4,
.lp_container #product_area .product_box5 {
	width:98%;
	float:none;
	padding:1%;
	margin-bottom:10px;
	border-bottom:#CCC 1px solid;
}
.lp_container #product_area .left,
.lp_container #product_area .right {
	width:100%;
	float:none;
}
.lp_container #product_area .left {
	text-align:center;
}
.lp_container #product_area .main_image {
	text-align:center;
}
.lp_container #product_area .main_image img {
	max-width:100%;
}
.lp_container #product_area .text h3 {
	font-size:120%;
	padding-bottom:5px;;
	margin-bottom:10px;
}
.lp_container #product_area .text h3.line {
	border-bottom: #999 1px dotted;
}
.lp_container #product_area .text .main_list_comment {
	margin-bottom:10px;
}
.lp_container #product_area .text .pricebox {
	margin-bottom:10px;
}
.lp_container #product_area .text .pricebox .number {
	font-size:140%;
	color:#333;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
}
.lp_container #product_area .text .pricebox .yen {
	font-size:110%;
	color:#333;
}

/*買い物カゴ*/
.lp_container .lp_cart_btn_area {
	padding:10px;
	background:#f5f5f5;
	text-align:center;
}
.lp_container #product_area dl.classcate {
	margin-bottom:10px;
}
.lp_container #product_area dl span {
	display:block;
	text-align:left;
}
.lp_container #product_area dl select {
	width:100%;
}
.lp_container #product_area .suryo {
	font-size:110%;
}
.lp_container #product_area .suryo span {
	font-size:110%;
}
.lp_container #product_area .zogen a {
	color:#000;
	text-decoration:none;
	line-height:240%;
	padding:1px 4px;
	margin:0 1px;
	background:#FFF;
	border: 1px solid #666;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
.lp_container #product_area .zogen a:hover {
	background:#ddd;
}

/*カートボタン*/
.lp_container #product_area .btn_detail a {
	display:block;
	padding:5px 0;
	border: 1px solid #999;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size:100%;
	color:#333;
	background: #fff;
	margin:0 auto;
	text-align:center;
	/*▼スマホ横幅100%*/
	width:100%;
}
.lp_container #product_area .btn_detail {
	margin:20px 0;
}
.lp_container #product_area .btn_detail a:hover {
	background-color:#ddd;
}

/* タブレット向けのスタイル：460px～ */
@media only screen and (min-width: 460px) {
	
/* 規格・選択ボックス */
.lp_container #product_area dl span {
	display: inline;
}
.lp_container #product_area dl select {
	width: auto;
}

/* ---------- 1列 ---------- 
   レイアウトとボタンの幅 
   -------------------------*/
.lp_container #product_area .product_box1 {
	border-bottom:none;
	width:98%;
	float:none;
	border:#CCC 1px solid;
	padding:1%;
	margin-bottom:10px;
}
.lp_container #product_area .product_box1 .left {
	width:28%;
	float: left;
	text-align:left;
}
.lp_container #product_area .product_box1 .right {
	width:70%;
	float: right;
}
/*カートボタン*/
.lp_container #product_area .product_box1 .btn_detail a {
	/*▼1列時の横幅50%*/
	width:50%;
}

/* ---------- 2列 ---------- 
   レイアウトとボタンの幅 
   -------------------------*/
.lp_container #product_area .product_box2 {
	border-bottom:none;
	width:46.5%;
	float:left;
	padding:1%;
	margin-bottom:10px;
	margin-right:2%
}
.lp_container #product_area .product_box2 .left {
	width:38%;
	float: left;
	text-align:left;
}
.lp_container #product_area .product_box2 .right {
	width:60%;
	float: right;
}
/*カートボタン*/
.lp_container #product_area .product_box2 .btn_detail a {
	/*▼1列時の横幅50%*/
	width:50%;
}

/* ---------- 3列 ---------- 
   レイアウトとボタンの幅 
   -------------------------*/
.lp_container #product_area .product_box3 {
	border-bottom:none;
	width:30%;
	float:left;
	padding:1%;
	margin-bottom:10px;
	margin-right:2%
}
.lp_container #product_area .product_box3 .main_image,
.lp_container #product_area .product_box3 .btn_detail {
	text-align:center;
}
/*カートボタン*/
.lp_container #product_area .product_box3 .btn_detail a {
	/*▼1列時の横幅80%*/
	width:80%;
}

/* ---------- 4列 ---------- 
   レイアウトとボタンの幅 
   -------------------------*/
.lp_container #product_area .product_box4 {
	border-bottom:none;
	width:21%;
	float:left;
	padding:1%;
	margin-bottom:10px;
	margin-right:2%
}
.lp_container #product_area .product_box4 .main_image,
.lp_container #product_area .product_box4 .btn_detail {
	text-align:center;
}
/*カートボタン*/
.lp_container #product_area .product_box4 .btn_detail a {
	/*▼1列時の横幅100%*/
	width:100%;
}
/* 規格・選択ボックス */
.lp_container #product_area .product_box4 dl span {
	display: block;
}
.lp_container #product_area .product_box4 dl select {
	width:100%;
}

/* ---------- 5列 ---------- 
   レイアウトとボタンの幅 
   -------------------------*/
.lp_container #product_area .product_box5 {
	border-bottom:none;
	width:17%;
	float:left;
	padding:1%;
	margin-bottom:10px;
	margin-right:1%
}
.lp_container #product_area .product_box5 .main_image,
.lp_container #product_area .product_box5 .btn_detail {
	text-align:center;
}

.lp_container #product_area .product_box5 .text .pricebox .sale_title{
	display:block;
}
.lp_container #product_area .product_box5 .text .pricebox .price{
	display:block;
	text-align:center;
}
/*カートボタン*/
.lp_container #product_area .product_box5 .btn_detail a {
	/*▼1列時の横幅100%*/
	width:100%;
}
/* 規格・選択ボックス */
.lp_container #product_area .product_box5 dl span {
	display: block;
}
.lp_container #product_area .product_box5 dl select {
	width:100%;
}

/* ▼2列～5列共通 */
.lp_container #product_area .box_line {
	border-bottom: #666 1px dotted;
	margin-bottom:10px;
}
.lp_container #product_area .right_box {
	margin-right:0;
}
/* ▲ */

}


/* ==============================================
▼お客様の声
=============================================== */
.lp_container #lp_review {
	margin-bottom:40px;
	clear:both;
}
.lp_container #lp_review #lp_review_title {
	font-size:140%;
	text-align:center;
	padding:10px;
	margin-bottom:15px;
	background:#f5f5f5;
}
.lp_container #lp_review ul {
}
.lp_container #lp_review li {
	margin-bottom:20px;
}
.lp_container #lp_review .review_title .title {
	font-size:120%;
}
.lp_container #lp_review .review_data {
	border-top:#666 1px dotted;
	padding-top:5px;
	margin:5px 0;
}

.lp_container #lp_review .recommend_level_area {
	display: block;
}

@media only screen and (min-width: 460px) {
.lp_container #lp_review .recommend_level_area {
	display:inline;
}
}

/* ==============================================
▼ページ下部の登録
=============================================== */
.lp_container .document {
	margin-bottom:40px;
	clear:both;
}
.lp_container .document img {
	max-width:100%;
}

/* ==============================================
▼特定商取引表記
=============================================== */
.lp_container #law{
	margin-bottom:40px;
	clear:both;
}
.lp_container #law #lp_law_title {
	font-size:140%;
	text-align:center;
	padding:10px;
	margin-bottom:15px;
	background:#f5f5f5;
}
@media only screen and (min-width: 460px) {
.lp_container #law table th {
	width:20%;
}
.lp_container #law table td {
	width:80%;
}
}

/* ==============================================
▼お問い合わせ index.tpl
=============================================== */
.lp_container .contact_form,
.lp_container #sphone_btn_area {
	margin-bottom:20px;
	text-align:center;
}

/* ==============================================
▼お問い合わせ lp_contact.tpl lp_complete.tpl
=============================================== */
/* 非表示項目 */
/* 表示させる場合は、display:none; をコメントアウトするか、削除してください。*/
#lp_contact .tab_resp tr.furigana { /*フリガナ*/
	display:none;
}
#lp_contact .tab_resp tr.yubin { /*郵便番号*/
	display:none;
}
#lp_contact .tab_resp tr.address { /*住所*/
	display:none;
}
#lp_contact .tab_resp tr.tel{ /*電話番号*/
	display:none;
}
/* ▲ */

#lp_contact {
	margin-bottom:20px;
	padding:10px;
	background:#f5f5f5;
}
#lp_contact #contact_title {
	text-align:center;
	margin-bottom:20px;
	font-size:140%;
}
#lp_contact p.note {
}
/*完了ページ*/
#lp_complete_area {
	color:#FFF;
}

/*テーブル*/
#lp_contact table {
	background:#FFF;
}
#lp_contact select {
    border: solid 1px #ccc;
}
#lp_contact input[type='text'],
#lp_contact input[type='password'] {
    border: solid 1px #ccc;
    padding: 2px;
}

#lp_contact .box60 {
    width: 20%;
}
#lp_contact .box120 {
	display:block;
	width:98%;
	margin-bottom:10px;
}
#lp_contact .box380 {
    width: 98%;
}
#lp_contact .top {
    margin-bottom: 5px;
}
@media only screen and (min-width: 460px) {
#lp_contact {
	margin-bottom:0;
	padding:30px 20px;
}
#lp_contact p.note {
	padding-left:20px;
}
#lp_contact .box60 {
    width: 60px;
}
#lp_contact .box120 {
	display: inline;
	width:120px;
	margin-bottom:0;
}
#lp_contact .box380 {
    width: 380px;
}
#lp_contact input.box120 {
}
}

/*テーブル・レスポンシブ*/
#lp_contact .tab_resp table {
	width:100%;
}
#lp_contact .tab_resp th{
	text-align:center;
	padding:10px;
}
#lp_contact .tab_resp td{
	vertical-align:top;
	padding:10px;
}
@media only screen and (max-width: 459px) {
#lp_contact .tab_resp table,
#lp_contact .tab_resp table tbody,
#lp_contact .tab_resp table tr {
	display:block;
	border:none;
}
#lp_contact .tab_resp thead {
	display:none;
}
#lp_contact .tab_resp th,
#lp_contact .tab_resp td{
	display:list-item;
	border:none;
	padding:5px;
	font-weight:bold;
	list-style:none;
}
#lp_contact .tab_resp th{
	list-style-type: none;
	background-color:#eee;
	color:#333;
}
#lp_contact .tab_resp td {
	text-align:left;
}
}

/*ボタン*/
#lp_contact .btn_area {
    margin-top: 10px;
    width: 100%;
    text-align: center;
}
#lp_contact .btn_area input {
	cursor:pointer;
	padding:6px 0;
	text-align:center;
}
#lp_contact .btn_area a,
#lp_contact .btn_area a:hover {
	color:#333;
	padding:6px 0;
}

#lp_contact .btn_area li {
	text-align:center;
}
#lp_contact .btn_area li.left {
	float:left;
	width:46%;
	margin-left:2%;
}
#lp_contact .btn_area li.right {
	float:right;
	width:46%;
	margin-right:2%;
}
#lp_contact .btn_area li a {
	display:block;
	margin:0 auto;
}
/*確認ページへ*/
#lp_contact .b_confirm {
	background: #fff;
	border: 1px solid #666;
	text-shadow:1px 1px 1px rgba(255,255,255,1); 
	width: 50%;
	margin:0 auto;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	cursor:pointer;
}
#lp_contact .b_confirm:hover {
	background: #ddd;
}
/*戻る*/
#lp_contact .b_back {
	background: #ddd;
	border: 1px solid #666;
	text-shadow:1px 1px 1px rgba(255,255,255,1); 
	width: 100%;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#lp_contact .b_back:hover {
	background: #ccc;
}
/*送信*/
#lp_contact .b_send {
	background: #fff;
	border: 1px solid #999;
	text-shadow:1px 1px 1px rgba(255,255,255,1); 
	width: 100%;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#lp_contact .b_send:hover {
	background: #ddd;
}


/* スマホ表示用（お問い合わせはこちら）
----------------------------------------------- */
.lp_container #sphone_btn_area {
    margin-top: 10px;
    width: 100%;
    text-align: center;
}
.lp_container #sphone_btn_area li a {
	display:block;
	margin:0 auto;
	color:#333;
	padding:6px 0;
}
.lp_container #sphone_btn_area .b_confirm {
	background: #eee;
	border: 1px solid #666;
	text-shadow:1px 1px 1px rgba(255,255,255,1); 
	width: 80%;
	margin:0 auto;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	cursor:pointer;
}

/* ===============================================
▼ソーシャルブックマーク
=============================================== */
#landing_socialbtn {
	background-color:#F7F7F7;
	border:1px solid #CCC;
	padding:5px 10px;
	margin-bottom:20px;
}
#landing_socialbtn #date {
	padding-bottom:5px;
	border-bottom:1px dotted #999;
	margin-bottom:10px;
}
#landing_socialbtn #socialbtn_box div {
	padding:0 10px 0 0;
	float:left;
}

/* フッター
----------------------------------------------- */
.lp_footer {
    margin: 0 auto;
    padding: 0 1.5% 20px 1.5%;
    width: 97%;
    background: #fff;
    text-align: left;
}
.lp_footer #lp_footer_menu {
	text-align:center;
}
.lp_footer #lp_footer_menu li {
	display: block;
	padding:10px;
	border-top:1px #999 solid;
}
.lp_footer #copyright {
	border-top:1px solid #999;
	padding-top:10px;
}
#landing_pagetop {
	position: fixed;
	bottom: 20px;
	right: 20px;
}
#landing_pagetop a {
	background:rgba(0,0,0,0.50);
	color: #fff;
	padding: 5px 15px;
	text-align: center;
	border-radius: 5px;
	border:#666 1px solid;

}
#landing_pagetop a:hover {
	background:rgba(0,0,0,0.70);
	border:#999 1px solid;
	text-decoration:none;
}


/* タブレット向けのスタイル：460px～ */
@media only screen and (min-width: 460px) {
.lp_footer {
    padding: 0 1% 20px 1%;
    width: 98%;
}
.lp_footer #lp_footer_menu li {
	display:inline;
	padding:5px;
	line-height:2em;
	border:none;
}
}
/*  PC向けのスタイル：980px～ */
@media only screen and (min-width: 980px) {
.lp_footer {
    width: 950px;
	padding:0 15px 20px 15px;
}
}


/* CKEditorのテーブル設定（特定商取引表記でも併用）
----------------------------------------------- */
.lp_container table.image {
	table-layout:fixed;
}
.lp_container table.no_border,
.lp_container table.no_border th,
.lp_container table.no_border td {
	border:none;
}
/* レスポンシブ設定*/
.lp_container table.responsive {
	width:100%;
}
.lp_container table.responsive th{
	text-align:center;
	padding:10px;
}
.lp_container table.responsive td{
	vertical-align:top;
	padding:10px;
}
@media only screen and (max-width: 459px) {
.lp_container table.responsive,
.lp_container table.responsive tbody,
.lp_container table.responsive tr {
	display:block;
	border:none;
}
.lp_container table.responsive thead {
	display:none;
}
.lp_container table.responsive th,
.lp_container table.responsive td{
	display:list-item;
	border:none;
	padding:5px;
	list-style:none;
}
.lp_container table.responsive th{
	list-style-type: none;
	background-color:#eee;
	color:#333;
}
.lp_container table.responsive td {
	text-align:left;
}



