﻿@charset "utf-8";
/*===============================================================
	
	2015/7/27
	
===============================================================*/

/* 初期化
----------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
  font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
	outline: none;
}
blockquote, q {	quotes: none;	}
blockquote:before, blockquote:after,
q:before, q:after {	content: '';	content: none;}
input, textarea,{	margin: 0;	padding: 0;	}
table{	border-collapse: collapse; border-spacing:0;	}
body { 
font-family:"游ゴシック","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","ＭＳ ゴシック",sans-serif; 
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, sans-serif;
}
h1,h2,h3,h4,h5,h6,p,li,th,td,dt,dd { font-size:14px; line-height:22px; }
caption,th,td { text-align:left; vertical-align:top; }
img { vertical-align:top; border:0; }
ul,li { list-style:none; }
option { padding-right:1em; }
address,caption { font-style:normal; font-weight:normal; }
a {	outline:none;	text-decoration:underline; }
a:focus {	outline:none;	}
ul a ,li a {	zoom:1;	}

sup {
	padding:0;
	line-height:1;
}
/* HTML5
----------------------------------------------------------------*/
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

/* 文字サイズ、装飾
----------------------------------------------------------------*/
.bold	{	font-weight:bold; }
.cap {
	font-size:12px;
	line-height:15px;
	}		
.red	{	color:#943023;		}
.yellow	{	color:#cbb847;		}
.blue	{	color:#0047a2;		}
.lightblue { color:#00afd7; }
.green	{	color:#5b9000;	}
.brown	{	color:#633;		}
.pink	{	color:#f3c;		}
.gray	{	color:#eaeeed;		}
.deepgray { color:#92999f ;}
.align_center	{	text-align:center;		}
.align_right	{	text-align:right;		}
.replace {	overflow:hidden;	white-space:nowrap;	text-indent:100%;	}

/* フロート関係
----------------------------------------------------------------*/
.clear {
	width:100%;
	overflow:hidden;
}
.clearboth {
	clear:both;
}
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
  *zoom: 1;
}
.flol {
	display:inline; /* IE6 */
	float:left;
}
.flor {
	display:inline; /* IE6 */
	float:right;
}
/* マージン
----------------------------------------------------------------*/
.mt05	{	margin-top:5px;		}
.mt10	{	margin-top:10px;	}
.mt15	{	margin-top:15px;	}
.mt20	{	margin-top:20px;	}
.mt25	{	margin-top:25px;	}
.mt30	{	margin-top:30px;	}
.mt40	{	margin-top:40px;	}
.mt50	{	margin-top:50px;	}
.mt60	{	margin-top:60px;	}
.mt70	{	margin-top:70px;	}
.mt80	{	margin-top:80px;	}
.mt90	{	margin-top:90px;	}
.mt100	{	margin-top:100px;	}

.mb05	{	margin-bottom:5px;	}
.mb10	{	margin-bottom:10px;	}
.mb15	{	margin-bottom:15px;	}
.mb20	{	margin-bottom:20px;	}
.mb25	{	margin-bottom:25px;	}
.mb30	{	margin-bottom:30px;	}
.mb40	{	margin-bottom:40px;	}
.mb50	{	margin-bottom:50px;	}

/* ボックスモデル幅指定
----------------------------------------------------------------*/
.bg_w	{ width:100%; }
.page_w	{ width:960px; }
.main_w	{ width:800px; }
.sub_w	{ width:220px; }

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.bg_w,
.page_w,
.main_w	{ width:100%; }
.sub_w	{ width:220px; }
}	/* for SP max-width: 736px */

/* html/body設定
----------------------------------------------------------------*/
html {
}
body {
	width: 100%;
	color:#333;
	background:#f6f8f8;
	text-align:left;
	font-size:14px;
	line-height:25px;
	-webkit-text-size-adjust:none; /* 縦横文字サイズ同じ */
}
a {
	color:#36C;
	-webkit-transition: background-color 0.1s linear, color 0.1s linear, border-color 0.1s linear, border-width 0.1s linear, opacity 0.1s linear;
	-ms-transition: background-color 0.1s linear, color 0.1s linear, border-color 0.1s linear, border-width 0.1s linear, opacity 0.1s linear;  
	-moz-transition: background-color 0.1s linear, color 0.1s linear, border-color 0.1s linear, border-width 0.1s linear, opacity 0.1s linear;
	-o-transition: background-color 0.1s linear, color 0.1s linear, border-color 0.1s linear, border-width 0.1s linear, opacity 0.1s linear;
}
a:hover { color:#39F }

.boxshadow {
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.20);
	-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.20);
	-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.20);
}
.sp {
	display:none;
}
.fit,
.fit img {
	width:100%;
	height:auto;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～640px */
@media only screen and (max-width: 736px) {
.pc {
	display:none;
}
.sp {
	display:block;
}

}	/* for SP max-width: 736px */

/*===============================================================
	
	基本文字サイズ
	
===============================================================*/

h2 {
	font-size:30px;
	font-weight:bold;
}
h3 {
	font-size:30px;
	font-weight:bold;
}
h4 {
	font-size:20px;
	line-height:1.4;
}
p {
	font-size:14px;
	line-height:1.8;
}
.notes {
	margin-top:10px;
}
.notes li {
	color:#b29f8a;
	margin-top:5px;
	line-height:1.4;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
h2 {
	font-size:20px;
	font-weight:bold;
}
h3 {
	font-size:20px;
	font-weight:bold;
}
h4 {
	font-size:18px;
	line-height:1.4;
}
p {
	font-size:14px;
	line-height:1.8;
}
.notes {
	margin-top:10px;
}
.notes li {
	color:#b29f8a;
	margin-top:5px;
	line-height:1.4;
}
}	
/*===============================================================
	
	レイアウト
	
===============================================================*/
.wrapper {
	padding-top:80px;
}
@media screen and (max-width: 960px) {
.wrapper {
	padding-top:60px;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */


/*===============================================================
	
	ヘッダ
	
===============================================================*/
.header_wrp {
	width:100%;
	height:80px;
	color:#333;
	background:#fff;
	position:fixed;
	z-index:9998;
	top:0;
}
.header a {
	color:#666;
	text-decoration:none;
}
.header a:hover {
	color:#333;
	text-decoration:none;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
.header_wrp {
	width:100%;
	height:60px;
	color:#333;
	background:#fff;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	header txt	
-------------------------------------------------------------*/
.header h1 {
	position:absolute;
	left:100px;
	top:15px;
	font-weight:bold;
}
.header h1 a strong {
	color:#ec417b;
	font-weight:bold;
}

.header p.logo {
	position:absolute;
	top:0;
	left:0;
	width:80px;
	height:80px;
	background:url(../images/saplus_logo.jpg) no-repeat top center;
	background-size:80px 80px;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}

.header .account {
	font-weight:bold;
}
.header .account span {
	display:block;
	font-size:12px;
	font-weight:normal;
}
.header .account a {
	position:absolute;
	width:180px;
	border-radius:25px;
	top:15px;
	right:70px;
	text-align:center;
	background:#00bcd5;
	color:#fff;
	padding:8px 0 3px 0;
	line-height:20px;
}
.header .account a:hover {
	background:#00e1ff;
}

.header .login {
	font-size:9px;
}
.header .login a {
	position:absolute;
	width:50px;
	border-radius:25px;
	top:15px;
	right:10px;
	text-align:center;
	background:#fff;
	border:solid 1px #ff5253;
	color:#ff5253;
	padding:30px 0 5px 0;
	line-height:15px;
	background:#fff url(../images/icon_login.png) no-repeat center 5px;
}
.header .login a:hover {
	border:solid 1px #ff5253;
	background:#ff5253 url(../images/icon_login_on.png) no-repeat center 5px;
	color:#fff;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.header h1 {
	position:absolute;
	top:5px;
	left:0;
	width:50px;
	height:50px;
}
.header h1 a {
	display:block;
	width:50px;
	height:50px;
	background:url(../images/saplus_logo.jpg) no-repeat top center;
	background-size:50px 50px;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}

.header p.logo {
	display:none;
}

.header .account a {
	position:absolute;
	width:180px;
	border-radius:25px;
	top:10px;
	right:0;
	left:0;
	text-align:center;
	background:#00bcd5;
	color:#fff;
	padding:8px 0 3px 0;
	line-height:15px;
	margin:auto;
}
.header .account a:hover {
	background:#00e1ff;
}

.header .function .login {
	display:none;
}


}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */


/*-------------------------------------------------------------
	無料アカウントを作成、ログインを非表示
-------------------------------------------------------------*/
.header .function .account,
.header .function .login {
	display:none;
}

/*-------------------------------------------------------------
	ヘッダ部　お問い合わせ、電話追加
-------------------------------------------------------------*/
.header .function .txt {
	position:absolute;
	right:10px;
	top:5px;
	width:350px;
	color:#333;
	text-align:center;
	font-size:12px;
	color:#666;
}

.header .function .contact a {
	position:absolute;
	width:130px;
	border-radius:25px;
	top:28px;
	right:10px;
	text-align:center;
	background:#00a848;
	color:#fff;
	padding:8px 0 7px 0;
	line-height:20px;
}
.header .function .contact a:hover {
	background:#02c556;
}
.header .function .information {
	position:absolute;
	right:160px;
	top:25px;

}
.header .function .information .tel {
	font-family:Arial, Helvetica, sans-serif;
	font-size:25px;
	line-height:30px;
	font-weight:bold;
	background:url(../images/icon_freedial.jpg) no-repeat left center;
	padding-left:40px;
	color:#666;
}
.header .information .time {
	font-size:11px;
	line-height:12px;
	text-align:center;
	color:#666;
}

.header .nav .contact {
	display:none;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
.header .function .contact {
	display:none;
}
.header .nav .contact {
	display:block;
}
.header .function .txt {
	position:static;
	padding-left:60px;
	text-align:left;
	font-size:11px;
	line-height:15px;
	margin-top:5px;
}

.header .function .information {
	position:static;
	padding-left:60px;
	margin:0;
}
.header .function .information .tel {
	background:url(../images/icon_freedial-sp.jpg) no-repeat left center;
	background-size:24px 15px;
	padding-left:28px;
	color:#666;
	width:160px;
	margin-top:0px;
	font-size:20px;
	line-height:22px;
}
.header .information .time {
	margin-top:3px;
	text-align:left;
	font-size:10px;
	line-height:11px;
}

.header .function .information .tel a {
	color:#333;
	text-decoration:none;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	nav	
-------------------------------------------------------------*/
.header .nav {
	position:absolute;
	top:40px;
	left:100px;
	z-index:100;
}
.header .nav li {
	float:left;
	margin-right:40px;
}

.index .header .nav li.index  {	border-bottom:solid 1px #ddd;	}
.feature .header .nav li.feature  {	border-bottom:solid 1px #ddd;	}
.voice .header .nav li.voice  {	border-bottom:solid 1px #ddd;	}
.price .header .nav li.price  {	border-bottom:solid 1px #ddd;	}
.entryform .header .nav li.entryform  {	border-bottom:solid 1px #ddd;	}
.trialform .header .nav li.trialform  {	border-bottom:solid 1px #ddd;	}
.header .nav li.trialform {
	display:none;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.header .nav {
	width:100%;
	top:60px;
	left:0;
	background:rgba(0,0,0,0.5);
}
.header .nav li {
	float:none;
	width:100%;
	margin:0;
}
.header .nav li a {
	display:block;
	line-height:50px;
	border-top:solid 1px #ddd;
	background:#fff;
	padding:0 10px;
	width:100%;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.index .header .nav li.index,
.feature .header .nav li.feature,
.voice .header .nav li.voice,
.price .header .nav li.price ,
.entryform .header .nav li.entryform,
.trialform .header .nav li.trialform  {	border-bottom:solid 0px #ddd;	}
.header .nav li.trialform {
	display:block;
}

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */


/*===============================================================
	
	MENU
	
===============================================================*/
.menu {
	display:none;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.menu {
	display:block;
	width:40px;
	height:40px;
	position:absolute;
	top:10px;
	right:10px;
	background:url(../images/header_sp_menu.png) no-repeat 0 0;
	background-size:40px 40px;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	ボディ
	
===============================================================*/
.body_wrp {
	width:100%;
	color:#333;
	padding:20px 0;
	height:1000px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */
/*===============================================================
	
	フッタ
	
===============================================================*/
.footer_wrp {
	text-align:left;
	width:100%;
	height:100px;
	border-top:solid 1px #ddd;
	background:#fff;
	position:relative;
}
.footer_section {
	width:940px;
	margin:0 auto;
	position:relative;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.footer_section {
	width:95%;
	margin:0 auto;
	position:relative;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.footer_wrp {
	text-align:center;
	width:100%;
	height:auto;
	border-top:solid 1px #ddd;
	background:#fff;
	position:relative;
	padding:20px 0;
}
.footer_section {
	width:100%;
}
}	/* for SP max-width: 736px */


/*-------------------------------------------------------------
	.footer_wrp .footer_section
-------------------------------------------------------------*/

.footer_section .logo {
	position:absolute;
	top:20px;
	left:0;
	width:60px;
	height:60px;
	background:url(../images/saplus_logo.jpg) no-repeat top center;
	background-size:60px 60px;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}

.footer_section .read {
	position:absolute;
	left:80px;
	top:25px;
	font-weight:bold;
	font-size:20px;
	line-height:25px;
}
.footer_section .read a {
	color:#666;
	text-decoration:none;
}
.footer_section .read a strong {
	color:#ec417b;
	font-weight:bold;
}



/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.footer_section .logo {
	position:static;
	width:40px;
	height:40px;
	background:url(../images/saplus_logo.jpg) no-repeat top center;
	background-size:40px 40px;
	margin:0 auto;
}

.footer_section .read {
	position:static;
	font-weight:bold;
	font-size:12px;
	line-height:25px;
}
.footer_section .read br {
	display:none;
}

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.footer_section .information
-------------------------------------------------------------*/
.footer_section .information {
	position:absolute;
	right:0;
	top:20px;
}
.footer_section .information .tel {
	font-family:Arial, Helvetica, sans-serif;
	font-size:30px;
	line-height:35px;
	font-weight:bold;
	background:url(../images/icon_freedial.jpg) no-repeat left center;
	padding-left:40px;
	color:#666;
}
.footer_section .information .time {
	font-size:12px;
	text-align:center;
	color:#666;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.footer_section .information {
	position:static;
}
.footer_section .information .tel {
	background:url(../images/icon_freedial-sp.jpg) no-repeat left center;
	background-size:32px 20px;
	padding-left:40px;
	color:#666;
	width:240px;
	margin:0 auto;
}
.footer_section .information .tel a {
	color:#333;
	text-decoration:none;
}

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	footer_link_wrp	
-------------------------------------------------------------*/
.footer_link_wrp {
	background:#f7f7f7;
	position:relative;
	height:80px;
}

.footer_link_wrp .link {
	position:absolute;
	left:0;
	top:15px;
	width:500px;
}
.footer_link_wrp .link li a {
	float:left;
	margin-right:20px;
	text-decoration:none;
	color:#666;
}
.footer_link_wrp .link li a:hover {
	text-decoration:underline;
}

.footer_link_wrp .copyright {
	position:absolute;
	right:0;
	top:15px;
	text-align:right;
	color:#999;
	font-size:12px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.footer_link_wrp {
	background:#f7f7f7;
	position:relative;
	height:auto;
	text-align:center;
}

.footer_link_wrp .link {
	position:static;
	width:100%;
}
.footer_link_wrp .link li {
	float:left;
	width:50%;
}
.footer_link_wrp .link li a {
	float:none;
	margin-right:0;
	text-decoration:none;
	color:#666;
	padding:10px 0;
	display:block;
	border-top:solid 1px #ddd;
	border-left:solid 1px #ddd;
}
.footer_link_wrp .link li a:hover {
	text-decoration:none;
}

.footer_link_wrp .copyright {
	position:static;
	border-top:solid 1px #ddd;
	text-align:center;
	padding:10px 0 50px 0;
}


}	/* for SP max-width: 736px */

/*===============================================================
	
	girid
	
===============================================================*/
.gridconatiner {
}
.gridconatiner .grid {
	float:left;
}
.grid {
}

.gridwrp_3 { width:105.000%;}
.gridwrp_3 .grid_1 { width:28.571%; margin-right:4.762%; }
.gridwrp_2 { width:105.000%;}
.gridwrp_2 .grid_1 { width:45.238%; margin-right:4.762%; }
.gridwrp_4 { width:105.000%;}
.gridwrp_4 .grid_1 { width:20.238%; margin-right:4.762%; }


/* 460 40 460 */
.gridwrp_2 { width:104.167%;}
.gridwrp_2 .grid_2 { width:96.000%; margin-right:4.000%; }
.gridwrp_2 .grid_1 { width:46.000%; margin-right:4.000%; }


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.gridwrp_3,
.gridwrp_3 .grid_1,
.gridwrp_2,
.gridwrp_2 .grid_1 {
	width:100%; margin-right:0;
}
.gridwrp_4 { width:105.000%;}
.gridwrp_4 .grid_1 { width:45.238%; margin-right:4.762%; }

.grid {
	margin-top:30px;
}
.grid:first-child {
	margin-top:0px;
}

}	/* for SP max-width: 736px */


/*===============================================================
	
	fixed
	
===============================================================*/
.fixed {
	position: fixed;
	top: 0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.fixed {
	position: fixed;
	top: 0;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	PAGETOP
	
===============================================================*/
#btn_pagetop {
	width:100%;
	overflow:hidden;
}

#btn_pagetop a {
	display:block;
	position:absolute;
	right:-300px;
	top:0;
	width:80px;
	height:80px;
	background:url(../images/pc-pagetop-arw.png) no-repeat 0 0;
	text-indent:100%;
	overflow:hidden;
	white-space:nowrap;
	z-index:1000;
	position:fixed;
}
#btn_pagetop a:hover {
	background:url(../images/pc-pagetop-arw_on.png) no-repeat 0 0;

}

/* タブレット以下 */
@media screen and (max-width: 960px) {
#btn_pagetop a {
	width:60px;
	height:60px;
	background:url(../images/pc-pagetop-arw.png) no-repeat 0 0;
	background-size:60px 60px;
}
#btn_pagetop a:hover {
	background:url(../images/pc-pagetop-arw.png) no-repeat 0 0;
	background-size:60px 60px;
}

}	/* for SP max-width: 960px */

/*===============================================================
	
	テーブル
	
===============================================================*/
table {
	width:100%;
	text-align:left;
}
table th {
	padding:15px;
	font-weight:bold;
	border-bottom:solid 1px rgba(0,0,0,0.3);
}
table td {
	padding:15px;
	border-bottom:solid 1px rgba(0,0,0,0.1);
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
table {
	border:0;
	padding:0;
	margin-top:0px;
}
table th {
	display: list-item;
	list-style:none;
	width:100%;
	border:0;
	padding:10px;
	font-size:16px;
	background:#eee;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;

	-webkit-box-sizing:border-box;
	-webkit-box-sizing:border-box;

}
table td {
	display: list-item;
	list-style:none;
	width:100%;
	padding:10px 0 20px 0;
	font-size:14px;
	line-height:1.6;
	border:0;
}

}	/* for SP max-width: 736px */


/*===============================================================
	
	フォーム
	
===============================================================*/
.form {
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */
/*===============================================================
	
	btn
	
===============================================================*/
.btn input,
.btn a {
	display:block;
	width:200px;
	height:40px;
	padding:0;
	text-decoration:none;
	color:#fff;
	font-size:16px;
	line-height:40px;
	font-weight:bold;
	text-shadow: 0px 1px 1px rgba(0,0,0, 0.4);
	letter-spacing:0em;
	background:#cf5757;
	border:0;
	border-bottom:solid 2px rgba(0,0,0, 0.2);
	border-radius:3px;
	cursor:pointer;
	text-align:center;
}

.btn input:hover,
.btn a:hover {
	background:#f94a4a;
}
.btn-single input,
.btn-single a {
	width:200px;
	margin:0 auto;
	text-align:center;
}

/*===============================================================
	
	pagetitle
	
===============================================================*/
.pagetitle {
	background:url(../images/bg_wood.jpg) repeat center top;

}
.pagetitle h2 {
	font-size:30px;
	line-height:35px;
	padding:15px 0;
	color:#fff;
	text-align:center;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
.pagetitle {

}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.pagetitle {
	background:url(../images/bg_wood.jpg) repeat center top;
	background-size:512px 225px;
}
.pagetitle h2 {
	font-size:20px;
	line-height:25px;
	padding:10px 0;
}
}	/* for SP max-width: 736px */


/*===============================================================
	
	section
	複数のcontent、headlineなど格納するブロック
	
===============================================================*/
.section_wrp {
	background:url(../images/bg_body.jpg) repeat center top;
	overflow-x:hidden;
}
.section {
	width:100%;
}
.section .section_inner {
	width:800px;
	margin:0 auto;
	padding:60px 0 100px 0;
	
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.section .section_inner {
	width:90%;
	margin:0 auto;
	padding:50px 0 100px 0
}

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.section .section_inner {
	width:90%;
	margin:0 auto;
	padding:20px 0 40px 0;
}

.section00 .section_inner {
	padding-top:30px;
	margin-top:0px;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	content 
	
===============================================================*/
.section .content {
	width:800px;
	margin:0 auto;
	padding-bottom:50px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.section .content {
	width:100%;
	margin:0 auto;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.section .content {
	width:100%;
	margin:0 auto;
	padding-bottom:10px;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	headline：見出し
	subhead：小見出し
	
===============================================================*/
.headline {
	font-size:30px;
	line-height:35px;
	font-weight:bold;
	padding:0;
}
.subhead {
	font-size:20px;
	line-height:35px;
	font-weight:bold;
	margin-top:60px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.headline {
	font-size:20px;
	line-height:30px;
	padding-bottom:5px;
	text-align:center;
	padding-top:30px;
}
.subhead {
	font-size:16px;
	line-height:25px;
	font-weight:bold;
	margin-top:20px;
}


}	/* for SP max-width: 736px */

/*===============================================================
	
	btn_detail
	
===============================================================*/
.btn_detail {
	width:300px;
	margin:0 auto;
	margin-top:40px;
}
.btn_detail a {
	display:block;
	background-color:#ec417b;
	background-image:url(../images/btn_detail_arw.png);
	background-position:right center;
	background-repeat:no-repeat;
	text-align:center;
	color:#fff;
	font-size:20px;
	line-height:20px;
	font-weight:bold;
	padding:20px 0;
	border-radius:2px;
	box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
	-moz-box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
	text-decoration:none;
}
.btn_detail a:hover {
	text-decoration:none;
	background-color:#ff5e95;
}
.btn_detail_pink a { background-color:#ec417b; }
.btn_detail_tryblue a { background-color:#00bcd5; }
.btn_detail_green a { background-color:#8cc34b; }
.btn_detail_yellow a { background-color:#ffc928; }
.btn_detail_blue a { background-color:#00b0ff; }
.btn_detail_gray a { background-color:#333; }
.btn_detail_deepyellow a { background-color:#ff9f00; }
.btn_detail_orange a { background-color:#ff5253; }
.btn_detail_pink a:hover { background-color:#ff5e95; }
.btn_detail_tryblue a:hover { background-color:#00e1ff; }
.btn_detail_green a:hover { background-color:#a1e94d; }
.btn_detail_yellow a:hover { background-color:#ffe328; }
.btn_detail_blue a:hover { background-color:#00e4ff; }
.btn_detail_deepyellow a:hover { background-color:#ffcc00; }
.btn_detail_orange a:hover { background-color:#ff8352; }
.btn_detail_gray a:hover { background-color:#555; }
.btn_googleplay a {
	background-color:#000;
	background-image:url(../images/icon_googleplay.png);
	background-position:center center;
	background-repeat:no-repeat;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}
.btn_googleplay a:hover {
	background-color:#555;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.btn_detail {
	width:100%;
	margin:0 auto;
	margin-top:15px;
}
.btn_detail a {
	font-size:16px;
}
}	/* for SP max-width: 736px */
/*===============================================================
	
	btn_more
	
===============================================================*/
.btn_more {
	width:200px;
	height:40px;
	margin:0;
	margin-top:30px;
	position:relative;
}
.btn_more a {
	display:block;
	background-color:#fff;
	background-image:none;
	background-position:right center;
	background-repeat:no-repeat;
	text-align:center;
	color:#333;
	font-size:14px;
	line-height:40px;
	font-weight:bold;
	padding:0;
	border-radius:5px;
	box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
	-moz-box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
	text-decoration:none;
	position:absolute;
	width:200px;
	height:40px;
}
.btn_more a:hover {
	box-shadow:rgba(0, 0, 0, 0) 0px 0px 0px 0px;
	-webkit-box-shadow:rgba(0, 0, 0, 0) 0px 0px 0px 0px;
	-moz-box-shadow:rgba(0, 0, 0, 0) 0px 0px 0px 0px;
	top:2px;
	background:#fff;
}

.bg_pink .btn_more a { color:#ec417b; }
.bg_tryblue .btn_more a { color:#00bcd5; }
.bg_green .btn_more a { color:#8cc34b; }
.bg_yellow .btn_more a { color:#ffc928; }
.bg_blue .btn_more a { color:#00b0ff; }
.bg_deepyellow .btn_more a { color:#ff9f00; }
.bg_orange .btn_more a { color:#ff5253; }


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.btn_more {
	width:100%;
	margin:0 auto;
	margin-top:15px;
}
.btn_more a {
	font-size:16px;
	width:100%;
}
}	/* for SP max-width: 736px */



/*===============================================================
	
	entryflow
	
===============================================================*/
.entryflow_wrp {
	background:#ec417b;
}
.trialform .entryflow_wrp {
	background:#00bcd5;
}

.entryflow {
	padding:25px 0;
	width:800px;
	margin:0 auto;
}
.entryflow {
	width:800px;
}

.entryflow h3 {
	height:800px;
	height:50px;
	background-image:url(../images/entryflow.jpg);
	background-repeat:no-repeat;
	background-position:0 0;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}
.trialform .entryflow h3 {
	background-image:url(../images/trialflow.jpg);
}

.entryflow h3.input {
	background-position:0 0;
}
.entryflow h3.confirm {
	background-position:0 -50px;
}
.entryflow h3.complete {
	background-position:0 -100px;
}



/* タブレット以下 */
@media screen and (max-width: 820px) {
.entryflow {
	width:100%;
	padding:25px 10px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.entryflow img {
	width:100%;
	height:auto;
}
}	/* for tablet max-width: 800px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.entryflow {
	padding:10px;
	width:100%;
}
.entryflow h3 {
	width:100%;
	height:auto;
	white-space:normal;
	text-indent:0;
	overflow:hidden;
	background:#ec417b;
	color:#fff;
	text-align:center;
}
.trialform .entryflow h3 {
	background:#00bcd5;
}
}	/* for SP max-width: 736px */


/*===============================================================
	
	tab
	
===============================================================*/
.tab {
	width:800px;
	margin:0 auto;
	padding-top:60px;
}
.tab ul li {
	float:left;
	width:50%;
	text-align:center;
}
.tab ul li br {
	display:none;
}
.tab ul li.active {
	font-weight:bold;
}
.tab ul li a {
	display:block;
	padding:25px 0;
	font-size:18px;
	color:#999;
	text-decoration:none;
}
.tab ul li.link a {
	border-bottom:solid 1px #ddd;
	background:url(../images/tab_arw.png) no-repeat right center;
}
.tab ul li.active a {
	border:solid 1px #ddd;
	border-bottom:0;
	color:#333;
}
.tab ul li.link a:hover {
	color:#ec417b;
}


/* タブレット以下 */
@media screen and (max-width: 800px) {
.tab {
	width:100%;
	padding-top:20px;
}
}	/* for tablet max-width: 800px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.tab ul li {
	float:left;
	width:50%;
	text-align:center;
}
.tab ul li br {
	display:block;
}
.tab ul li.active {
	font-weight:bold;
}
.tab ul li a {
	display:block;
	padding:15px 0;
	font-size:12px;
	line-height:15px;
	color:#999;
	text-decoration:none;
}
.tab ul li.link a {
	border-bottom:solid 1px #ddd;
	background:url(../images/tab_arw-sp.png) no-repeat right center;
	background-size:15px 20px;
}
.tab ul li.active a {
	border:solid 1px #ddd;
	border-bottom:0;
	color:#333;
}
.tab ul li.link a:hover {
	color:#ec417b;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	entryform
	
===============================================================*/
.entryform {
}
.entryform .headline {
	color:#ec417b;
	border-bottom:solid 1px #ec417b;
	padding-bottom:15px;
	padding-top:30px;
}
.entryform .subhead {
	color:#ec417b;
}
.entryform .headline:first-child {
	padding-top:0px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	entryform_complete	
-------------------------------------------------------------*/
.entryform .form_complete .content {
	min-height:300px;
}
.entryform .form_complete .content p {
	margin-top:20px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.entryform .form_complete .content {
	min-height:0;
}
}	/* for SP max-width: 736px */


/*===============================================================
	
	trialform
	
===============================================================*/
.trialform {
}
.trialform .headline {
	color:#00bcd5;
	border-bottom:solid 1px #00bcd5;
	padding-bottom:15px;
	padding-top:30px;
}
.trialform .subhead {
	color:#00bcd5;
}
.trialform .headline:first-child {
	padding-top:0px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */


/*===============================================================
	
	plan
	
===============================================================*/
.plan {
	padding:35px 0;
	text-align:center;
}
.plan h3 {
	font-size:25px;
	line-height:30px;
}
.plan p {
	font-size:20px;
	margin-top:5px;
}
.plan_standerd {
	background:url(../images/bg_plan_standerd.gif) repeat top center;
	color:#61953a;
}
.plan_cloud {
	background:url(../images/bg_plan_cloud.gif) repeat top center;
	color:#6b7a80;
}
.entryform .form_input .plan_payment {
	padding-bottom:10px;
}

.plan_payment h3 {
	font-size:20px;
	line-height:30px;
	color:#666;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.plan {
	padding:10px 0;
	text-align:center;
}
.plan h3 {
	font-size:16px;
	line-height:20px;
}
.plan p {
	font-size:14px;
	margin-top:0px;
}
}	/* for SP max-width: 736px */


/*===============================================================
	
	formparts
	
===============================================================*/
.formparts {
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.formparts .grid {
	margin:0;
}
}	/* for SP max-width: 736px */
/*-------------------------------------------------------------
	formparts	
-------------------------------------------------------------*/
.formparts .radio {
	border:solid 2px #ddd;
	border-radius:5px;
	padding:15px;
	/*cursor:pointer;*/
	margin-top:20px;
}
.formparts .select {
	border:solid 2px #ddd;
	border-radius:5px;
	padding:15px;
	/*cursor:pointer;*/
	margin-top:20px;
}

.formparts .active {
	border:solid 2px #ec417b;
}
.formparts .hover {
	border:solid 2px #ec417b;
}

.form_confirm .linkarea {
	opacity:0.3;
}
.form_confirm .active {
	opacity:1;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.formparts .radio,
.formparts .select {
	padding:10px;
	margin-top:10px;
}
.formparts .hover {
	border:solid 2px #ddd;
}
.formparts .active {
	border:solid 2px #ec417b;
}
}	/* for SP max-width: 736px */


/*-------------------------------------------------------------
	.formparts .selectbtn
-------------------------------------------------------------*/
.formparts .selectbtn a {
	width:5em;
	display:block;
	margin:0 auto;
	margin-top:10px;
	background:#ccc;
	text-align:center;
	line-height:30px;
	border-radius:15px;
	color:#fff;
	text-decoration:none;
}
.formparts .selectbtn a:hover {
}
.formparts .active .selectbtn a {
	width:5em;
	display:block;
	margin:0 auto;
	margin-top:10px;
	background:#ec417b;
	text-align:center;
	line-height:30px;
	border-radius:15px;
	color:#fff;
	text-decoration:none;
}
.entryform .form_confirm .selectbtn {
	display:none;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.formparts .selectbtn a ,
.formparts .active .selectbtn a {
	margin-top:5px;
	line-height:20px;
	border-radius:10px;
}

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.formparts .select 
-------------------------------------------------------------*/
.formparts .select li.selectbtn a {
	float:left;
	margin:0;
	margin-right:10px;
}
.formparts .select li.title {
	float:left;
	font-size:20px;
	padding-top:4px;
	font-weight:bold;
}
.formparts .select li.price {
	float:right;
	font-size:20px;
	padding-top:4px;
	color:#999;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.formparts .select li.selectbtn a {
	float:left;
	margin:0;
	margin-right:10px;
}
.formparts .select li.title {
	float:left;
	font-size:14px;
	padding-top:0;
	font-weight:bold;
}
.formparts .select li.price {
	float:right;
	font-size:14px;
	padding-top:0;
	color:#999;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	select_tablet	
-------------------------------------------------------------*/
.select_tablet {
}
.select_tablet .tablet_printer {
	padding-top:15px;
	width:100%;
}
.select_tablet .tablet_printer .img {
	width:100%;
	float:none;
}
.select_tablet .tablet_printer .img img {
	width:100%;
	height:auto;
}
.select_tablet .tablet_printer p {
	margin-top:20px;
}
.select_tablet .select li.price {
	color:#ec417b;
	font-weight:bold;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.select_tablet .tablet_printer .img {
}
.select_tablet .tablet_printer p {
	font-size:12px;
	line-height:15px;
}
}	/* for SP max-width: 736px */


/*-------------------------------------------------------------
	select_option	
-------------------------------------------------------------*/
.select_option {
}
/*
.select_option .tablet_printer {
	padding-top:15px;
}
.select_option .tablet_printer .img {
	float:left;
	width:300px;
}
.select_option .tablet_printer .img img {
	width:100%;
	height:auto;
}
.select_option .tablet_printer p {
	margin-left:330px;
	margin-top:20px;
}*/

.select_option .subhead {
	margin:0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	2015/10/29　追記
-------------------------------------------------------------*/
.formparts .cap {
	font-size:12px;
	line-height:15px;
	margin-top:0;
}
.formparts .select .cap {
	color:#999;
	padding-top:10px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	totalprice	
-------------------------------------------------------------*/
.totalprice {
	background:url(../images/bg_graynoize.gif) repeat top center;
	padding:30px;
	color:#666;
}
.totalprice p.total {
	font-size:20px;
	margin-top:20px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */


/*-------------------------------------------------------------
	input_detail	
-------------------------------------------------------------*/
.input_detail {
}
.input_detail dl {
	width:100%;
	overflow:hidden;
	margin-top:20px;
	border-bottom:solid 1px #ddd;
}
.input_detail dl dt {
	float:left;
	clear:both;
	border-top:solid 1px #ddd;
	width:270px;
	padding:20px 0;
}
.input_detail dl dd {
	border-top:solid 1px #ddd;
	margin-left:270px;
	padding:20px 0; 
}
.input_detail dl dd input ,
.input_detail dl dd textarea {
	padding:15px 10px;
	width:90%;
	border-radius:5px;
	border:solid 1px #ddd;
}
.input_detail .postal input {
	width:30%;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.input_detail dl {
	width:100%;
	overflow:hidden;
	margin-top:20px;
	border-bottom:solid 1px #ddd;
}
.input_detail dl dt {
	float:none;
	border-top:solid 1px #ddd;
	width:100%;
	padding:10px 0 0 0;
}
.input_detail dl dd {
	border-top:solid 0px #ddd;
	width:100%;
	padding:5px 0 10px 0;
	margin:0;
}
.input_detail dl dd input ,
.input_detail dl dd textarea {
	padding:15px 10px;
	width:100%;
	border-radius:5px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
}	/* for SP max-width: 736px */


/*===============================================================
	
	trial_outline
	
===============================================================*/
.trial_outline {
}
.trial_outline .bnr {
	border:solid 2px #00bcd5;
	border-radius:5px;
	overflow:hidden;
}
.trial_outline .bnr img {
	width:100%;
	height:auto;
}
.trial_outline h3 {
	margin-top:30px;
	font-size:20px;
	line-height:30px;
}
.trial_outline p {
	margin-top:10px;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.trial_outline h3 {
	margin-top:20px;
	font-size:16px;
	line-height:25px;
}
.trial_outline h3 br {
	display:none;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	rule_guide
	
===============================================================*/
.rule_guide {
	background:#f1f0ef;
	height:300px;
	overflow:auto;
}
.rule_guide .inner {
	padding:30px;
}
.rule_guide h3 {
	font-size:20px;
	line-height:25px;
	border-bottom:solid 1px #ddd;
	padding-bottom:15px;
	margin-top:30px;
}
.rule_guide h3:first-child{
	margin-top:0;
}
.rule_guide p {
	margin-top:20px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

.rule_guide .inner {
	padding:10px;
}
.rule_guide h3 {
	font-size:14px;
	line-height:20px;
	border-bottom:solid 1px #ddd;
	padding-bottom:5px;
	margin-top:20px;
}
.rule_guide h3:first-child{
	margin-top:0;
}
.rule_guide p {
	margin-top:10px;
	font-size:12px;
	line-height:16px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	submit	
-------------------------------------------------------------*/
.submit {
	text-align:center;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.submit {
	text-align:left;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	mainvisual
	
===============================================================*/
.mainvisual {
	width:100%;
	/*height:600px;*/
	position:relative;
	overflow:hidden;
}
.mainvisual .video {
	position:absolute;
	top:0;
	left:0;
}
.mainvisual .video iframe {
	background:#000;
}
.mainvisual .content_wrp {
	position:absolute;
	top:0;
	left:0;
}
#youtubePlayer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    margin-top: -6%;
    z-index: -1;
}
.mainvisual_sp {
	display:none;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
.mainvisual {
	width:100%;
	position:relative;
	overflow:show;
}
.mainvisual .video {
	display:none;
}
.mainvisual_sp {
	display:block;
}
.mainvisual .content_wrp {
	position:static;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.mainvisual .content
-------------------------------------------------------------*/
.mainvisual .content {
	width:100%;
	margin:0 auto;
	text-align:center;
}
.mainvisual .content h3 {
	color:#fff;
	font-size:40px;
	line-height:40px;
	width:100%;
	position:absolute;
	top:37%;
	left:0;
}
.mainvisual .content p {
	color:#fff;
	font-size:25px;
	line-height:30px;
	font-weight:bold;
}
.mainvisual .content p span {
	display:block;
	font-size:14px;
	line-height:20px;
}
.mainvisual .content a {
	display:block;
	padding:15px 0;
	border:solid 5px #fff;
	border-radius:50px;
	width:24.28%;
	color:#fff;
	position:absolute;
	top:51.61%;
	left:37.85%;
	text-decoration:none;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.mainvisual .content {
	width:100%;
}
.mainvisual .content h3 {
	font-size:30px;
	line-height:30px;	
}
.mainvisual .content p {
	line-height:30px;
}

.mainvisual .content {
	padding:30px 0;
	background:url(../images/bg_wood.jpg) repeat center top;
	background-size:512px 225px;
}
.mainvisual .content h3 {
	color:#fff;
	font-size:30px;
	line-height:30px;
	width:100%;
	position:static;
}
.mainvisual .content p {
	color:#fff;
	font-size:25px;
	line-height:30px;
	font-weight:bold;
}
.mainvisual .content p span {
	display:block;
	font-size:14px;
	line-height:20px;
}
.mainvisual .content a {
	display:block;
	padding:20px 0;
	border:solid 5px #fff;
	border-radius:50px;
	width:350px;
	margin:0 auto;
	margin-top:20px;
	color:#fff;
	position:static;

	text-decoration:none;
}


}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.mainvisual .content {
	padding:15px 0;
	background:url(../images/bg_wood.jpg) repeat center top;
	background-size:512px 225px;
}
.mainvisual .content h3 {
	color:#fff;
	font-size:15px;
	line-height:20px;
	width:100%;
	position:static;
}
.mainvisual .content p {
	color:#fff;
	font-size:15px;
	line-height:20px;
	font-weight:bold;
}
.mainvisual .content p span {
	display:block;
	font-size:14px;
	line-height:20px;
}
.mainvisual .content a {
	display:block;
	padding:15px 0;
	border:solid 5px #fff;
	border-radius:50px;
	width:300px;
	margin:0 auto;
	margin-top:10px;
	color:#fff;
	position:static;

	text-decoration:none;
}

}	/* for SP max-width: 736px */

/*===============================================================
	
	sidebnr
	
===============================================================*/
.sidebnr {
	width:100%;
	overflow:hidden;
}
.sidebnr img {
	width:100%;
	height:auto;
}
.sidebnr a {
	display:block;
	position:absolute;
	right:-5px;
	/*top:210px;*/
	/*bottom:165px;*/
	width:150px;
	height:150px;
	z-index:1000;
	position:fixed;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
	background-image:url(../images/side_cp_bnr.png);
	background-repeat:no-repeat;
	background-position:0 0;
	background-size:150px 150px;
}
#sidebnr a:hover {
	background-image:url(../images/side_cp_bnr_on.png);
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
#sidebnr a {
	right:0px;
	bottom:auto;
	width:110px;
	height:105px;
	background:url(../images/side_cp_bnr.png) no-repeat 0 0;
	background-size:110px 110px;
}
#sidebnr a:hover {
	background:url(../images/side_cp_bnr_on.png) no-repeat 0 0;
	background-size:110px 110px;
}

}	/* for SP max-width: 736px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	snsbtns
	
===============================================================*/
.snsbtns {
	padding:10px 0;
}
.snsbtns ul {
	float:right;
}
.snsbtns ul li {
	float:left;
	margin-right:10px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.snsbtns {
	padding:10px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	bg
	
===============================================================*/
.bg_gray_tile {
	background:url(../images/bg_gray_tile.jpg) repeat top center;
}
.bg_gray_noize {
	background:url(../images/bg_graynoize.gif) repeat top center;
}
.bg_wood {
	background:url(../images/bg_wood.jpg) repeat top center;
}
.bg_pink {
	background-color:#000;
}
.bg_pink {	background-color:#ec417b; }
.bg_deeppink {	background-color:#ec407a; }
.bg_tryblue {	background-color:#00bcd5; }
.bg_green {	background-color:#8cc34b; }
.bg_yellow {	background-color:#ffc928; }
.bg_blue {	background-color:#00b0ff; }
.bg_deepyellow {	background-color:#ff9f00; }
.bg_orange {	background-color:#ff5253; }
.bg_black {	background-color:#000; }

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.bg_wood {
	background:url(../images/bg_wood.jpg) repeat top center;
	background-size:512px 225px;
}
}	/* for SP max-width: 736px */




/*===============================================================
	
	usecase
	
===============================================================*/
.usecase {
}
.usecase_header {
	border-top:solid 1px #ddd;
}

.usecase .section_inner {
	padding:50px 0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.usecase .section_inner {
	padding:20px 0;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.usecase .headline
-------------------------------------------------------------*/
.usecase .headline {
	text-align:center;
}
.usecase .headline p {
	font-size:14px;
	line-height:20px;
	margin-top:20px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.usecase .headline {
	padding:0;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.usecase .case	
-------------------------------------------------------------*/
.usecase .case {
}
.usecase .case .subhead {
	text-align:center;
}
.usecase .case .subhead .icon {
	width:200px;
	margin:0 auto;
}
.usecase .case .subhead .icon img {
	width:100%;
	height:auto;
}
.usecase .beauty .subhead {
	margin-top:20px;
}
.usecase .case .subhead h3 {
	margin-top:15px;
}
.usecase .beauty .subhead h3 {
	color:#ec417b;
}
.usecase .health .subhead h3 {
	color:#8cc34b;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.usecase .beauty .subhead {
	margin-top:0px;
}
.usecase .case .subhead h3 {
	margin-top:5px;
}
.usecase .health .icon {
	padding-top:20px;
}
}	/* for SP max-width: 736px */


/*-------------------------------------------------------------
	caselist	
-------------------------------------------------------------*/
.caselist {
}
.caselist ul {
	padding-top:20px;
	text-align:center;
}
.caselist li {
	font-size:18px;
	line-height:30px;
	background:#ec417b;
	border-radius:17px;
	color:#fff;
	padding:2px 20px;
	margin:0 5px;
	margin-top:10px;
	display:inline-block;
}

.health .caselist li {
	background:#8cc34b;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.caselist ul {
	padding-top:10px;
	text-align:center;
}
.caselist li {
	font-size:14px;
	line-height:25px;
	background:#ec417b;
	border-radius:13px;
	color:#fff;
	padding:2px 10px;
	margin:0 2px;
	margin-top:5px;
	display:inline-block;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	about
	
===============================================================*/
.about {
	color:#fff;
	text-align:center;
}
.about .headline h3 {
	font-size:50px;
	line-height:50px;
}
.about .headline p {
	font-size:20px;
	line-height:30px;
	font-weight:bold;
	margin-top:20px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.about .headline h3 {
	font-size:30px;
	line-height:30px;
}
.about .headline p {
	font-size:16px;
	line-height:20px;
	margin-top:15px;
}
.about .headline p br {
	display:none;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	concept	
-------------------------------------------------------------*/
.concept {
}
.concept .grid {
	float:left;
	width:33.33%;
	margin-top:50px;
}
.concept .circle {
	width:160px;
	height:160px;
	border:solid 3px #fff;
	border-radius:50%;
	margin:0 auto;
}
.concept .circle h4 {
	font-size:20px;
	font-weight:bold;
	padding-top:55px;
}
.concept .cost h4 {
	padding-top:70px;
}
.concept p {
	margin-top:20px;
	line-height:20px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.concept .grid {
	float:none;
	width:100%;
	margin-top:30px;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	download
	
===============================================================*/
.download {
}
.download .content {
	width:800px;
	margin:0 auto;
	padding:30px 0;
}
.download .content h3 {
	font-size:20px;
	line-height:50px;
	float:left;
}
.download .content .btn {
	width:200px;
	float:right;
}
.download .content .btn img {
	width:100%;
	height:auto;
}

/* タブレット以下 */
@media screen and (max-width: 800px) {
.download .content {
	width:100%;
	margin:0 auto;
	padding:20px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.download .content h3 {
	font-size:10px;
	line-height:15px;
	float:none;
	text-align:center;
}
.download .content .btn {
	width:200px;
	margin:0 auto;
	float:none;
	margin-top:10px;
}
.download .content .btn img {
	width:100%;
	height:auto;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	sprit
	
===============================================================*/
.sprit {
	background:#000;
}
.sprit .content {
	float:left;
	width:50%;
	text-align:center;
	padding:0;
}
.sprit .content .inner {
	padding:60px;
}
.sprit .content h3 {
	color:#fff;
}
.sprit .content .img {
	margin-top:20px;
}
.sprit .content .img img {
	width:100%;
	height:auto;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.sprit .content {
	float:none;
	width:100%;
	text-align:center;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.sprit .content .inner {
	padding:20px;
}
.sprit .content .img {
	margin-top:10px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	watch_movie	
-------------------------------------------------------------*/
.watch_movie {
}
.watch_movie .youtube {
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	watch_feature	
-------------------------------------------------------------*/
.watch_feature {
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	function
	
===============================================================*/
.function {
	color:#fff;
}
.function .function_inner {
	padding:60px;
}
.function .headline {
	text-align:center;
}
.function .content {
	width:100%;
	border:solid 1px #fff;
	margin-top:30px;
	padding:0;
	background:url(../images/function_bg.gif) repeat-y top center;
}
.function .grid {
	width:50%;
	float:left;
}
.function .grid .img {
	background:#fff;
	padding:40px 0;
}

.function .grid .txt {
	padding:30px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.function .function_inner {
	padding:20px;
}
.function .headline {
	padding:0;
}
.function .content {
	margin-top:20px;
	padding:0;
	background:none;
}
.function .grid {
	width:100%;
	float:none;
	margin:0;
}
.function .grid .img {
	background:#fff;
	padding:10px 0;
}

.function .grid .txt {
	padding:20px;
}

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.function .grid .txt
-------------------------------------------------------------*/
.function .grid .txt h3 {
	font-size:20px;
	line-height:30px;
}
.function .grid .txt p {
	font-size:14px;
	line-height:25px;
	margin-top:15px;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.function .grid .txt h3 {
	font-size:16px;
	line-height:22px;
}
.function .grid .txt p {
	font-size:12px;
	line-height:20px;
	margin-top:10px;
}

}	/* for SP max-width: 736px */

/*===============================================================
	
	entryoffer
	
===============================================================*/
.entryoffer {
	padding:80px 0;
}
.entryoffer .plans {
	background:#fff;
	border:solid 5px #ffc928;
	text-align:center;
	padding:40px;
}
.entryoffer .plans  p {
	margin-top:20px;
}
.entryoffer .plans .title p {
	margin-top:10px;
}
.entryoffer .plans .gridconatiner {
	margin-top:30px;
}
.entryoffer .plans .plan p {
	margin-top:0;
}
.entryoffer .content {
	padding-bottom:30px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.entryoffer {
	padding:20px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.entryoffer .plans {
	border:solid 5px #ffc928;
	padding:20px;
}
.entryoffer .plans  p {
	margin-top:10px;
}
.entryoffer .plans .title p {
	margin-top:10px;
}
.entryoffer .plans .gridconatiner {
	margin-top:0;
}
.entryoffer .plans .grid {
	margin-top:10px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	btns	
-------------------------------------------------------------*/
.section .btns {
	width:700px;
	padding:0;
}
.btns .btn_detail {
	width:100%;
	margin-top:0;
}
.btns .grid {
	margin-top:0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.section .btns {
	width:100%;
	padding:0;
}
.btns .btn_detail_pink {
	margin-top:10px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.linkarea	
-------------------------------------------------------------*/
.linkarea {
	/*cursor:pointer;*/
	cursor:default;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	slider
	
===============================================================*/
.slider {
	width:100%;
	width:100%;
	position:relative;
	padding:0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */
/*-------------------------------------------------------------
	pager	
-------------------------------------------------------------*/
#owl .owl-controls {
	display:none;
}
.owl-controls {
	/*display:none;*/
}
.slider .pager a {
	display:block;
	position:absolute;
	width:50px;
	height:100%;
	top:0;
	z-index:50;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
	background-image:url(../images/slider_arw-1.png);
	background-repeat:no-repeat;
	background-position:center center;
}


.slider .next a {
	right:0;
	background-image:url(../images/slider_arw-2.png);
}
.slider .prev a {
	left:0;
}
/* PC向けレイアウトの指定：640px～ */
@media only screen and (min-width: 737px) {

}
/* SP向けレイアウトの指定：～640px */
@media only screen and (max-width: 736px) {
.owl-carousel {
	width:100%;
	margin:auto;
}
}


/*-------------------------------------------------------------
	.owl-controls
-------------------------------------------------------------*/

.owl-theme .owl-controls {
    margin-top: 10px;
    text-align: center;
    -webkit-tap-highlight-color: transparent
}
.owl-theme .owl-controls .owl-nav [class*=owl-] {
    color: #fff;
    font-size: 14px;
    margin: 5px;
    padding: 4px 7px;
    background: #d6d6d6;
    display: inline-block;
    cursor: pointer;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px
}
.owl-theme .owl-controls .owl-nav [class*=owl-]:hover {
    background: #869791;
    color: #fff;
    text-decoration: none
}
.owl-theme .owl-controls .owl-nav .disabled {
    opacity: .5;
    cursor: default
}
.owl-theme .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
    *display: inline
}
.owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #d6d6d6;
    display: block;
    -webkit-backface-visibility: visible;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    -o-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px
}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #ec417b
}
.owl-nav {
	display:none;
}
/* PC向けレイアウトの指定：640px～ */
@media only screen and (min-width: 737px) {

}
/* SP向けレイアウトの指定：～640px */
@media only screen and (max-width: 736px) {
.owl-nav {
	/*display:block;*/
}
}

/*===============================================================
	
	.feature
	
===============================================================*/

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.feature .wrapper {
	overflow:hidden;
}

.feature .function {
	margin-bottom:30px;
}
.feature .function.bg_deepyellow {
	margin-bottom:0;
}
}	/* for SP max-width: 736px */



/*===============================================================
	
	feature_visual
	
===============================================================*/
.feature_visual {
	position:relative;
	width:100%;
	height:560px;
	background:url(../images/feature_visual.jpg) no-repeat top center;
	background-size:cover;
}
.feature_visual h3 {
	font-size:30px;
	line-height:40px;
	text-align:center;
	width:100%;
	color:#fff;
	font-weight:bold;
	padding-top:140px;
}
.feature_visual h3 strong {
	font-size:40px;
	display:block;
	font-weight:bold;
	padding-top:10px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {
.feature_visual h3 {
	font-size:30px;
	line-height:40px;
	text-align:center;
	width:100%;
	color:#fff;
	font-weight:bold;
	padding-top:140px;
}
.feature_visual h3 strong {
	font-size:35px;
	display:block;
	font-weight:bold;
	padding-top:5px;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.feature_visual {
	position:relative;
	width:100%;
	height:auto;
	background:none;
}
.feature_visual h3,
.feature_visual h3 strong {
	display:none;
}
.feature_visual .sp img {
	width:100%;
	height:auto;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.feature_visual .link	
-------------------------------------------------------------*/
.feature_visual .link {
	width:700px;
	margin:0 auto;
	margin-top:20px;
}
.feature_visual .link ul { width:102.857%; }
.feature_visual .link li { 
	width:22.222%; margin-right:2.778%;
	float:left;
}
.feature_visual .link li a {
	display:block;
	width:160px;
	height:160px;
	border-radius:50%;
	background-image:url(../images/feature_visual_link_arw.png);
	background-repeat:no-repeat;
	background-position:top center;
	background-color:#000;	
	color:#fff;
	font-size:14px;
	line-height:20px;
	text-align:center;
	text-decoration:none;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
}
.feature_visual .link li a span {
	font-size:50px;
	line-height:50px;
	font-weight:bold;
	padding-top:40px;
	padding-bottom:10px;
	display:block;
}
.feature_visual .link li.link_pink a { background-color:#ec417b }
.feature_visual .link li.link_tryblue a { background-color:#00bcd5 }
.feature_visual .link li.link_green a { background-color:#8cc34b }
.feature_visual .link li.link_yellow a { background-color:#ffc928 }
.feature_visual .link li.link_blue a { background-color:#00b0ff }
.feature_visual .link li.link_deepyellow a { background-color:#ff9f00 }
.feature_visual .link li.link_orange a { background-color:#ff5253 }
.feature_visual .link li.link_pink a:hover { background-color:#ff5e95 }
.feature_visual .link li.link_tryblue a:hover { background-color:#00e1ff }
.feature_visual .link li.link_green a:hover { background-color:#a1e94d }
.feature_visual .link li.link_yellow a:hover { background-color:#ffe328 }
.feature_visual .link li.link_blue a:hover { background-color:#00e4ff }
.feature_visual .link li.link_deepyellow a:hover { background-color:#ffcc00 }
.feature_visual .link li.link_orange a:hover { background-color:#ff8352 }

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.feature_visual .link {
	width:100%;
	margin:0 auto;
	margin-top:0;
}
.feature_visual .link ul { width:100%; }
.feature_visual .link li { 
	width:25%; margin-right:0%;
	float:left;
}
.feature_visual .link li a {
	display:block;
	width:100%;
	height:auto;
	padding:10px 0 15px 0;
	border-radius:0;
	background-image:url(../images/feature_visual_link_arw-sp.png);
	background-repeat:no-repeat;
	background-position:bottom center;
	background-size:11px 12px;
	color:#fff;
	font-size:12px;
	line-height:20px;
	text-align:center;
	text-decoration:none;
	box-shadow: 0 0 0 rgba(0, 0, 0, 0);
	-moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
	-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
.feature_visual .link li a span {
	font-size:10px;
	line-height:15px;
	padding-top:0;
	padding-bottom:0;
}

}	/* for SP max-width: 736px */

/*===============================================================
	
	feature_section
	
===============================================================*/
.feature_section {
}
.feature_section .section_inner {
	width:100%;
	padding:0;
}
.feature_section .delay {
	padding:80px;
}
.feature_section .content {
	width:100%;
}
.feature_section .txt {
	width:33.87%;
}
.feature_section .photo {
	width:60.48%;
}
.feature_section .left {
	float:left;
}
.feature_section .right {
	float:right;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.feature_section .txt,
.feature_section .photo {
	width:100%;
}
.feature_section .photo {
	margin-top:20px;
}
.feature_section .left,
.feature_section .right {
	float:none;
}
.feature_section .delay {
	padding:20px;
	padding-top:0;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	feature_section .headline	
-------------------------------------------------------------*/
.feature_section .headline {
}
.feature_section .headline h3 {
	font-size:50px;
	font-weight:normal;
	margin-left:-20px;
}
.feature_section .headline h3 span {
	background:#000;
	display:inline-block;
	height:100px;
	width:100px;
	line-height:100px;
	color:#fff;
	text-align:center;
	border-radius:50%;
	margin-right:15px;
	font-weight:bold;
}

.feature_section_pink .headline h3 { color:#ec417b }
.feature_section_tryblue .headline h3 { color:#00bcd5 }
.feature_section_green .headline h3 { color:#8cc34b }
.feature_section_yellow .headline h3 { color:#ffc928 }
.feature_section_blue .headline h3 { color:#00b0ff }
.feature_section_deepyellow .headline h3 { color:#ff9f00 }
.feature_section_orange .headline h3 { color:#ff5253 }
.feature_section_pink .headline h3 { color:# }

.feature_section_pink .headline h3 span { background:#ec417b }
.feature_section_tryblue .headline h3 span { background:#00bcd5 }
.feature_section_green .headline h3 span { background:#8cc34b }
.feature_section_yellow .headline h3 span { background:#ffc928 }
.feature_section_blue .headline h3 span { background:#00b0ff }
.feature_section_deepyellow .headline h3 span { background:#ff9f00 }
.feature_section_orange .headline h3 span { background:#ff5253 }
.feature_section_pink .headline h3 span { background:# }


/* タブレット以下 */
@media screen and (max-width: 1400px) {
.feature_section .headline h3 {
	font-size:40px;
	font-weight:normal;
	margin-left:-20px;
}
.feature_section .headline h3 span {
	display:inline-block;
	height:80px;
	width:80px;
	line-height:80px;
}
}	/* for tablet max-width: 1400px */

/* タブレット以下 */
@media screen and (max-width: 1200px) {
.feature_section .headline h3 {
	font-size:30px;
	font-weight:normal;
	margin-left:-20px;
}
.feature_section .headline h3 span {
	display:inline-block;
	height:60px;
	width:60px;
	line-height:60px;
}
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.feature_section .headline {
	padding:0;
}
.feature_section .headline h3 {
	font-size:20px;
	line-height:50px;
	font-weight:normal;
	margin-left:0x;
	text-align:left;
	background:#000;
	margin: 0 -500%;
	padding: 0 500%;
	color:#fff;
}
.feature_section .headline h3 span {
	display:inline;
	height:auto;
	width:auto;
	line-height:50px;
	color:#fff;
	text-align:left;
	border-radius:0;
	margin-right:0;
	font-weight:bold;
	padding-right:5px;
}
.feature_section_pink .headline h3 { background:#ec417b }
.feature_section_tryblue .headline h3 { background:#00bcd5 }
.feature_section_green .headline h3 { background:#8cc34b }
.feature_section_yellow .headline h3 { background:#ffc928 }
.feature_section_blue .headline h3 { background:#00b0ff }
.feature_section_deepyellow .headline h3 { background:#ff9f00 }
.feature_section_orange .headline h3 { background:#ff5253 }
.feature_section_pink .headline h3 { background:# }
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.feature_section .content	
-------------------------------------------------------------*/
.feature_section .content {
}
.feature_section .content h4 {
	font-weight:bold;
	font-size:20px;
	margin-top:30px;
}
.feature_section .content p {
	font-size:16px;
	line-height:28px;
	margin-top:15px;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.feature_section .content h4 {
	font-weight:bold;
	font-size:16px;
	margin-top:20px;
}
.feature_section .content p {
	font-size:14px;
	line-height:22px;
	margin-top:15px;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	trial_offer
	
===============================================================*/
.trial_offer {
}
.trial_offer .section_inner {
	padding:60px 0;
}
.trial_offer .headline {
	text-align:center;
	color:#fff;
}
.trial_offer .content {
	margin-top:30px;
	padding:0;
}
.trial_offer .content .cap {
	color:#fff;
	font-size:14px;
	line-height:20px;
	margin-top:10px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.trial_offer .section_inner {
	padding:20px 0;
}
.trial_offer .headline {
	padding:0;
	margin:0;
}
.trial_offer .content {
	margin-top:20px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.trial_offer .card
-------------------------------------------------------------*/
.trial_offer .card {
	background:#fff;
	box-shadow:2px 2px 2px rgba(0,0,0,0.2);
	text-align:center;
	padding:20px;
}
.trial_offer .card h4 {
	font-size:20px;
	line-height:25px;
	color:#ec417b;
}
.trial_offer .card p {
	font-size:18px;
	line-height:25px;
	color:#666;
}
.trial_offer .card .btn_detail {
	margin-top:20px;
}
.trial_offer .card .btn_detail a {
	border-radius:5px;
}
.trial_offer .card .btn_detail_tryblue a {
	background-image:none;
	font-size:18px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*===============================================================
	
	planlist
	
===============================================================*/
.planlist {
}
.planlist .headline {
	text-align:center;
}
.planlist .content {
	margin-top:50px;
	padding:0;
}
.planlist .btn_detail {
	margin-top:60px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {
}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.planlist .headline {
	margin:0;
	padding:0;
}
.planlist .content {
	margin-top:20px;
	padding:0;
}
.planlist .btn_detail {
	margin-top:20px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.planlist .plan	
-------------------------------------------------------------*/
.planlist .plantype	{
	box-shadow:0px 0px 5px rgba(0,0,0,0.2);
	padding:10px;
	background:#fff;
}
.planlist .plan_detail h4 {
	margin-top:50px;
	border-bottom:solid 1px #ddd;
	padding-bottom:10px;
}
.planlist .plan_detail .plan_function ul {
	padding-top:10px;
}
.planlist .plan_detail .plan_function li {
	padding:10px;
	text-align:center;
	margin-top:10px;
	font-weight:bold;
	font-size:18px;
	background:url(../images/bg_plan_standerd.gif) repeat;
	color:#4b7d26;
	border:solid 2px #dee8ce;
}
.planlist .cloud .plan_function li {
	background:url(../images/bg_plan_cloud.gif) repeat;
	color:#6b7a80;
	border:solid 2px #ddd;
}
.planlist .plan_detail .plan_function li.none {
	opacity:0.5;
	background:#fff;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.planlist .plan_detail h4 {
	margin-top:20px;
}
.planlist .plan_detail .plan_function ul {
	padding-top:0px;
}
.planlist .plan_detail .plan_function li {
	padding:10px;
	font-size:14px;
}
.planlist .cloud {
	margin-top:20px;
	border-top:solid 1px #ddd;
	padding-top:20px;
	
}
/*	2015/10/26  */
.planlist .plan_detail .plan_function li.none {
	display:none;
}

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.planlist .plantype	.plan
-------------------------------------------------------------*/
.planlist .plantype	.plan {
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.planlist .plantype	.plan .inner {
	background-image:url(../images/sp-icon-plus.png);
	background-repeat:no-repeat;
	background-position:right center;
	background-size:20px 15px;
}
.planlist .active	.plan .inner {
	background-image:url(../images/sp-icon-minus.png);
}
.planlist .plan_function {
}

.planlist .plantype	.plan .more {
	background:#fff;
	line-height:30px;
	font-size:14px;
	text-align:center;
	border-radius:15px;
	width:8em;
	margin:0 auto;
	margin-top:5px;
}
.planlist .active	.plan .more {
	opacity:0.5;
}

}	/* for SP max-width: 736px */

/*===============================================================
	
	support_plan
	
===============================================================*/
.support_plan {
}
.support_plan .section_inner {
	padding:60px 0;
}
.support_plan .headline {
	color:#fff;
	text-align:center;
}
.support_plan .headline p {
	margin-top:20px;
	font-size:20px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.support_plan .section_inner {
	padding:20px 0;
}
.support_plan .headline {
	margin:0;
	padding:0;
}
.support_plan .headline p {
	margin-top:10px;
	font-size:14px;
	text-align:left;
}
.support_plan .headline p br {
	display:none;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.support_plan .grid
-------------------------------------------------------------*/
.support_plan .grid h3 {
	box-shadow:0 0 5px rgba(0,0,0,0.2);
	padding:10px;
	background:#fff;
	margin-top:30px;
}
.support_plan .grid h3 img {
	width:100%;
	height:auto;
}
.support_plan .grid p {
	margin-top:10px;
	color:#fff;
	line-height:20px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.support_plan .grid {
	margin-top:0;
}
.support_plan .grid h3 {
	margin-top:20px;
}
}	/* for SP max-width: 736px */

/*===============================================================
	
	option_item
	
===============================================================*/
.option_item {
	border-bottom:solid 1px #ddd;
}
.option_item .headline {
	text-align:center;
}
.option_item .content {
	margin-top:30px;
}
.option_item .content h3 {
	text-align:center;
	margin-top:60px;
	font-size:25px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

.option_item .headline {
	margin:0;
	padding:0;
}
.option_item .content {
	margin-top:20px;
}
.option_item .content h3 {
	margin-top:30px;
	font-size:20px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.option_item	
-------------------------------------------------------------*/
.option_item .img {
	border:solid 5px #ec417b;
	padding:10px 30px;
}
.option_item .img img {
	width:100%;
	height:auto;
}
.option_item .set h4 {
	font-weight:bold;
	margin-top:20px;
}
.option_item .set p {
	margin-top:10px;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.option_item .img {
	padding:10px 30px;
}
.option_item .set h4 {
	font-size:16px;
}
.option_item .set p {
	margin-top:5px;
	line-height:20px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.option_item .content
-------------------------------------------------------------*/
.option_item .content .gridconatiner {
	margin-top:40px;
}
.option_item .content .grid .fit {
	box-shadow:0 0 5px rgba(0,0,0,0.2);
}
.option_item .content .grid h4 {
	font-size:16px;
	line-height:20px;
	margin-top:20px;
	font-weight:bold;
}
.option_item .content .grid p {
	margin-top:5px;
}
.option_item .btn_detail {
	margin-top:60px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.option_item .content .gridconatiner {
	margin-top:20px;
}

.option_item .content .grid h4 {
	margin-top:15px;
}
.option_item .content .grid p {
	margin-top:0px;
}
.option_item .btn_detail {
	margin-top:20px;
}
}	/* for SP max-width: 736px */
/*===============================================================
	
	voice_list
	
===============================================================*/
.voice_list {
	border-bottom:solid 1px #ddd;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	voice_list	
-------------------------------------------------------------*/
.voice_list .gridconatiner {
	margin-top:-50px;
}
.voice_list .grid {
	margin-top:50px;
}
.voice_list .grid h3 {
	font-size:14px;
	line-height:20px;
	font-weight:normal;
	margin-top:10px;
	color:#666;
}
.voice_list .grid strong {
	font-size:14px;
	line-height:20px;
	font-weight:bold;
	margin-top:5px;
	display:block;
}
.voice_list .grid p {
	font-size:14px;
	line-height:20px;
	margin-top:0;
}
.voice_list .grid a {
	text-decoration:none;
	color:#333;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_list .gridconatiner {
	margin-top:-30px;
}
.voice_list .grid {
	margin-top:30px;
}
}	/* for SP max-width: 736px */
/*===============================================================
	
	voice_detail
	
===============================================================*/
.voice_detail {
	border-bottom:solid 1px #ddd;
}
.voice_detail .headline h3 {
	position:relative;
}
.voice_detail .headline h3 span {
	position:absolute;
	bottom:30px;
	left:30px;
	font-weight:bold;
	color:#fff;
	text-shadow:3px 3px 3px rgba(0,0,0,0.2);
}


.voice_detail .headline h4 {
	font-weight:bold;
	margin-top:20px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_detail .headline {
	margin:0;
	padding:0;
}
.voice_detail .headline h3 {
	position:relative;
	background:#ec417b;
}
.voice_detail .headline h3 span {
	position:static;
	bottom:0;
	left:0;
	padding:10px;
	display:block;
	text-shadow:0 0 0 rgba(0,0,0,0);
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.voice_detail .column
-------------------------------------------------------------*/
.voice_detail .column {
}
.voice_detail .column h3 {
	margin-top:100px;
	line-height:1.4;
}
.voice_detail .column h3:first-child {
	margin-top:60px;
}

.voice_detail .column .cf {
	margin-top:30px;
}
.voice_detail .column .txt {
	width:62.5%;
}
.voice_detail .column .phs {
	width:32.5%;
}


/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_detail .column h3,
.voice_detail .column h3:first-child {
	margin-top:30px;
}


.voice_detail .column .cf {
	margin-top:20px;
}
.voice_detail .column .txt,
.voice_detail .column .phs {
	width:100%;
	float:none;
	overflow:hidden;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.voice_detail .column .txt
-------------------------------------------------------------*/
.voice_detail .column .txt {
}
.voice_detail .column .txt p {
	margin-top:20px;
}
.voice_detail .column .txt p:first-child {
	margin-top:0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.voice_detail .column .phs
-------------------------------------------------------------*/
.voice_detail .column .phs li img {
	width:100%;
	height:auto;
}
.voice_detail .column .phs li {
	margin-top:20px;
}
.voice_detail .column .phs li:first-child {
	margin-top:0;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_detail .column .phs ul {
	width:103.226%;
}
.voice_detail .column .phs li {
	float:left;
	width:46.875%; margin-right:3.125%;
	margin-top:20px;
}
.voice_detail .column .phs li:first-child {
	margin-top:20px;
}
.voice_detail .column .phs li:nth-child(2n+1) {
	clear:both;
}


}	/* for SP max-width: 736px */
/*===============================================================
	
	shopinfo
	
===============================================================*/
.voice_detail .shopinfo {
	margin-top:80px;
	padding-bottom:20px;
}
.voice_detail .shopinfo .inner {
	border:solid 1px #ddd;
	padding:40px;
}
.voice_detail .shopinfo h3 {
	text-align:center;
	color:#666;
	font-size:20px;
	line-height:25px;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_detail .shopinfo {
	margin-top:30px;
	padding-bottom:20px;
}
.voice_detail .shopinfo .inner {
	padding:20px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	shopinfo	
-------------------------------------------------------------*/
.voice_detail .shopinfo .cf {
	margin-top:30px;
}
.voice_detail .shopinfo .information {
	width:41.66%;
}
.voice_detail .shopinfo .map {
	width:52.77%;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_detail .shopinfo .cf {
	margin-top:20px;
}
.voice_detail .shopinfo .information,
.voice_detail .shopinfo .map {
	width:100%;
}
.voice_detail .shopinfo .map {
	margin-top:20px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.voice_detail .shopinfo .information	
-------------------------------------------------------------*/
.voice_detail .shopinfo .information .logo img {
	width:100%;
	height:auto;
}
.voice_detail .shopinfo .information h4 {
	margin-top:20px;
	font-weight:bold;
	font-size:14px;
}
.voice_detail .shopinfo .information p {
	margin-top:20px;
}
/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {
.voice_detail .shopinfo .information p {
	margin-top:10px;
}
}	/* for SP max-width: 736px */

/*-------------------------------------------------------------
	.voice_detail .shopinfo .map
-------------------------------------------------------------*/
.voice_detail .shopinfo .map iframe {
	width:100%;
}

/* タブレット以下 */
@media screen and (max-width: 960px) {

}	/* for tablet max-width: 960px */

/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 736px) {

}	/* for SP max-width: 736px */



/*===============================================================
	
	2015/10/26
	クラウドプラン非表示CSS
	活性化する場合は下記の表記を削除してください。
===============================================================*/
.select_plan .gridconatiner .grid,
.entryoffer .plans .gridconatiner .grid,
.planlist .gridconatiner .grid {
	display:none;
}
.select_plan .gridconatiner .gridwrp_2,
.select_plan .gridconatiner .grid:first-child,
.planlist .gridconatiner .gridwrp_2,
.planlist .gridconatiner .grid:first-child,
.entryoffer .plans .gridconatiner .gridwrp_2,
.entryoffer .plans .gridconatiner .grid:first-child {
	display:block;
	width:100%; margin-right:0;
}
.planlist .plan_detail .plan_function li.none {
	display:none;
}
/*-------------------------------------------------------------
	クラウドプラン非表示CSS　ここまで
-------------------------------------------------------------*/


/*===============================================================
	
	2015/10/29
	クレジットカード支払い非表示CSS
	活性化する場合は下記の表記を削除してください。
===============================================================*/
.select_payment .grid {
	display:none;
}
.select_payment .grid:first-child {
	display:block;
	width:100%; margin-right:0;
}
/*-------------------------------------------------------------
	クレジットカード支払い非表示CSS　ここまで
-------------------------------------------------------------*/

/*===============================================================
	
	2015/11/18 S.Otsuki
	ロゴクリックできるように
===============================================================*/
p.logo:hover {
	cursor:pointer;
}