@charset "utf-8";
/* CSS Document */
@media only screen and (max-width:767px) {
	img{
		width: 100%;
		height: auto;
	}
	#sphead{
		width:100%;
		text-align:center;
		font-size:13px;
		line-height: 50px;
		height:50px;
		position: relative;
		background: #e8e8e8;
	}
	#sphead h1{
		padding:0;
		margin: 0;
		text-align: center;
		line-height: 50px;
		color: #333;
	}
	#sphead #menubtn{
		width:67px;
		position: absolute;
		top:0;
		right: 0;
		
		
	}
	
	.mainivsp{
		width:100%;
	}
	.mainarea{
		width:100%;
	}
	#main{
		float: none;
		width:96%;
		margin:0 auto;
	}
	.imgtextarea1{
		width:100%;
	}
	.imgtextarea1 .title{
		width:80%;
		margin:0 auto;
	}
	
	.imgtextarea1 .imgarea{
		width:35%;
	}	
	.imgtextarea1 img{
		width:100%;
	}	
	.imgtextarea1 .textarea{
		width:63%;
	}
	.titleline1{
		font-size:13px;
		color:orange;
		text-align: center;
	}
	.titleline2{
		font-size:11px;
		width: 100%;
		text-align: center;
	}	
	
	.service_listsp{
		width:100%;
	}
	.service_listsp .tab{
		width:49%;
  
	}
	.service_listsp .col.tab a{
		border-radius: 5x;        /* CSS3草案 */  
		-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
		-moz-border-radius: 5px;   /* Firefox用 */
		width:100%;
		display: block;
		color: #FFF;
		font-size:12px;
		line-height: 130%;
		text-align: center;
		padding:8% 2% 8%;
		box-sizing: border-box;
		margin:0 0 2% 0;
		text-decoration: none;
	}
	.service_listsp .col1.tab a{
		background: #81c044;
	}	
	.service_listsp .col2.tab a{
		background: #4475c0;
	}	
	.service_listsp .col3.tab a{
		background: #c0aa44;
	}	
	.service_listsp .col4.tab a{
		background: #b74f7b;
	}	
	.service_listsp img{
		width:50%;
		margin:0 auto;
		display: block;
	}
	.sptitle2{
		width:100%;
		text-align: center;
		font-size:12px;
		line-height: 150%;
		margin:2% 0 3%;
		
		border-top:1px solid #ccc;
		border-bottom:1px solid #ccc;
	}
	.sptitle2 span{
		color: orange;
		font-weight: bold;
	}
	.servicespdetail{
		padding:2% 1%;
		text-align: center;
	}
	.pan{
		font-size:12px;
		margin:1% 0;
		width:100%;
	}
	.pageimg{
		width:80%;
		
	}
	.pageimg img{
		width:100%;
		
	}
	
	.rtitle h2{
		font-size:18px;
		line-height: 140%;
	}
	
	#spmenuarea{
		width:100%;
		border-top: 1px solid #aaa;
		position: absolute;
		top:0;
		left: 0;
	}
	#spmenuarea .in{
		position: relative;
	}
	#spmenuarea ul{
		width:100%;
	}
	#spmenuarea ul li{
		width:100%;
		border-bottom: 1px solid #aaa;
	}	
	#spmenuarea ul li a{
		display: block;
		padding:4% 2%;
		color: #333;
		text-decoration: none;
		background: #FFF;
	}
	#spmenuarea ul li a:hover{
		background: #FFF0C6;	
	}
	#spclosebtn{
		width:10%;
		position: absolute;
		right: 0;
		top:0;
	}
	
	#no1.catarea .head,#no2.catarea .head {
		background: none;
		height:auto;
		margin-top: 0%;
		border-bottom: dashed #ccc 1px;
	}
	#no1.catarea .middle,#no2.catarea .middle {
		background: none;
		width: 100%;
		padding: 3px 2% 10px;
		box-sizing: border-box;
	}
	#no1.catarea .foot,#no2.catarea .foot {
		background: none;
		height: auto;
		width: 100%;
		padding-bottom: 0px;
		
	}
	.catarea {
		width: 100%;
	}
	#no1.catarea {
		border:solid #77982e 8px;
	    border-radius: 15px;        /* CSS3草案 */  
    	-webkit-border-radius: 15px;    /* Safari,Google Chrome用 */  
    	-moz-border-radius: 15px;   /* Firefox用 */  
		box-sizing: border-box;
		margin-bottom: 3%;
	}
	#no2.catarea {
		border:solid #3473bc 8px;
	    border-radius: 15px;        /* CSS3草案 */  
    	-webkit-border-radius: 15px;    /* Safari,Google Chrome用 */  
    	-moz-border-radius: 15px;   /* Firefox用 */  
		box-sizing: border-box;
		margin-bottom: 3%;
	}
	#no1.catarea .head .line_left{
		float:none;
	}
	.catarea .head h4 {
		font-size: 20px;
		padding: 2% 1% 0 2%;
	}
	.catarea .middle .textarea {
		width: 100%;
		padding:2% 3% 50px;
		box-sizing: border-box;
	}
	.catarea .middle .btn {
    	top:auto;
		bottom:10px;
		height:40px;
		margin:0 auto 10px;
	}
	.catarea .middle .btn a {
		padding-left: 30px;
		width: 108px;
		height:40px;
		display: block;
		text-decoration: none;
		color: #FFF;
		padding-top: 8px;
		font-weight: normal;

	}
	.catarea .head .titletext{
		padding:1% 2%;
	}
	.catarea .middle .imgarea.line_left{
		margin:1% auto;
		float: none;
	}
	.area .line_left{
		float: none;
		width:80%;
		margin:1% auto 2%;
	}
	.area img{
		width:100%;
	}
	.textarea2{
		width:100%;
		margin-bottom: 4%;
		margin-top: 1%;
		padding: 1% 3% 2%;
		box-sizing: border-box;
	}
	.rtitle {
		padding-left: 10px;
		padding-top: 10px;
		margin-bottom: 2%;
		border-bottom: 4px solid #df0000;
		box-sizing: border-box;
	}
	.pageimg {
		width: 100%;
		margin-top: 1%;
		margin-right: auto;
		margin-bottom: 1%;
		margin-left: auto;
		height: auto;
	}
	.text1 {
		padding-left: 2%;
		padding-right: 2%;
		padding-top: 1%;
		padding-bottom: 2%;

	}
	.suportarea .line_left{
		width:30%;
	}
	.suportarea .line_left img{
		width:100%;
	}
	.suportarea .line_right {
		width:68%;
	}
	.mtitle h2 {
		font-size: 17pt;
		line-height: 130%;
		padding-top:1%;
	}
	.suportarea h4 {
		font-size: 13pt;
	}
	#no1.corsearea .head ,
	#no2.corsearea .head ,
	#no3.corsearea .head ,
	#no4.corsearea .head {
		width: 100%;
		height: 0px;
		background:none;
		margin-top: 20px;
	}
	
	#no1.corsearea .foot,
	#no2.corsearea .foot,
	#no3.corsearea .foot,
	#no4.corsearea .foot {
		width: 100%;
		height: 0px;
		background:none;
	}
	
	#no1.corsearea .middle,
	#no2.corsearea .middle,
	#no3.corsearea .middle,
	#no4.corsearea .middle,
	#no5.corsearea .middle{
		width:100%;
		padding: 0px 2%;
		background:none;
	}
	
	.flowarea, .flowarea .head, .flowarea .middle, .flowarea .foot{
		width:96%;
		margin:0 auto;
	}
	#no1.flowarea .head,#no2.flowarea .head,#no3.flowarea .head,#no4.flowarea .head,#no5.flowarea .head,#no6.flowarea .head,#no7.flowarea .head {
		background:none;
		height:auto;
		border-bottom: dashed 1px #999;
		padding-bottom: 1%;
	}
	#no1.flowarea .head h4:before{
		content:"1.";
	}
	#no2.flowarea .head h4:before{
		content:"2.";
	}
	#no3.flowarea .head h4:before{
		content:"3.";
	}
	#no4.flowarea .head h4:before{
		content:"4.";
	}
	#no5.flowarea .head h4:before{
		content:"5.";
	}
	#no6.flowarea .head h4:before{
		content:"6.";
	}
	
	.flowarea .head .line_left,
	.flowarea .head .line_right{
		float: none;
	}
	
	.flowarea .head h4 {
		font-size:19px;
		padding:13px 10px 0 10px;
	}
	.flowarea .head .titletext {
		padding: 5px 0 0 10px;
		font-size: 12pt;
	}
	#no1.flowarea .middle,#no2.flowarea .middle,#no3.flowarea .middle,#no4.flowarea .middle,#no5.flowarea .middle,#no6.flowarea .middle,#no7.flowarea .middle {
		background:none;
		padding: 8px 20px;
		width: 100% !important;
		box-sizing: border-box;
	}
	#no1.flowarea{
		border:solid 4px #77982e;
	}
	#no2.flowarea{
		border:solid 4px #3473bc;
	}

	#no3.flowarea{
		border:solid 4px #cf0d0d;
	}
	#no4.flowarea{
		border:solid 4px #f2a11f;
	}
	#no5.flowarea{
		border:solid 4px #eb12e3;
	}

	#no6.flowarea{
		border:solid 4px #438002;
	}
	#no7.flowarea{
		border:solid 4px #95abb1;
	}
	#no1.flowarea .foot,#no2.flowarea .foot,#no3.flowarea .foot,#no4.flowarea .foot,#no5.flowarea .foot,#no6.flowarea .foot,#no7.flowarea .foot {
		background:none;
		height: 0;
		margin-bottom: 0;
	}
	.flowarea{
		margin-bottom: 5%;
		border-radius: 15px;        /* CSS3草案 */  
		-webkit-border-radius: 15px;    /* Safari,Google Chrome用 */  
		-moz-border-radius: 15px;   /* Firefox用 */  
	}
	.gtitle h2 {
		font-size: 14pt;
		line-height: 130%;
		vertical-align: middle;
		padding-top:2%;
	}
	.ptitle h2 {
		font-size: 14pt;
		line-height: 130%;
		vertical-align: middle;
		padding-top:2%;
	}
	.bannerarea2 {
		width:100%;
		margin: 0 auto 20px;
	}
	.bannerarea2in{
		width:100%;
	}
	.bannerarea2 .space {
		padding-right: 0px;
	}
	.bannerarea2 .banner {
		width: 48%;
		padding-bottom:2%;
	}
	.bannerarea2 .banner img{
		width: 100%;
		height: auto;
	}
	.bannerarea2 .banner.line_left:nth-child(even){
		float: right;
	}
	.gtitle,
	.ptitle,
	.ytitle2{
		width: auto;
		padding-right: 10px;
	}
	.planarea, .planarea .head, .planarea .foot {
		width: 100%;
	}
	#no1.planarea .head,#no2.planarea .head,#no3.planarea .head,#no4.planarea .head {
		background:none;
	}
	.planarea .head h3{
		position: static;
		padding:15px 10px;
	}
	#no1.planarea .middle,#no2.planarea .middle,#no3.planarea .middle,#no4.planarea .middle {
		padding: 10px 15px 40px;
		background:none;
	}
	#no1.planarea .foot,#no2.planarea .foot,#no3.planarea .foot,#no4.planarea .foot {
		height: 0px;
		background:none;
	}
	.planarea .middle {
		position: relative;
		width: 100%;
		box-sizing: border-box;
	}
	.planarea{
		border-radius: 15px;        /* CSS3草案 */  
		-webkit-border-radius: 15px;    /* Safari,Google Chrome用 */  
		-moz-border-radius: 15px;   /* Firefox用 */
		margin-bottom: 3%;
	}
	.planarea .head{
		border-bottom: dashed #ccc 1px;
	}
	.planarea .head img{
		border-top-left-radius: 10px;
  		border-top-right-radius: 10px;
	}
	#no1.planarea{
		border:solid 5px #a131c4;
	}
	#no2.planarea{
		border:solid 5px #38860e;
	}
	#no3.planarea{
		border:solid 5px #0072ff;
	}
	#no4.planarea{
		border:solid 5px #ff1c61;
	}

	.plandetailarea .planimg.line_left{
		float: none;
		width:60%;
		margin: 1% auto 2%;
	}
	.plandetailarea .planimg.line_left img{
		width:100%;
		height: auto;
	}
	#plandetail.line_right{
		width:100%;
	}
	#plandetail, #plandetail table {
		width: 100%;
	}
	.bannerarea3 .space {
		padding-right: 0px;
	}
	
	.bannerarea3 .banner {
		width: 48%;
	}

	.bannerarea3 .banner.line_left{
		float: left;
		padding-bottom: 3%;
	}	
	.bannerarea3 .banner.line_left:nth-child(even){ 
		float:right;
	}	
	#plandetail1, #plandetail1 table,#plandetail2, #plandetail2 table,#plandetail3, #plandetail3 table,#plandetail4, #plandetail4 table,#plandetail5, #plandetail5 table {
		width: 100%;
	}
	
	/*corse*/
	.corsearea .middle .line_left{
		float: none;
		width:40%;
		margin:2% auto ;
	}
	.corsearea .middle .line_right{
		float: none;
		width:96%;
		margin:0% auto 4%;
	}
	#no1.corsearea .middle .line_right h3{
		width: 100%;
	}
	.ptitle2,.btitle{
		box-sizing: border-box;
		padding-top: 5px;
	}
	.corsearea {
		width: 100%;
		padding-bottom: 0px;
	}
	.textmiddle, .detailtextarea {
		width: 100%;
		box-sizing: border-box;
	}
	#contact_areain table th{
		width:35%;
	}
	#contact_areain table td{
		width:65%;
	}

	#contact_areain table input, #contact_areain table select{
				width: 100%;
		box-sizing: border-box;
	}

}