@charset "UTF-8";
.contents {
	width:100%;margin:0 auto;
}
.plan a:hover{
	text-decoration:underline
}

.plan p {
	font-size:14px;text-align:center
}

@media only screen and (min-width:0px) {
#headprint img{
	display:none}

#featureprint img {
	display:none}
	
#priceprint img {
	display:none}
	
#customiseprint img {
	display:none}
}

/* headimg */
.headimage {
	width:100%;
	max-height:496px;
	height:496px;
	max-width:100%;
	background-image:url(../img/topheadimage.jpg);
	background-size:cover;
	background-position:60% center;background-repeat:no-repeat}
	
	
#main-catch {
	width:100%;
	font-size:320%;
	line-height:2em;
	color:#fff;
	margin-left:0em;
	margin-top:0px;
	padding-top:120px;
	font-weight:700;
text-shadow: 1px 1px 3px #353239; text-align:center;}

#main-subcatch {
	font-size:150%;
	color:#fff;
	margin-left:30px;
	margin-top:50px;
}

#main-catch p {
	margin-left:2em}

.head-contact {
	width:162px;
	height:48px;
	color:#fff;
	background-color:#ff7841;
	border-radius:8px;
	margin-top:0px;
}

.head-buttons {
	width:100%;margin:0 auto;margin-top:3em;margin-left:15em}
	
.head-buttons img {
	margin-left:0em}
.head-contact a {
	display:block;
	color:#fff;
	line-height:48px;
	text-align:center;
	font-size:125%;font-weight:500
}

.head-buttonsarea {
	width:50%;margin:0 auto;margin-top:3em}
	
.head-contact a:hover {
	color:#fff;background-color:#F85512;border-radius:8px
}

.head-contact a:hover:active{
	color:#fff;;background-color:#F85512;border-radius:8px
}
#start {
	font-size:300%;
	color:#fff;
	margin-left:50px;
	padding-top:40px;
}

/**
 * News Widget
 */
 
 .upper-widget-area {
    width: 100%;
}

.xw-news {
 	width: 100%;
 	height: 55px;
 	color: white;
 	background-color: #353239;
}

.xw-news-container {
	width: 100%;
	height: 80%;
	max-width: 1000px;
	margin: auto;
}

.xw-news-content {
	position: relative;
	width: 100%;
	height: 90%;
	margin: auto;
	text-align: center;
	overflow: hidden;
}

.xw-news-item {
	position: absolute;
	font-size: 1.2em;
	width: 100%;
	margin-left: 100%;
}

.xw-news-item a{
	text-decoration: none;
	color: inherit;
	font-weight: bold;
	font-size: 1.5rem;
	line-height: 45px;
}

.ticker {
  margin: 0 auto;
  margin-top:0.3em;
  padding: 10px;
  width: 100%;
  text-align: left;
  position: relative
}

.ticker ul {
  width: 100%;
  position: relative;
}

.ticker ul li {
  width: 100%;
  display: none;
  text-align:center;
  color:#fff;
  font-weight:bold;
  font-size:17px;margin-top:0.2em;font-family:"ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif"
}

/* notice */

.notice-space {
	height:2em
}
.n-info {
	width:80%;
	padding:8px;
	border:2px solid #ccc;margin:0 auto;max-width:1200px;position:relative;margin-bottom:2em;border-radius:0px;margin-top:2em
}
.n-info h2 {
	font-size:20px;
	text-align:center;padding:8px;color:#000;margin-top:0em;text-decoration:underline;font-weight:500}
.n-info ul li {
	list-style:none;
	float:static;
}
.n-info dl {
	margin-bottom: 0;
}
.n-info dt {
	color:#ff7841;
	font-weight:bold;
	font-size:15px;
}
.n-info dt .date {
	margin:0 24px;
	color:#666;
	font-weight: normal;
	font-size: 14px;
}
.n-info dd {
	line-height:24px;
	font-size:14px;
	width:100%;
}
.n-info dd:not(:last-child) {
	margin-bottom: 1.5em;
}
.n-info dd a {
	color:#f60;
}
.n-info #term {
	margin: 0.75em 0;
}
.n-info #term th {
	font-weight: normal;
	padding: 0.25em 0.6em;
	border: 1px solid #818181;
	background: #F0F0F0;
}
.n-info #term td {
	padding: 0.25em 0.6em;
	border:1px solid #818181;
	border-left: none;
}
.n-info #term strong {
	margin-right: 0.25em;
}


/* about */
.about {
	background-color:#fff;
	width:100%;
	height:250px;text-align:center;max-width:1280px;margin:0 auto}
	
.about-info {
	width:70%;margin:0 auto}


.about-space {
	height:1em}
.about-left {
	width:100%;
	margin:0 auto}

.about-left img {
	width:60%;
	margin:0 auto;
	padding:1em}

.about-right {
	width:100%;
	margin:0 auto}

.about-text {
	width:100%;}

.about-text h2 {
	font-size:190%;
	color:#000;
	margin-top:0em;
}

.about-text p {
	font-size:16px;	line-height:2.4em;
	margin-top:1.8em;width:100%;text-align:justify;text-align:center}

/* features-page */

.function {
	width:90%;
	margin:0 auto}

.function-img  {
	width:100%	}
	



.signup-area {
	width:100%;height:350px;margin:0 auto;background-color:#F0F0F0}

.signup-area img{
	width:100%;height:1px;position:absolute}
.signup-title {
	width:100%;}

.signup-title h2 {
	font-size:210%;
	font-weight:300;
	text-align:center;}

.signup-title p {
	font-size:16px;
	font-weight:300;
	text-align:center;
	margin-top:1.7em}

.signup-title img {
	width:50%;
	margin:0 auto}

.button-area {
	width:80%;
	margin:0 auto}

.buttons {
	width:70%;
	background-color:#ff7841;
	float:left;position:relative;border-radius:25px;
	padding:0em;margin:0 auto;
	margin-left:5em;margin-top:1.5em;
	height:3em}

.buttons-text {
	width:100%;
	margin:0 auto}

.buttons-text h3 {
	font-size:24px;
	text-align:center;
	color:#fff;font-weight:400;margin-top:0.5em
	}



@media screen and (max-width: 768px) {
	.n-info #term {
		width: 100%;
	}
	
	.n-info #term th, td {
		display: block;
		width: 100%;
		text-align: center;
	}

	.n-info #term td {
		border-left: 1px solid #818181;
		border-top: none;
	} 
}





@media print, screen and (min-width: 321px) and (max-width: 768px) {
	.xw-news {
 		height: 50px;
 	}

	.xw-news-item a{
		font-weight: normal;
		line-height: 60px;
	}
}

@media print, screen and (min-width: 0px) and (max-width: 320px) {
	.icon-section {
		margin-top:2em}
	
	.xw-news {
 		height: 40px;
 	}

	.xw-news-item a{
		line-height: 40px;
		font-size: 0.8rem;
	}
	
	.buttons {
		width:80%;
		margin:1em auto}
		
	.buttons-text h3 {
	font-size:16px;
	text-align:center;
	color:#fff;font-weight:400;margin-top:0.5em
	}
	
	.button-area {
		margin:0 auto}
	
	.signup-area {
		width:100%;
		margin:0 auto;
		margin-top:3em}
		.testsection {
		height:auto}
	.testimonials {
		width:100%;
		margin-top:0em;height:auto}
	
	.testtitle {
		margin-top:-3em}
	.testimonials1 {
		display:none}
	
	.testdescription {
		height:24em;
		width:100%;
		margin:1em auto}
		
	.testdescription p {
		width:100%;
		font-size:12px}
	
	.testimage {
		height:auto}
	
	.readmore {
		text-align:center}
	
	.readmore p {
		text-align:center}
}

/*features */
.features {
	width:100%;height:400px;max-width:1280px;
	margin:0 auto;
	background-size:cover
	}

.featuresspace {
	height:2em}
	
.features-left {
	width:100%;height:568px;
	background-repeat:repeat;
	margin:0 auto;display:block;
	background-color:#EEEEEE;
	background-image:url(../img/features11.jpg);
	background-size:cover}

.features-button {
	width:30%;
	margin:0 auto;
	height:2.6em;
	background-color:#ff7841;
	margin-top:2em;
	border-radius:8px}

.features-button:hover {
	background-color:#FF4B02;
	}

.features-button p {
	font-size:20px;
	color:#fff;
	font-weight:400;
	text-align:center;
	padding:0.4em
	}
.features-title {
	width:52%;
	height:auto;
	margin:0 auto;
	margin-top:3em
	
	}

.features-head h2{
	color:#353239;
	font-size:24px;
	margin:0 auto;
	text-align:center;
	padding:1em;
	margin-top:1.8em}
	
	.features-line{
	background-image:url(../img/greylines.png);
	width:80%;
	height:1px;
	margin:0 auto;
	margin-top:0px}

.features h2 {
	color:#353239;
	font-size:16px;
	margin:0 auto;
	text-align:center;
	font-weight:normal;
	width:96%;
	line-height:1.6;
	padding:1em;
	}
	
#space1 {
	margin-top:1.4em}

#space2 {
	margin-top:2em}
	
#space4 {
	margin-top:2em}
#space5 {
	margin-top:2em}


#space3 {
	margin-top:1.2em}

.features-detail {
	width:100%;height:160px;margin:0 auto
	}

.features-detail img {
	width:25%;
	text-align:center;
	margin-top:1.7em;
	margin:0 auto}

.features-detail p {
	font-size:16px;
	color:#353239;
	font-weight:400;
	width:100%;
	text-align:center;
	margin:0 auto;
	margin-top:1.5em;
	padding:0.4em}

.extra {
	display:none;
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
	box-shadow:0px 0px 10px;
	border:1px #E5E5E5;
	border-radius:2px}

.extra p {
	font-size:13px;
	color:#484848;
	margin:0 auto;
	word-spacing:2px;
	text-align:justify;
	line-height:1.6em;font-weight:400;margin-top:-0.5em;
	width:90%
	}
	
.features-detail:hover .extra {
	background-color:#fff;
	display:inline-block;
	position:absolute;
	width:100%;
	height:150px;
	opacity:0.9
	}

/* scene */
.scene-color {
	background-color:#fff}
   .scene-section {
	   margin-top:1.4em;
	   background-color:#fff;
	   width:100%;
	   margin:0 auto}
	.scenes {
	width:100%;max-width:1280px;
	height:auto;
	margin:0 auto;background-color:#fff}
.scene1{
	width:100%;height:180px;margin:0 auto
	}

.scenetri-left {
	position:relative;
	float:left;
	width:100%}

.scenetri-left img{
	width:15%;}


.scenetri-right {
	position:relative;
	float:right;
	width:100%}

.scenetri-right img{
	width:15%;
	float:right;}


.scene2 {
	width:100%;background-color:#FFFFFF;height:180px;margin:0 auto}

.scene-img {
	width:100%;margin:0 auto;
	}
.scene-img img{
	width:100%;
	margin:0 auto;border-radius:5px;
	}
	
.scene-img1 {
	width:100%;margin:0 auto;
	}
.scene-img1 img{
	width:100%;
	margin:0 auto;border-radius:5px;
	}

.scene-title {
	width:100%;
	margin:0 auto}

.mid {
	width:80%;
	margin:0 auto;
	padding-top:2em;
	padding-bottom:2em}

.mid img {
	height:1px;width:100%}
	
	
.explain {
	height:auto;
	width:65%;
	margin:0 auto;margin-top:7.4em;}
.scene-title h3{
	font-size:22px;
	color:090909;
	font-weight:400;
	margin-top:3em}

.scene-info {
	width:100%;
	margin:0 auto;}
	
.scene-info p{
	font-size:16px;
	color:#3C3C3C;
	font-weight:400;
	word-spacing:normal;
	line-height:30px;margin:0 auto;}


/*price */
.price {
	width:100%;
/*	height:680px;*/
	height:750px;
	background-image:url(../img/pricebg1.jpg);
	background-size:cover;margin:0 auto}

.price-info {
	width:100%;
	margin:0 auto;max-width:1280px;}
.pricetitle {
	width:100%;
	margin:0 auto}

.pricetitle h2 {
	font-size:24px;
	color:#fff;
	font-weight:normal;
	margin:0 auto;
	text-align:center}
	
.pricebox {
	width:23%;
	margin:1%;
	border:2px #fff solid;
	height:410px;
	position:relative;
	float:left}

.priceimg {
	margin:0 auto;
	width:100%;
	margin-top:1.4em}

.priceimg img {
	width:40px;
	height:40px;
	margin:0 auto;
	text-align:center}

.plan{
	width:100%;
	margin:0 auto}

.plan h3{
	font-size:22px;
	font-weight:normal;
    color:#fff;
	margin-top:0.5em;
	text-align:center}
.planlimg {
	width:80%;
	margin:0 auto;
	}

.planarea {
	height:125px}
.planimg img{
	width:90%;
	height:1px;
	margin:0 auto}
	
.planinfo {
	width:90%;
	margin:0 auto;
	margin-top:0.5em;
	}
	
.planinfo p{
	font-size:16px;
	color:#fff;
	font-weight:400px;
	}
	
.planprice {
	width:100%;
	margin:0 auto}

.planprice p{
	font-size:27px;
	color:#FF9250;
	font-weight:500;
	text-align:center}

.planextra {
	width:100%;
	margin-bottom:0px;
	margin-top:-0.5em}

.planextra p {
	width:93%;
	font-size:13px;
	color:#fff;
	margin:0 auto;
	text-align:center}

.planbutton {
	width:200px;
	background-color:#ff7841;
	height:32px;
	margin:0 auto;
	margin-top:2em;
	border-radius:8px}

.planbutton:hover {
	background-color:#FF4B0E;
}

.planbutton p {
	font-weight:400;
	color:#fff;
	font-size:17px;
	text-align:center;
	margin:0 auto;
	padding:3px}


/* steps */
.steps{
	width:100%;
	height:480px;margin:0 auto;max-width:1280px}

.stepstitle {
	width:100%;
	margin:0 auto}
	
.stepstitle h2{
	font-size:24px;
	color:#000;
	font-weight:500;
	margin:0 auto;
	text-align:center}

.stepstitle h3 {
	font-size:16px;
	color:#3f3f3f;
	font-weight:normal;
	margin:0 auto;
	text-align:center;
	margin-top:16px}


.stepsarea {
	width:95%;
	margin:0 auto}
.stepscategory {
	width:20%;position:relative;float:left;border-radius:0px
	}

.stepstext {
	width:100%;height:30px;background-color:#ff7841}
.ws-stepstext{
	width:100%;height:30px;background-color:#002D47}

.stepstexts h3 {
	text-align:center;
	font-weight:500;
	font-size:18px;margin-top:0em;padding:0.4em;color:#fff
	}

.stepsarrow {
	width:6%;
	float:left;position:relative}

.stepsarrow img {
	margin-top:3.5em;
	width:70%}

.stepsimg {
	width:100%;
	margin:0 auto}

.stepsimg p {
	font-size:16px;
	color:#737373;
	font-weight:400;
	text-align:center;
	width:100%;
	margin:0 auto;
	margin-top:0.4em}
	
.stepsimg img {
	width:30%;
	margin:0 auto;
	margin-top:2em;
	margin-bottom:2em}

.stepsspace{
	height:3em}

	
.numbers p {
	text-align:center;
	color:#818181;
	font-weight:400;
	font-size:18px}

.numbers img {
	height:1px;
	width:100%
	}

.stepsinfo {
	width:95%;
	margin:0 auto;
	margin-top:1em}

.stepsinfo p {
	font-weight:400;
	color:#737373;
	font-size:14px;
	line-height:normal;}

/* customise */
.customise{
	width:100%;
	height:330px;
	background-color:#FFA37C;
	background-image: url(../img/customisebg.jpg);}

.customise-left{
	background-image:url(../img/customisebg.jpg);
	width:100%;
	height:330px;
	background-repeat:repeat;
	background-size:cover;
	background-position:center
	}

.customise-space {
	height:2em}
.customise-title {
	width:58%;
	border:1px solid #fff}
	
.customise-title {
	border: 1px solid #fff;
	width:53%;
	height:11em;
	margin:0 auto;
	
	}
	
.customise-title p {
	color:#fff;
	font-size:16px;
	margin:0 auto;
	text-align:center;
	font-weight:400;
	width:70%;
	line-height:1.6em;
	}

.customise h2 {
	color:#fff;
	font-size:13px;
	margin:0 auto;
	text-align:center;
	font-weight:200;
	width:90%;
	line-height:1.6em;
	}
.customise-head h1 {
	color:#fff;
	font-size:25px;
	margin:0 auto;
	text-align:center;}

.customise-head h2 {
	font-size:24px}


.customise h2 {
	color:#fff;
	font-size:13px;
	margin:0 auto;
	text-align:center;
	font-weight:200;
	width:90%;
	line-height:1.6em;
	}
	
.customise-line{
	background-image:url(../img/line.png);
	width:180px;
	height:1px;
	margin:0 auto;
	margin-top:8px}

.customise-info {
	width:70%;
	margin:0 auto;
	margin-top:5em}

.customise-info p {
	width:100%;
	font-size:14px;
	color:#fff;
	line-height:2.3em;
	text-align:center}
	
.customise-button {
	width:200px;
	height:30px;
	margin:0 auto;
	border:2px solid #fff;
	margin-top:2em;
	border-radius:20px}

.customise-button p {
	font-size:18px;
	color:#fff;
	font-weight:400;
	}
	


/* catch */
#catch,
#device-catch {
	font-size:250%;
	line-height:1.5em;
	text-align:center;
	margin-top:50px;
	padding-bottom:48px;
}
#catch span,
.scene h3 span {
	color:#00adef;
}


/* contact */
.foot_contact_wrap {
	width:100%;
	background-color:#5D9AC9;
	padding:58px 0;
}
.foot_contact {
	width:736px;
	height:128px;
	border:2px solid #000;
	border-radius:16px;
	background-color:#fff;
	margin:0 auto;
	display:table;
}
.foot_contact img {
	margin-left:8px;
}
.contact_left,
.contact_right {
	width:49%;
	height:122px;
}
.contact_border {
	width:2%;
	height:98px;
	border-right:1px solid #ccc;
	float:left;
	display:block;
	margin:12px 0;
}
.contact_left {
	float:left;
}
.foot_contact div {
	text-align:center;
}
.foot_contact .contact_right {
	float:right;
	position:relative;
}
.contact_right p {
	position:absolute;
	width:100%;
	top:50%;
	text-align:center;
	margin-top:-2em;
}
.contact_right span {
	font-weight:bold;
	font-size:large;
}

/*other */
.thum {
	overflow:hidden;
}
.thum img {
	width:100%;
	height:auto;
}
.more {
	width:100%;
	height:32px;
	color:#fff;
	border-radius:8px;
	text-align:center;
	line-height:32px;
	margin-top:8px;
	background-image:url(../img/more_bg.png);
	background-repeat:no-repeat;
	background-position:right;
}
.more a,
.more_peppre a {
	display:block;
	text-decoration:none;
	color:#fff;
}
.more:hover,
.thum:hover,
.pagetop:hover,
.more_peppre:hover {
	opacity: 0.5;
	-webkit-opacity: 0.5;
	-moz-opacity: 0.5;
	filter: alpha(opacity=50);	/* IE lt 8 */
	-ms-filter: "alpha(opacity=50)"; /* IE 8 */
}
.more,
.thum,
.pagetop,
.more_peppre {
-webkit-transition: opacity 1s ease-out;
-moz-transition: opacity 1s ease-out;
-ms-transition: opacity 1s ease-out;
transition: opacity 1s ease-out;
}

@media screen and (min-width:1024px) and (max-width:1200px){
.container {
	width:100%;
}
.contents {
	width:100%;
	margin:0 auto;
}
.content_base {
	width:100%;
	margin:0 auto;
}

.about {
	width:100%;
	margin:0 auto;
	background-color:#fff}
	
.about-left {
	margin-top:2em}

.about-text{
	width:95%}
.about-right{
	margin-top:2em}
.headimage {
	min-width:100%;
	height:auto;
	background-position:center}
	
	
/* scene */
.scene {
	width:100%;
	height:760px;
	position:relative;
	margin:0 auto;
}
.content_base#scene-case {
	width:930px;
}
.scene-case {
	width:290px;
	height:420px;
}
.scene-case#case02 {
	margin-left:30px;
	margin-right:30px;
}
.scene-case .case-no {
	margin:-30px 105px 16px;
}

/* features */

.features {
	width:100%;
	margin:0 auto}

.features-left {
	width:100%}

.features-detail {
	width:100%;height:150px;margin:0 auto;position:relative
	}

.features-detail img {	
	width:25%;
	text-align:center;
	margin-top:1.7em;
	margin:0 auto}

.features-detail p {
	font-size:16px;
	color:#373737;
	font-weight:500;
	width:100%;
	text-align:center;
	margin:0 auto;
	margin-top:1.5em;}

.extra {
	display:none;
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
	box-shadow:0px 0px 10px;
	border:1px #E5E5E5;
	border-radius:2px}

.extra p {
	font-size:13px;
	color:#484848;
	margin:0 auto;
	word-spacing:2px;
	text-align:justify;
	line-height:1.6em;font-weight:400;margin-top:0.5em;
	width:90%
	}
	
.features-detail:hover .extra {
	background-color:#fff;
	display:inline-block;
	position:absolute;
	width:100%;
	opacity:0.9
	}



/*price*/


}

@media screen and (min-width:992px) and (max-width:1154px){
	.planarea {
		height:130px}
	
	.headimage {
		width:100%;
		height:auto}
			
.explain {
	height:auto;
	width:85%;
	margin:0 auto;margin-top:7.4em;}}
	
@media screen and (max-width:1023px) and (min-width:641px){
.container {
	width:100%;
}
.headimage {
		width:100%;
		height:auto}
.contents {
	width:100%;
	margin:0 auto;
}
.content_base {
	width:98%;
	margin:0 auto;
}
h2.title {
	margin-bottom:32px;
}


.news-wrap {
	width:100%;
	margin:15px auto;
}
.news {
	width:90%;
}
.news .thum {
	width:30%;
	height:auto;
	float:left;
	margin:0;
}

.news .comwrap {
	width:69%;
	float:left;
	margin-left:1%;
}

.foot_contact {
	width:95%;
	height:auto;
	border:2px solid #000;
	border-radius:16px;
	margin:0 auto;
	display:table;
}
.foot_contact img {
	border-radius:0;
	width:70%;
	height:auto;
	margin:auto;
}
.contact_left {
	line-height:122px;
}
.contact_left,
.contact_right {
	width:49%;
	height:122px;
	display:table-cell;
	vertical-align:middle;
	float:left;
}

.foot_contact div {
	text-align:center;
}
.contact_right p {
	position:absolute;
	top:50%;
	margin-top:-2em;
	text-align:center;
	width:100%;
}
.contact_right span {
	font-weight:bold;
	font-size:large;
}
.more {
	display:none;
}


/* scene */
.content_base#scene-case {
	width:90%;
	margin:0 auto;
}
.scene {
	height:950px;
}
.scene-case {
	width:90%;
	height:200px;
	background-color:#fff;
	float:none;
	border-radius:16px;
	margin-left:40px;
}
.scene-case#case02 {
	margin-left:40px;
	margin-right:0;
}
.scene-case .case-no {
	width:80px;
	height:80px;
	background-color:#ff8000;
	color:#fff;
	border-radius:50%;
	position:absolute;
	margin:60px 0px 60px -40px;
	text-align:center;
	line-height:35px;
	padding:2px 0;
}
.case-no .nom {
	font-size:250%;
}
.scene-case h4.case-title {
	color:#00adef;
	font-size:130%;
	font-weight:600;
	text-align:center;
	padding-top:16px;
}
.scene-case .case-img {
	width:50%;
	height:auto;
	text-align:center;
	padding:0;
	float:left;
}
.scene-case .case-img img {
	max-width:100%;
	height:auto;
}
.scene-case .case-txt {
	margin:24px auto auto;
	width:45%;
	text-align:justify;
	float:left;
}

/* price */
.price {
	width:100%;
	height:auto;
	background-image:url(../img/pricebg1.jpg)}

.price-info {
	width:100%;
	margin:0 auto}
.pricetitle {
	width:100%;
	margin:0 auto}

#line {
	display:none}
#line1 {
	display:none}
#line2 {
	display:none}
#line3 {
	display:none}
#line4 {
	display:none}





.pricetitle h3 {
	font-size:22px;
	color:#fff;
	font-weight:400;
	margin:0 auto;
	text-align:center}
	
.pricebox {
	width:35%;
	margin:2% 7%;
	border:2px #fff solid;
	height:320px;
	position:relative;
	float:left}

.priceimg {
	margin:0 auto;
	width:100%;
	margin-top:1em}

.priceimg img {
	width:40px;
	height:40px;
	margin:0 auto;
	text-align:center}

.plan{
	width:100%;
	margin:0 auto}

.plan h4{
	font-size:20px;
	font-weight:500;
    color:#fff;
	margin-top:0.5em;
	text-align:center}
.planlimg {
	width:80%;
	margin:0 auto
	}

.planarea {
	width:80%;height:110px;margin:0 auto;
	margin-top:1em}
	
.planimg img{
	width:70%;
	height:1px;
	margin:0 auto;
	margin-top:-1em}
	
	.planimg {
	margin-top:-0.8em
	
	}
	
.planinfo {
	width:90%;
	margin:0 auto;
	margin-top:-0.5em;
	}
	
.planinfo p{
	font-size:14px;
	color:#fff;
	font-weight:400px;
	margin-top:1em
	}
	
.planprice {
	width:100%;
	margin:0 auto;padding:1em}

.planprice p{
	font-size:27px;
	color:#FF9250;
	font-weight:500;
	text-align:center;
	margin-top:-0.3em}

.planextra {
	width:100%;
	margin-bottom:0px;margin-top:-1em}
.planextra p {
	width:93%;
	font-size:13px;
	color:#fff;
	margin:0 auto}

.planbutton {
	width:200px;
	background-color:#E05B25;
	height:32px;
	margin:0 auto;
	margin-top:1em;
	}

.another-space {
	height:2em}

.planbutton p {
	font-weight:400;
	color:#fff;
	font-size:17px;
	text-align:center;
	margin:0 auto;
	padding:3px}



}

@media screen and (max-width:1149px) and (min-width:641px){

/* function */
.function_detail {
	width:30%;
	margin-right:5%;
	float:left;
	margin-top:32px;
}
.function_detail#function-last,
.function_detail#function-3 {
	margin-right:0;
}


}



@media screen and (min-width:641px) and (max-width:767px) {

/* steps */
.steps{
	display:none}

.steps1 {
	width:70%;
	margin:0 auto}

.stepstitle {
	width:100%;
	margin:0 auto}
	
.stepstitle h3{
	font-size:22px;
	color:#000;
	font-weight:500;
	margin:0 auto;
	text-align:center}

.stepstitle h4 {
	font-size:16px;
	color:#3f3f3f;
	font-weight:400;
	margin:0 auto;
	text-align:center;
	margin-top:16px}

.stepscategory {
	width:90%;
	margin:0 auto}

.stepsimg {
	width:100%;
	margin:0 auto;
	margin-top:1em}

.stepsimg p {
	font-size:15px;
	color:#737373;
	font-weight:400;
	text-align:center}
.stepsimg img {
	width:100%;
	margin:0 auto;
	margin-bottom:2em}

.stepsspace{
	height:3em}

.responsivesteps {
	width:75%;
	float:left;
	position:relative;
	margin:0 auto;
	margin-left:1.8em}

.responsivesteps h2 {
	color:#FF7841;
	font-size:15px;
	}

.responsivesteps p {
	color:#353239;
	font-size:13px}
	
.numbers p {
	text-align:center;
	color:#818181;
	font-weight:400;
	font-size:18px}

.numbers img {
	height:1px;
	width:100%
	}

.stepsinfo {
	width:90%;
	margin:0 auto;
	margin-top:1em}

.stepsinfo p {
	font-weight:400;
	color:#737373;
	font-size:14px;
	line-height:normal;text-align:center}

/*features */
.features {
	width:100%;height:auto;
	margin:0 auto
	}

.featuresspace {
	height:2em}
	
.features-left {
	background-image:url(../img/features11.jpg);
	width:100%;height:268px;
	overflow:hidden;
	background-repeat:repeat;
	margin:0 auto;}

.features-button {
	width:30%;
	margin:0 auto;
	height:2.6em;
	background-color:#ff7841;
	margin-top:-1em;
	padding-bottom:1em}

.features-button p {
	font-size:16px;
	color:#fff;
	font-weight:400;
	text-align:center;
	}
.features-title {
	width:90%;
	height:auto;
	margin:0 auto;
	margin-top:2em
	
	}

.features-head {
	color:#353239;
	font-size:24px;
	margin:0 auto;
	text-align:center;
	height:1em;
	margin-top:-2.8em}
	
	.features-line{
	width:80%;margin-top:1em}

.features h2 {
	color:#353239;
	font-size:14px;
	margin:0 auto;
	text-align:center;
	font-weight:200;
	width:86%;
	}
	
#space1 {
	margin-top:0.5em}

#space2 {
	margin-top:2em}
	
#space4 {
	margin-top:2em}
#space5 {
	margin-top:2em}


#space3 {
	margin-top:1.2em}

.features-detail {
	width:100%;height:160px;margin:0 auto
	}

.features-detail img {
	width:25%;
	text-align:center;
	margin-top:1.7em;
	margin:0 auto}

.features-detail p {
	font-size:13px;
	color:#373737;
	font-weight:500;
	width:100%;
	text-align:center;
	margin:0 auto;
	margin-top:1.5em;
	padding:0.4em}

.extra {
	display:none;
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
	box-shadow:0px 0px 10px #B2B2B2;
	border:1px #E5E5E5;
	border-radius:2px}

.extra p {
	font-size:13px;
	color:#484848;
	margin:0 auto;
	word-spacing:2px;
	text-align:center;
	line-height:1.6em;font-weight:400;margin-top:-0.5em;
	width:65%
	}
	
.features-detail:hover .extra {
	display:none
	}
	
.about {
	width:100%;
	height:auto}
.about-info{
	margin:0 auto;
	width:100%;
	}
	
	.about-text p{
	margin:0 auto;
	width:100%;
	margin-top:-1em
	}
.about-space {
	height:1em}

.about-left {
	width:90%;
	margin:0 auto}

.about-right {
	width:96%;
	margin:0 auto}

.about-text {
	width:100%;
	text-align:center;
	font-size:13px}
	
.about-text p {
	font-size:13px;
	padding-bottom:3.5em}
	
	
	
	
	/* about */
.about {
	background-color:#fff;
	width:100%;
	margin:0 auto;
	height:auto}
	
.about-info {
	width:90%;
	margin:0 auto}

.about-space {
	height:1em}
.about-left {
	width:100%;
	margin:0 auto}

.about-left img {
	width:50%;
	margin:0 auto;
	margin-top:2em;
	padding-top:5em}

.about-right {
	width:100%;
	margin:0 auto}

.about-text {
	width:100%;
	margin:0 auto;
	padding-bottom:2em;
	}

.about-text h2 {
	margin-top:1em;
	margin:0 auto;
	text-align:center}

.about-text p {
	font-size:14px;
	font-weight:300;
	line-height:2.4em;
	margin-top:0em;
	margin:0 auto;
	padding-top:0em;
	text-align:center}
.hiddenspace {
	display:none}
	
		/* price */
.price {
	width:100%;
	height:auto;
	background-image:url(../img/pricebg1.jpg);
	background-size:cover;
	background-position:right}

.price-info {
	width:100%;
	margin:0 auto}
.pricetitle {
	width:100%;
	margin:0 auto}

#line {
	display:none}
#line1 {
	display:none}
#line2 {
	display:none}
#line3 {
	display:none}
#line4 {
	display:none}





.pricetitle h3 {
	font-size:22px;
	color:#fff;
	font-weight:400;
	margin:0 auto;
	text-align:center}
	
.pricebox {
	width:43%;
	margin:3%;
	border:2px #fff solid;
/*	height:300px;*/
	height:390px;
	position:relative;
	float:left}

.priceimg {
	margin:0 auto;
	width:100%;
	margin-top:1em}

.priceimg img {
	width:40px;
	height:40px;
	margin:0 auto;
	text-align:center}

.plan{
	width:100%;
	margin:0 auto}

.plan h4{
	font-size:20px;
	font-weight:500;
    color:#fff;
	margin-top:0.5em;
	text-align:center}
.planlimg {
	width:80%;
	margin:0 auto;
	
	}

.planarea {
	width:80%;height:110px;margin:0 auto;
	margin-top:1em}
	
.planimg img{
	width:70%;
	height:1px;
	margin:0 auto;
	margin-top:-0.8em}
	
.planinfo {
	width:100%;
	margin:0 auto;
	margin-top:-0.5em;
	}
	
.planinfo p{
	font-size:14px;
	color:#fff;
	font-weight:400px;
	margin-top:0em
	}
	
.planprice {
	width:100%;
	margin:0 auto}

.planprice p{
	font-size:27px;
	color:#FF9250;
	font-weight:500;
	text-align:center;
	margin-top:0em}

.planextra {
	width:100%;
	margin-bottom:0px;margin-top:0em}
.planextra p {
	width:93%;
	font-size:13px;
	color:#fff;
	margin:0 auto}

.planbutton {
	width:200px;
	background-color:#E05B25;
	height:32px;
	margin:0 auto;
	margin-top:1em;
	}

.another-space {
	height:2em}

.planbutton p {
	font-weight:400;
	color:#fff;
	font-size:17px;
	text-align:center;
	margin:0 auto;
	padding:3px}

.scenes {
	display:none}

.scene1{
	display:none}

.scene-title-area {
	width:90%;
	margin:0 auto}
.scene-responsive-title {
	width:100%;
	font-size:20px;
	font-weight:400;
	float:left;
	position:relative}

.scene-responsive-title h1 {
	width:20%;
	font-size:23px;
	font-weight:400;
	float:left;
	position:relative}


.scene-responsive {
	width:100%;
	height:auto}

.scene-responsive-photo{
	width:100%;
	height:280px;margin:0 auto;overflow:hidden;border-radius:10px;height:auto}

.scene-responsive-photo img {
	width:100%;margin:0 auto;border-radius:10px;
	}
.scene-responsive-text {
	width:80%;
	margin:0 auto;
	}

.scene-responsive-text p {
	padding-bottom:2em}

.scene-responsive-text h2 {
	font-size:20px;
	color:#000;
	text-align:justify;
	font-weight:normal;
	padding-top:0em}

.scene-responsive-text p {
	font-size:14px;
	color:#707070;
	font-weight:normal;
	line-height:2em;
	padding-top:1em;
	padding-bottom:1.5em}

.testimonials1 {
	display:none}

}
@media screen and (max-width:640px) and (min-width:0px){
.headimage {
	width:100%;
	background-repeat:no-repeat;
	background-position:60% center;
	background-image:url(../img/topheadimage.jpg)
}
#main-catch {
	width:100%;
	font-size:250%;
	line-height:1.7em;
	font-weight:700;
	text-align:center;
	margin:0 auto;margin-top:-1em;padding-bottom:1em
	
}

#main-catch p {
	margin-left:0px}
	
	
#main-subcatch {
	font-size:120%;
	margin-left:30px;
}
.head-contact {
	width:50%;
	margin-left:30px;
	background-color:#ff7841;margin:0 auto;padding-bottom:1em;margin-bottom:1em;margin-top:-1em
}

.head-contact p {
	padding-top:0em}
#start {
	margin-left:30px;
	font-size:250%;
}
h3 {
	margin-bottom:0;
}
.space {
	height:24px;
}
.contents {
		width:100%;
		margin:0 auto;
}
.content_base {
	width:98%;
	margin:0 auto;
}
.title .jp {
	display:none;
}
.category .title {
	height:auto;
}
.com {
	height:auto;
}

.n-info dt#info {
	width:128px;
	height:24px;
	background-color:#00adef;
	float:none;
	border-radius:12px;
	color:#fff;
	text-align:center;
	line-height:24px;
}
.n-info dd {
	float:none;
	margin:3px;
}
.n-info dd .date {
	margin-left:0px;
	margin-right:24px;
	color:#666;
}


#catch {
	font-size:200%;
}
#catch span:before {
	content:"\a";
	white-space: pre;
}


.scene {
	height:1450px;
}
#mainlogo img {
	max-width:60%;
	height:auto;
}
.scene h3 {
	text-align:center;
	top:160px;
	font-size:180%;
	position:relative;
}
.scene-case {
	float:none;
	margin:48px auto;
	height:350px;
	position:relative;
}
.scene-case#case02 {
	margin-left:auto;
	margin-right:auto;
}
.scene-case .case-no {
	margin:-30px 135px 16px;
	position:absolute;
}
.scene-case h4.case-title,
.scene-case .case-img,
.scene-case .case-txt {
	position:relative;
	top:60px;
}
.scene .content_base {
	padding-top:24px;
}

/* function */
.function {
	width:90%;
	margin:0 auto;
}
.function_detail {
	width:100%;
	float:none;
	display:inline-block;
	padding-bottom:24px;
}
.function_detail:after {
	clear:left;
}
.function-image {
	width:30%;
	text-align:center;
	float:left;
}
.function-image img {
	max-width:100%;
	height:auto;
}
.function_detail#function-last {
	margin-right:auto;
}
h4.function-title {
	text-align:left;
	font-weight:bold;
	padding:16px 0;
	float:left;
	width:70%;
}
p.function-txt {
	text-align:justify;
	float:left;
	width:70%;
}


/* flow */
.flow_wrap h3 span:after {
	content:"\a";
	white-space: pre;
}
.pdca_image {
	width:90%;
	float:none;
	margin:0 auto;
	text-align:center;
}
.pdca_txt {
	float:none;
	width:90%;
	margin:0 auto;
}



.news-wrap {
	width:100%;
	padding:16px 0;
	margin:32px 0 !important;
}
.news .date,
.news .title,
.news .com {
	width:100%;
	height:auto;
	margin:0;
}
.news .title {
	line-height:21px;
}

.news .thum {
	width:30%;
	height:auto;
	float:left;
	margin:0;
}
.news .comwrap {
	width:69%;
	float:left;
	margin-left:1%;
}


.foot_contact {
	width:98%;
	height:auto;
	border:2px solid #000;
	border-radius:16px;
	margin:0 auto 0px auto;
	display:table;
	text-align:center;
}
.foot_contact img {
	max-width:90%;
	height:auto;
}
.contact_left,
.contact_right {
	width:100%;
	margin:0 auto;
}
.contact_left {
	float:none;
}
.contact_border {
	display:none;
}
.foot_contact div {
	text-align:center;
	width:100%;
	height:auto;
}
.foot_contact .contact_right {
	float:none;
	width:100%;
	height:auto;
	position:static;
}
.contact_right p {
	position:static;
	top:1%;
	margin-top:0;
	text-align:center;
	width:100%;
}
.contact_right span {
	font-weight:bold;
	font-size:large;
}
.more {
	display:none;
}

/*price*/
/* price */
.price {
	width:100%;
	height:auto;
	background-image:url(../img/pricebg1.jpg)}

.price-info {
	width:100%;
	margin:0 auto}
.pricetitle {
	width:100%;
	margin:0 auto}

#line {
	display:none}
#line1 {
	display:none}
#line2 {
	display:none}
#line3 {
	display:none}
#line4 {
	display:none}





.pricetitle h3 {
	font-size:22px;
	color:#fff;
	font-weight:400;
	margin:0 auto;
	text-align:center}
	
.pricebox {
	width:70%;margin:1em 15%;
	border:2px #fff solid;
/*	height:340px;*/
	position:relative;
	float:left}

.priceimg {
	margin:0 auto;
	width:100%;
	margin-top:1.5em}

.priceimg img {
	width:40px;
	height:40px;
	margin:0 auto;
	text-align:center}

.plan{
	width:100%;
	margin:0 auto}

.plan h4{
	font-size:20px;
	font-weight:500;
    color:#fff;
	margin-top:0.5em;
	text-align:center}
.planlimg {
	width:80%;
	margin:0 auto;
	
	}

.planarea {
	width:80%;height:120px;margin:0 auto;
	margin-top:1em}
	
.planimg img{
	width:70%;
	height:1px;
	margin:0 auto;
	margin-top:-0.8em}
	
.planinfo {
	width:100%;
	margin:0 auto;
	margin-top:-0.5em;
	}
	
.planinfo p{
	font-size:14px;
	color:#fff;
	font-weight:400px;
	margin-top:1em
	}
	
.planprice {
	width:100%;
	margin:0 auto}

.planprice p{
	font-size:27px;
	color:#FF9250;
	font-weight:500;
	text-align:center;
	margin-top:-0.3em}

.planextra {
	width:100%;
	margin-bottom:0px;margin-top:0em}
.planextra p {
	width:93%;
	font-size:13px;
	color:#fff;
	margin:0 auto}

.planbutton {
	width:200px;
	background-color:#ff7841;
	height:32px;
	margin:0 auto;
	margin-top:1em;border-radius:16px
	}

.another-space {
	height:2em}

.planbutton p {
	font-weight:400;
	color:#fff;
	font-size:17px;
	text-align:center;
	margin:0 auto;
	padding:3px}

/*features*/

/*features */
.features {
	width:100%;height:auto;
	margin:0 auto
	}

.featuresspace {
	height:2em}
	
.features-left {
	background-image:url(../img/features11.jpg);
	width:100%;height:268px;
	overflow:hidden;
	background-repeat:repeat;
	margin:0 auto;}

.features-button {
	width:30%;
	margin:0 auto;
	height:2.6em;
	background-color:#ff7841;
	margin-top:-1em;
	padding-bottom:1em}

.features-button p {
	font-size:16px;
	color:#fff;
	font-weight:400;
	text-align:center;
	}
.features-title {
	width:90%;
	height:auto;
	margin:0 auto;
	margin-top:1em
	
	}

.features-head {
	color:#353239;
	font-size:24px;
	margin:0 auto;
	text-align:center;
	height:1em;
	margin-top:2em}
	
	.features-line{
	width:80%;margin-top:1em}

.features h2 {
	color:#353239;
	font-size:14px;
	margin:0 auto;
	text-align:center;
	font-weight:200;
	width:86%;
	margin-top:1em
	}
	
#space1 {
	margin-top:0.5em}

#space2 {
	margin-top:2em}
	
#space4 {
	margin-top:2em}
#space5 {
	margin-top:2em}


#space3 {
	margin-top:1.2em}

.features-detail {
	width:100%;height:160px;margin:0 auto
	}

.features-detail img {
	width:25%;
	text-align:center;
	margin-top:1.7em;
	margin:0 auto}

.features-detail p {
	font-size:13px;
	color:#373737;
	font-weight:500;
	width:100%;
	text-align:center;
	margin:0 auto;
	margin-top:1.5em;
	padding:0.4em}

.extra {
	display:none;
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
	box-shadow:0px 0px 10px #B2B2B2;
	border:1px #E5E5E5;
	border-radius:2px}

.extra p {
	font-size:13px;
	color:#484848;
	margin:0 auto;
	word-spacing:2px;
	text-align:center;
	line-height:1.6em;font-weight:400;margin-top:-0.5em;
	width:65%
	}
	
.features-detail:hover .extra {
	display:none
	}
/* about */
.about {
	background-color:#fff;
	width:100%;
	margin:0 auto;
	height:auto}
	
.about-info {
	width:90%;
	margin:0 auto}

.about-space {
	height:1em}
.about-left {
	width:100%;
	margin:0 auto}

.about-left img {
	width:70%;
	margin:0 auto;
	margin-top:2em;
	padding-top:5em}

.about-right {
	width:100%;
	margin:0 auto}

.about-text {
	width:90%;
	margin:0 auto;
	padding-bottom:2em;
	}

.about-text h2 {
	font-size:180%;
	margin-top:2em;
	margin:0 auto;
	text-align:center;
	color:#000}

.about-text p {
	font-size:14px;
	font-weight:300;
	line-height:2.4em;
	margin-top:1.9em;
	margin:0 auto;
	padding-top:2em;
	text-align:center}
.hiddenspace {
	display:none}
	
/* scene */
.scenes {
	display:none}
.scene1{
	display:none;background-color:#EBEBEB;height:auto
	}

.scene2 {
	background-color:#FFFFFF;height:auto}

.scene-img img{
	width:61%;
	margin:0 auto;
	padding:1em}

.scene-title {
	width:80%;
	margin:0 auto}

#scenename {
	margin-left:5em}

#scenename1{
	margin-left:5em}
	
#scenename2 {
	margin-right:5em}
	
#scenename3 {
	margin-right:5em}
	
.explain {
	height:auto}
.scene-title h3{
	font-size:22px;
	color:090909;
	font-weight:400}

.scene-info {
	width:80%;
	margin:0 auto;
	margin-top:2em;}
	
.scene-info p{
	font-size:14px;
	color:#3C3C3C;
	font-weight:300;
	word-spacing:normal;
	line-height:30px}
	
.scene-responsive {
	width:100%;
	height:auto}

.scene-responsive h1 {
	font-size:22px;text-align:center}
.scene-responsive-photo{
	width:100%;
	height:auto}

.scene-responsive-photo img {
	width:100%;
	}
.scene-responsive-text {
	width:90%;
	margin:0 auto}

.scene-responsive-text h2 {
	font-size:18px;
	color:#000;
	text-align:justify;
	font-weight:400;
	padding-top:-1em;
	}

.scene-responsive-text p {
	font-size:13px;
	color:#707070;
	font-weight:300;
	line-height:2em;
	padding-top:0em;
	padding-bottom:1em}

}

@media screen and (min-width:768px){
	.scene-responsive {
	display:none}

.scene-responsive-photo{
	display:none}

.scene-responsive-photo img {
	display:none}
.scene-responsive-text {
	display:none}

.scene-responsive-text h2 {
	display:none}

.scene-responsive-text p {
	display:none}}
	

@media screen and (min-width:640px) and (max-width:991px) {
	/* testimonials */
.testimonials {
	width:100%;
	height:auto;
	background-color:#F9F9F9}

.testimonials h3 {
	font-size:22px;
	color:#000;
	font-weight:500;
	margin:0 auto;
	text-align:center}

.testcategory {
	width:100%}

.testimage {
	width:100%;
	height:auto;
	overflow:hidden}
.testimage img {
	width:60%;
	height:auto;
	overflow:hidden;
	margin-top:8px;
	margin:0 auto
	}

.testimage1 {
	width:70%;
	height:auto;
	overflow:hidden;
	margin:0 auto}
.testimage1 img {
	width:70%;
	height:auto;
	margin-top:8px
	}

.testtitle {
	width:90%;
	padding:0.8em;
	margin:0 auto}
.testtitle p{
	font-size:15px;
	font-weight:400;
	color:#494949;
	text-align:center}

.testline {
	width:100%;
	height:1px;
	margin-top:-1em;
	}

.testline img {
	width:98%;
	height:1px;
	margin:0 auto}

.testdescription {
	width:90%;
	margin-top:1.5em;
	padding:0.4em;
	height:10em;
	margin:1em auto}

.testdescription p{
	width:98%;
	font-size:13px;
	font-weight:300;
	color:#777777;
	margin:0 auto;
	line-height:normal;
	margin-top:1em}

.readmore {
	width:97%;
	}

.readmore p{
	text-align:right;
	font-size:14px;
	color:#FF7841;
	font-weight:500}

.testspace {
	height:2em}
	
.steps2 {
	width:60%;
	margin:0 auto}
}
	
@media screen and (min-width:768px) and (max-width:991px){
	.about-text {
		margin:0 auto;
		width:100%;
		padding-bottom:1em}
	
	.about-left img {
		margin-top:4em}
	
	.about-text h2 {
		margin:0 auto}
	.testimonials{
		width:100%;
		margin:0 auto}
	
	.testimage {
		width:40%;
		margin:0 auto}
	
	.testimage1 {
		width:40%;
		margin:0 auto}
	
	.testtitle {
		margin:0 auto;
		padding-bottom:0em;
		padding-top:2em}
	
	.testdescription {
		margin:0 auto;
		width:70%;
		margin-top:1em}
	
	.testline {
		width:70%;
		margin:0 auto}
	
.testimonials {
	display:none}

.testimonials1 {
	width:100%;
	height:auto;
	margin:0 auto;
	background-color:#f9f9f9}
.testtitle {
	width:70%;
	margin:0 auto;float:left;
	position:relative;
	}

.testtitle p {
	text-align:justify;
	margin-top:-1em}
	
.testtitle1 {
	width:70%;
	margin:0 auto;float:left;
	position:relative;
	}

.testtitle1 p {
	text-align:justify;
	margin-top:-1em}

.testdescription {
	width:70%;
	margin:0 auto;
	float:left;
	position:relative;
	height:auto;
}

testdescription1 {
	width:70%;
	margin:0 auto;
	float:left;
	position:relative;
	height:auto;
}
.testdescription1 p {
	margin-top:-0.4em;
	width:100%;}

.testtitle p {
	margin-left:1em;margin-top:-2em;
	text-align:center;
	font-size:15px}

.testdescription p {
	margin-top:-0.4em;
	width:100%;
	margin-left:1em}
.testimage {
	width:30%;
	float:left;
	position:relative;
	}
.testimage img{
	width:100%}

	
.testarea {
	width:100%;
	}

.testsection {
	width:80%;
	margin:0 auto;
	height:auto;
	margin-bottom:2em
	
}

	/*features */
.features {
	width:100%;height:auto;
	margin:0 auto
	}

.featuresspace {
	height:2em}
	
.features-left {
	background-image:url(../img/featuresbg.png);
	width:100%;height:268px;
	overflow:hidden;
	background-repeat:repeat;
	margin:0 auto;}

.features-button {
	width:30%;
	margin:0 auto;
	height:2.8em;
	background-color:#ff7841;
	margin-top:1em;
	padding-bottom:1em}

.features-button p {
	font-size:18px;
	color:#fff;
	font-weight:400;
	text-align:center;margin-top:0.2em
	}
.features-title {
	width:90%;
	height:auto;
	margin:0 auto;
	margin-top:0em
	
	}

.features-head {
	color:#353239;
	font-size:24px;
	margin:0 auto;
	text-align:center;
	height:1em;
	margin-top:0em}
	
	.features-line{
	width:80%;margin-top:1em}

.features h2 {
	color:#353239;
	font-size:14px;
	margin:0 auto;
	text-align:center;
	font-weight:200;
	width:86%;
	}
	
#space1 {
	margin-top:0.5em}

#space2 {
	margin-top:2em}
	
#space4 {
	margin-top:2em}
#space5 {
	margin-top:2em}


#space3 {
	margin-top:1.2em}

.features-detail {
	width:100%;height:160px;margin:0 auto
	}

.features-detail img {
	width:25%;
	text-align:center;
	margin-top:1.7em;
	margin:0 auto}

.features-detail p {
	font-size:14px;
	color:#373737;
	font-weight:500;
	width:100%;
	text-align:center;
	margin:0 auto;
	margin-top:1.5em;
	padding:0.4em}

.extra {
	display:none;
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
	box-shadow:0px 0px 10px #B2B2B2;
	border:1px #E5E5E5;
	border-radius:2px}

.extra p {
	font-size:13px;
	color:#484848;
	margin:0 auto;
	word-spacing:2px;
	text-align:center;
	line-height:1.6em;font-weight:400;margin-top:-0.5em;
	width:65%
	}
	
.features-detail:hover .extra {
	display:none
	}

.hiddenspace {
	display:none}}
	

@media screen and (max-width:1200px) {
	.headimage {
		width:100%;
		height:auto}
		
		.customise{
		display:none}
	
	.customise1{
		width:100%}
	.customise-info p {
		display:none}
	
	.customise-left{
		width:100%;
		background-repeat:no-repeat;
		background-position:contain;
		background-image:url(../img/customisebg.jpg);
		background-size:cover;
		background-position:center}
		
	
	.customise-title {
		border:2px solid #fff;
		height:200px;}
	
	.customise-head {
		font-size:22px;
		font-weight:500; color:#fff}
	
	.customise-title h2 {
		font-size:22px;
		width:80%;
		margin:0 auto;
		color:#fff;
		line-height:2em;margin-top:0em
		}
	.testtitle {
		margin-top:0em}
	
	.testspace {
		height:2em}
	
	.testdescription {
		height:14em}
	
	.features-detail img {
		width:25%}
	
	.about-text {
		width:100%}
	
	.about-right {
		width:100%;
		margin:0 auto}
	
	.about-info {
		width:80%;
		margin:0 auto}
		
		}

@media screen and (max-width:639px) {
	.head-buttonsarea{
		margin-top:0em;
		width:300px;
		padding-bottom:7em}
	
	
	.about-info {
		width:100%}
		
	
	.about-right {
		width:100%}
	
	
	.about-text {
		width:100%;}
	
	.about-right {
		width:90%;
		margin:0 auto}
	
		
	.headimage {
	    width:100%;
		height:auto;
		background-size:cover}
		
	.steps1 {
		display:none}
	
	.steps2 {
		width:80%;
		margin:0 auto;}
	
	.stepsimg1 {
		width:100%;
		margin-top:1em}
		
	.stepsimg1 img {
		margin-top:1.3em}
	
	.stepsimg2 {
		width:100%;
		margin-top:1em;}
	
	.stepsimg2 h3 {
		width:80%;
		color:#fff;
		font-size:16px;
		margin-top:1em;
		padding:1em;}
	
	
	.greysteps {
		margin-top:-1em}
	.stepsinfo {
		width:100%;
		margin:0 auto;
		margin-top:1em}
	
	.stepsinfo p {
		width:96%;
		margin:0 auto;
		text-align:justify;
		padding-bottom:1em;
		margin-top:2em}
	
	.stepspace {
		height:1em}
		
	.stepscategory {
		margin:0 auto}
	
	.numbers {
		width:100%;
		margin:0 auto;
		height:8em}
	
	.numbers img{
		width:1px;
		height:8em;
		margin:0 auto;
		margin-top:1em}
		
	.testsection {
		height:auto}
	.testimonials {
		width:100%;
		margin-top:0em;height:auto}
	
	.testimonials1 {
		display:none}
	
	.testdescription {
		height:18em;
		width:100%;
		margin:1em auto}
		
	.testdescription p {
		width:100%;
		font-size:13px}
	
	.readmore {
		text-align:center}
	
	.readmore p {
		text-align:center}
	
	.testtitle {
		margin:0 auto}
	
	.testtitle p {
		margin-top:0em}
	
	.features {
	width:100%;
	margin:0 auto}
.features-left{
	background-image:url(../img/features11.jpg);
	max-width:100%;height:auto;
	background-repeat:no-repeat;
	background-position:cover;
	margin:0 auto;
	margin-left:0px;}

.hiddenspace {
	height:5em}
.featuresspace{
	height:2em}

.features-title {
	border: none;
	width:100%;
	height:9.5em;
	margin:0 auto;
	margin-top:3em
	}

.features-head {
	width:90%;
	
	}

.features-title h2 {
	width:100%;
	margin:0 auto;
	height:auto;}

.features h2 {
	font-size:14px;
	margin-top:3em}
.features-button{
	margin-top:6em}
	
.features-area {
	display:none}

.features-area-responsive {
	width:80%;
	margin:0 auto;
	height:auto;
	margin-top:10px}

.pricetitle {
	margin-top:2em}

.customise-title p {
	width:90%;
	font-size:14px}

.ticker {
	margin-top:0em}

.ticker ul li {
	font-size:15px;font-family:"ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif"}
	
.notice {
	margin-top:3em}
	
.customise1 {
	width:100%;
	height:auto;background-image:url(../img/customisebg.jpg);
}
	
}
		
		@media screen and (min-width:992px){
	.features-area-responsive{
		display:none}
	
	.hiddenspace {
		display:none}
	
	.steps1{
		display:none}
	
	.steps2 {
		display:none}
	
	.testimonials1 {
		display:none;}
	
	.testdescription{
		height:240px}
	
	.testsection {
		margin-top:1em;
		margin:0 auto}}

@media screen and (min-width:0px) and (max-width:553px) {
	.features-title {
		width:100%;}
	
	.features h2 {
		padding:0px;
		margin:0 auto;
		height:auto;
		margin-top:2em;
		width:90%}
	
	.features-line {
		display:none}
	
	.features-button {
		margin-top:0.4em}
		
	.about-text p {
		margin-top:-2em}}
		
@media screen and (max-width:991px){
.headimage {
		width:100%;
		height:auto}


.about {
	width:100%;
	height:auto}
	
.about-info{
	margin:0 auto;
	width:80%;}
	
	
	.about-info p {
	margin:0 auto;
	width:100%;
	margin-top:3em;
	font-size:16px}

.about-left {
	width:80%;
	margin:0 auto}

.about-right {
	width:96%;
	margin:0 auto}

.about-text {
	width:100%;
	text-align:center;
	font-size:14px}
	
.about-text p {
	font-size:14px;
	padding-bottom:2.5em}
.features {
	width:100%;
	margin:0 auto}
.features-left{
	background-image:url(../img/features11.jpg);
	max-width:100%;height:288px;
	overflow:hidden;
	background-repeat:no-repeat;
	background-position:cover;
	margin:0 auto;
	margin-left:0px;
	position:relative}

.hiddenspace {
	height:5em}
.featuresspace{
	height:2em}

.features-title {
	border: none;
	width:86%;
	height:9.5em;
	margin:0 auto;
	margin-top:-3em
	}

.features-button{
	margin-top:4em}
	
.features-area {
	display:none}

.features-area-responsive {
	width:80%;
	margin:0 auto;
	height:auto;
	margin-top:10px}
	
.features-head h1 {
	margin-top:1em}

.features h2 {
	margin-top:2em}
.features-line {
	display:none}

/* scenes */

.scene1 {
	height:300px}
.explain {
	width:96%;
	}

.scene-title {
	width:90%;
	margin:0 auto}

.scene-info {
	width:100%;
	margin:0 auto;}

.scene-info p {
	width:90%}

.customise-info {
	display:none}

/*flow*/


/* steps */
.steps{
	display:none}

.steps1 {
	width:70%;
	margin:0 auto}

.stepstitle {
	width:100%;
	margin:0 auto}
	
.stepstitle h3{
	font-size:22px;
	color:#000;
	font-weight:500;
	margin:0 auto;
	text-align:center;
	margin-top:2em}

.stepstitle h4 {
	font-size:16px;
	color:#3f3f3f;
	font-weight:400;
	margin:0 auto;
	text-align:center;
	margin-top:16px}

.stepscategory {
	width:100%;
	margin:0 auto;background-color:#fff}

.stepsimg {
	width:20%;
	margin:0 auto;
	float:left;position:relative;
	margin-top:1em}

.stepsimg p {
	font-size:15px;
	color:#737373;
	font-weight:400;
	text-align:center}
.stepsimg img {
	width:80px;
	margin:0 auto;
	margin-bottom:1em}

.stepsspace{
	height:3em}

.responsivesteps {
	width:80%;
	float:left;
	position:relative;
	text-align:center;
	margin:0 auto}

.responsivesteps h2 {
	color:#FF7841;
	font-size:15px;
	text-align:justify
	}

.responsivesteps p {
	color:#353239;
	font-size:14px;
	width:100%;
	margin:0 auto;
	text-align:justify}
	
.numbers p {
	text-align:center;
	color:#818181;
	font-weight:400;
	font-size:18px}

.numbers img {
	height:1px;
	width:100%
	}

.stepsinfo {
	width:90%;
	margin:0 auto;
	margin-top:1em}

.stepsinfo p {
	font-weight:400;
	color:#737373;
	font-size:14px;
	line-height:normal;text-align:center}

.testsection {
	width:90%;
	margin:2em auto
}

.testdescription p{
	width:86%;margin:0 auto}

.testimonials1 h3 {
	text-align:center;
	text-decoration:underline;
	line-height:normal;
	font-weight:300}	

}
@media screen and (min-width:768px) {
	.aspace {
		display:none}}
@media screen and (min-width:641px) and (max-width:767px){
	.testimage {
		margin-top:1em}
	
	.testimage1 {
		margin-top:1em}
    
	.testsection {
		margin:0 auto;
		width:80%}
	
	.testdescription p{
		width:100%;}
	
	.testdescription {
		height:160px}
	.aspace {
		height:2em}
	
	.customise-title p {
		width:90%;
		font-size:15px}
	
	.about-text p{
		margin-top:1em;
		padding:0em;width:80%}
	
	}

@media screen and (max-width:767px){
	.customise1 {
		width:100%;
		height:auto;background-image:url(../img/customisebg.jpg);
}
	
	.customise-left {
		width:100;
		margin:0 auto;
		height:auto;}
	
	.customise-title {
	  border:none;
	  width:90%;
	  }
	 
	 .customise-head {
		 font-size:22px;
		 width:90%}
		
	.customise-title h2 {
		font-size:14px;
		width:90%;color:#fff}
		
		
	/* steps */
	
	/* scene */
	
	.scenes {
	width:100%;
	height:auto;
	margin:0 auto}
.scene1{
	width:100%;height:220px;margin:0 auto
	}

.scenetri-left {
	position:relative;
	float:left;
	width:100%}

.scenetri-left img{
	width:15%;}


.scenetri-right {
	position:relative;
	float:right;
	width:100%}

.scenetri-right img{
	width:13%;
	float:right;}


.scene2 {
	width:100%;background-color:#FFFFFF;height:220px;margin:0 auto}

.scene-img {
	width:100%;
	}
.scene-img img{
	width:100%;
	margin:0 auto;border-radius:5px
	}
	
.scene-img1 {
	width:100%;
	}
.scene-img1 img{
	width:100%;
	margin:0 auto;border-radius:5px
	}

.scene-title {
	width:100%;
	margin:0 auto}

.mid {
	width:80%;
	margin:0 auto;
	padding-top:2em;
	padding-bottom:2em}

.mid img {
	height:1px;width:100%}
	
	
.explain {
	height:auto;
	width:65%;
	margin:0 auto;padding-top:3em}
.scene-title h3{
	font-size:22px;
	color:090909;
	font-weight:400;
	margin-top:4em}

.scene-info {
	width:100%;
	margin:0 auto;}
	
.scene-info p{
	font-size:14px;
	color:#3C3C3C;
	font-weight:300;
	word-spacing:normal;
	line-height:30px;margin:0 auto;}

.features-button p {
	margin-top:-4px}

.features-head h1 {
	margin-top:2em}
.features-button {
	height:3em}
	

.about-text{
	width:100%;
	margin-top:4em}

	.about-text p {
		margin-top:1em
	}
.about-right {
	width:90%;margin:0 auto}
	
.about-info {
	width:100%;
	margin:0 auto}

.stepsinfo p {
	text-align:center}

.notice-space {
	height:2em}
.n-info {
	width:80%;
	padding:8px;
	border:2px solid #ccc;margin:0 auto;max-width:1200px;position:relative;margin-bottom:0em;border-radius:0px;margin-top:8em
}	 }
	 

@media screen and (max-width:991px){
	
		
	.steps2 {
		width:80%;
		margin:0 auto;}
	
	.stepsimg1 {
		width:100%;
		margin-top:1em}
		
	.stepsimg1 img {
		margin-top:1.3em}
	
	.stepsimg2 {
		width:100%;
		margin-top:1em;}
	
	.stepsimg2 h3 {
		width:80%;
		color:#ff7841;
		font-size:18px;
		margin-top:1em;
		padding:0em;}
	
	.responsivearrow {
		width:100%;
		height:3em}
	
	.responsivearrow img {
		width:30%;margin:0 auto}
		
	.greysteps {
		margin-top:0em}
	.stepsinfo {
		width:100%;
		margin:0 auto;
		margin-top:1em}
	
	.stepsinfo p {
		width:96%;
		margin:0 auto;
		text-align:justify;
		padding-bottom:1em;
		margin-top:2em}
	
	.stepspace {
		height:1em}
		
	.stepscategory {
		margin:0 auto}
	
	.numbers {
		width:100%;
		margin:0 auto;
		height:8em}
		
	
	}
	

@media screen and (min-width:768px) and (max-width:991px){
	.steps2 {
		width:70%;
		margin:0 auto}
	 .stepscategory {
		 border-radius:10px}
	
	.stepsinfo {
		width:80%;margin:0 auto;text-align:center}
	
	.stepsinfo p {
		text-align:center}
	
	.features-button {
		margin-top:0em}
	
	
		.n-info {
	width:95%;
	border:2px solid #ccc;
	margin-top:4em;border-radius:0px}


.features-button {
	border-radius:8px}
	
	.n-info {
	width:95%;
	padding:16px;
	border:2px solid #ccc;
	margin-top:2em;max-width:791px;border-radius:0px}
	
	@media screen and (min-width:0px) and (max-width:767px) {
		.testimonials1 {
			display:none}
			.n-info {
	width:95%;
	padding:16px;
	border:3px solid #f4f4f4;
	margin-top:5em}}
		
@media screen and (min-width:0px) and (max-width:639px) {
	.features-title {
		margin-top:1em}
	
	.features-button {
		margin-top:0em}
		
	.notice {
		margin-top:4em}
	

.n-info {
	width:95%;
	margin:50px auto auto auto;
	padding:16px;
	border:1px solid #ccc;border-radius:8px;padding:1em
}
.n-info dt#info {
	width:128px;
	height:24px;
	background-color:#00adef;
	float:none;
	border-radius:12px;
	color:#fff;
	text-align:center;
	line-height:24px;
}
.n-info dd {
	float:none;
	margin:3px;
}
.n-info dd .date {
	margin-left:0px;
	margin-right:24px;
	color:#666;
}

.about-info p {
	margin:0 auto;
	width:100%;
	margin-top:0em}

.about-info {
	width:100%;}

.about-text {
	width:90%;
	margin:0 auto}

.about {
	width:100%;
	height:auto}

	}

@media screen and (min-width:0px) and (max-width:320px){
	.testsection {
		height:auto}
	.planprice p {
		margin-top:0.5em}
	
	.pricebox {
		height:auto}
	.customise-title p {
		width:100%;
		font-size:13px}}
	
	@media screen and (min-width:321px) and (max-width:639px) {
		.testsection {
		height:auto}
	.testimonials {
		width:100%;
		margin-top:0em;height:auto}
	
	.testimonials h2 {
		text-decoration:underline;margin-top:1.5em
		}
	
	.testimonials1 {
		display:none}
	
	.testdescription {
		height:19em;
		width:100%;
		margin:1em auto}
		
	.testdescription p {
		width:100%;
		font-size:14px}
	
	.testimage1 {
		height:auto}}
		
	
	@media screen and (min-width:641px) and (max-width:767px) {
		.about-text p {
			margin-top:1.5em;
			width:100%;
			font-size:14px;margin-bottom:2em}
		
		.about-info {
			width:100%;margin:0 auto}
		
		.about-right {
			width:90%; margin:0 auto;padding-bottom:2em;margin-bottom:2em}
		
		.about {
			width:100%;
			height:270px}
			.n-info {
	width:75%;
	padding:16px;
	border:3px solid #ccc;
	margin-top:5em;border-radius:8px}

		.planprice {
			margin-top:-1.4em
		}

		.planextra {
			margin-top:-1.6em
		}
		
		.pricebox {
			height:330px
		}
      }
	
	
@media screen and (min-width:768px) and (max-width:945px) {
	.n-info {
	width:95%;
	padding:16px;
	border:2px solid #ccc;
	margin-top:6em;border-radius:0px}
	
	
.explain {
	height:auto;
	width:95%;
	margin:0 auto;margin-top:-0.6em;}

.head-buttons {
	width:100%;}

.features-topspace {
	height:2em}}
	
@media screen and (min-width : 768px){
body {
	font-size : 14px !important;
}
}
 
@media screen and (min-width : 1024px) {
body {
	font-size : 16px !important;
}
}

@media screen and (min-width:0px) and (max-width:333px) {
	#main-catch {
	width:100%;
	font-size:230%;
	line-height:1.7em;
	font-weight:bold;
	text-align:center;
	margin:0 auto;margin-top:-1em;padding-bottom:1em
	
}

#main-catch p {
	margin-left:0px}
	
	.icon-section {
	margin-top:1em}
	}
	


	
@media print {
 a[href]:after {
 content: "" !important;
 }
 
 abbr[title]:after {
 content: "" !important;
 }
}

@media screen and (min-width:0px) and (max-width:639px){
	.customise1 {
		width:100%;background-image:url(../img/customisebg.jpg);
}

}

@media screen and (min-width:0px) and (max-width:945px) {
	.about-text {
		margin-top:3em}}

	
	@media screen and (min-width:0px) and (max-width:640px){
		.n-info {
			display:none
		}
		
		.n-info h2 {
			border-radius:none;background-color:none
		}
		
		.notice-space {
			height:4em
		}
		
		.about-text p {
			margin-top:0em;
			padding-top:0em;height:200px
		}
		
		.about-right {
			padding:3em
		}
		
		
	}
	
	@media screen and (min-width:640px) and (max-width:767px){
		.about-text p {
			margin-top:4em
		}
	}
}