@charset "utf-8";

/*** ------------------------------------------------------------------------------ 

ホーム（#home）

-----------------------------------------------------------------------------  ***/
#home .flexslider{
	display: block;
}
#home .flexslider_sp{
	display: none;
}

#home .section {
	margin:0 0 40px;
	padding:0 0 25px;
	border-bottom:#CCCCCC 1px solid;
	text-align: center;
}
#home .section p{
	font-size:1.333em;
	margin:0 0 2em;
}
#home .section h2{
	margin:0 0 25px;
	text-indent:-9999px;
}
	#home .cBox01 h2{
		background:url(../../img/img01.png) no-repeat center top;
		height:70px;
	}
	#home .cBox02 h2{
		background:url(../../img/img03.png) no-repeat center top;
		height:70px;
	}
	#home .cBox03 h2{
		background:url(../../img/img05.png) no-repeat center top;
		height:29px;
	}
	#home .cBox04 h2{
		background:url(../../img/img07.png) no-repeat center top;
		height:29px;
	}

#home .cBox02 .sp_none{
	display: block;
}
#home .cBox02 .pc_none,
#home .cBox03 .pc_none{
	display: none;
}

#home .type ul{
	margin:0 0 0 -21px;
}
#home .type ul.sp_none{
	display: block;
}
#home .type ul.pc_none{
	display: none;
}
#home .type ul li{
	margin:0 0 0 21px;
	float:left;
}
#home .support {
	padding:0;
	border:none;
}

#home #cont .support .contact{
	position:relative;
}
#home #cont .support .contact p{
	background: url(../../img/img08.jpg) no-repeat;
	height:210px;
	text-indent:-9999px;
}
#home #cont .support .contact .contact-image{
	display: none;
}
#home #cont .support .contact ul{
	position:absolute;
	left:346px;
	top:116px
}
#home #cont .support .contact ul li{
	float:left;
	margin:0 10px 0 0;
}
#home #cont .support .contact ul li a{
	width:200px;
	height:60px;
	display:block;
	text-indent:-9999px;
}
#home #cont .support .contact ul li.pc_none{ display: none;}
#home #cont .support .contact ul li.text a{ background: url(../../img/btn_material.png) no-repeat left center;}
#home #cont .support .contact ul li.mitsumori a{ background: url(../../img/btn_estimate.png) no-repeat left center;}
#home #cont .support .contact ul li.text a:hover,
#home #cont .support .contact ul li.mitsumori a:hover{ opacity:0.7;}


@media screen and (max-width:737px){
	#home .flexslider{
		display: none;
	}
	#home .flexslider_sp{
		display: block;
	}
	#home .section {
		margin:0 0 15px;
		padding:0 0 10px;
		text-align: left;
	}
	#home .section p{
		margin:0 0 15px 0;
		font-size: 14px;
	}
	#home .section p img{
		max-width: 100%;
		height:auto;
	}
	#home .type ul{
		text-align:center;
		margin:0;
	}
	#home .type ul.sp_none{
		display: none;
	}
	#home .type ul.pc_none{
		display: block;
		text-align:left;
	}
	#home .type ul.pc_none li a{
		display: block;
		padding:10px 45px 10px 0;
		background: url(../../img/img06_8.jpg) no-repeat right 5px center;
		background-size:18px auto;
		border-bottom:1px dotted #ccc;
		box-sizing:border-box;
		text-decoration:none;
	}
	#home .type ul.pc_none li:last-child a{
		border-bottom: none;
	}
	#home .type ul.pc_none li a img{
		max-width: 100%;
	}
	#home .type ul.pc_none li span{
		display:block;
		padding:5px 0 0 0;
	}
	
	#home .type ul li{
		margin:0 0 10px;
		float: none;
	}
	#home .type ul li img{
		max-width: 100%;
		height:auto;
	}
	#home .section h2{
		margin: 0 0 15px 0;
		background: none;
		height: auto;
		text-indent:0;
		line-height:1.4;
		font-size:18px;
		font-weight:bold;
	}
		#home .cBox01 h2{ color:#e95082;}
		#home .cBox02 h2{ color:#f4a840;}
		#home .cBox03 h2{ color:#1eb052;}
		#home .cBox04 h2{ color:#4287c6;}

	#home .cBox02 .sp_none{
		display: none;
	}
	#home .cBox02 .pc_none,
	#home .cBox03 .pc_none{
		display: block;
	}
	#home .cBox03 .pc_none{
		text-align:center;
		max-width: 100%;
	}
	
	#home #cont .support .contact{
		background: url(../../img/bg-contact.png) !important;
		padding:10px;
		border-radius:8px;
		position: relative;
	}
	#home #cont .support .contact p{
		background: none;
		height:auto;
		margin:0 0 5px 0;
		padding:0 95px 0 0;
		box-sizing:border-box;
		text-indent: 0;
		font-size:14px;
		font-weight:bold;
		line-height:1.4;
	}
	#home #cont .support .contact .contact-image{
		display:block;
		position:absolute;
		top:-30px;
		right:5px;
		padding:0;
	}
	#home #cont .support .contact .contact-image img{
		width:100px;
	}
	
	#home #cont .support .contact ul{
		background:#fff;
		margin:0 0 0 0;
		padding:15px 10px;
		border-radius:8px;
		position: relative;
		top:inherit;
		left:inherit;
		z-index:10;
	}
	#home #cont .support .contact ul li{
		float:none;
		margin:0 0 10px 0;
		text-align:center;
	}
	#home #cont .support .contact ul li:last-child{
		margin:0;
	}
	#home #cont .support .contact ul li.pc_none{
		text-align:left;
		display:block;
	}
	#home #cont .support .contact ul li a{
		width:auto;
		height:auto;
		margin:0 0 5px 0;
		padding:10px;
		display: block;
		color:#fff;
		border-radius:8px;
		text-align:center;
		text-indent:0;
	}
	#home #cont .support .contact ul li.pc_none span{
		font-size:12px;
	}
	#home #cont .support .contact ul li.pc_none a{
		background: url(../../img/icon_tel01.jpg) no-repeat left 10px center #ffab2e;
	}
	#home #cont .support .contact ul li.text a{
		background: url(../../img/icon_text01.jpg) no-repeat left 10px center #3980c4;
	}
	#home #cont .support .contact ul li.mitsumori a{
		background: url(../../img/icon_mitsumori01.jpg) no-repeat left 10px center #e5326c;
	}
}


/*** ------------------------------------------------------------------------------ 

PUZZLEとは（#about）

-----------------------------------------------------------------------------  ***/
#about #cont h1{
	padding:5px 25px;
	background:url(../../img/about/bg-about.png);
	color:#fff;
	font-size:19px;
	font-weight:bold;
}
#about #cont .about .section-cont .catch{
	background:url(../../img/about/img02.png) no-repeat center top;
	height:73px;
	text-indent:-9999px;
	text-align:left;
}
#about #cont p{
	font-size:1em;
}
#about #cont .about .section-cont > p{
	text-align: center;
	font-size:1.333em;
	margin:0 0 40px;
}

#about #cont .section .box_list {
    display: flex;
	flex-wrap: wrap;
}

#about #cont .section .block{
	border:#CCC 1px solid;
    padding: 20px;
	width: 432px;
    margin: 0 10px 10px 0;
    display: flex;
    flex-wrap: wrap;
}
#about #cont .section .block.cBox01,
#about #cont .section .block.cBox02{
	padding: 20px 20px 50px;
}
#about #cont .section .block.right{
	margin:0 0 10px;
}
#about #cont .section .block.wide{
	width: auto;
	float:none;
	clear:both;
}
#about #cont .section .block h3{
	margin:0 0 15px;
}
#about #cont .section .block p{
	margin:0;
}
#about #cont .section .block img{
	margin:0 0 15px;
}
#about #cont .section .block p.img{
	float:left;
	font-size: 0.9em;
    text-align: right;
}
#about #cont .section .block h3 img,
#about #cont .section .block p.img img{
	margin:0;
}
#about #cont .section .block .text{
	padding:0;
    width: 100%;
}
#about #cont .section .btn_link{
    display: flex;
    justify-content: flex-end;
}
#about #cont .section .block .more-link {
	text-align: center;
    font-size: 1.083em;
    width: 30%;
}
#about #cont .section .block .more-link.pc_none{
	display: none;
}
#about #cont .section .block .more-link.sp_none{
	display: block;
}
#about #cont .section .block .more-link a{
	display:inline-block;
	background:#EEEEEE;
	padding:5px 20px;
}
#about #cont .section .block .more-link a:hover{
	background:#FBC70D;
	text-decoration: none;
}

#about #cont .attention h2{
	border-left:#999999 8px solid;
	background:#F1F1F1;
	padding:10px;
	font-size:1.333em;
}
/*#about #cont .attention .block{
	width: 463px;
}*/

#about #cont .section .block h3 .pc_none{ display: none;}

#about #cont .section .block h3{
	width:435px;
	text-indent:-9999px;
}
#about #cont .section .cBox01 h3{
	background:url(../../img/about/img03.png) no-repeat left center;
	height:58px;
}
#about #cont .section .cBox02 h3{
	background:url(../../img/about/img05.png) no-repeat left center;
	height:58px;
}
#about #cont .section .cBox03 h3{
	background:url(../../img/about/img06.png) no-repeat left center;
	height:29px;
}
#about #cont .section .cBox04 h3{
	background:url(../../img/about/img08.png) no-repeat left center;
	height:29px;
}
#about #cont .section .cBox05 h3{
	background:url(../../img/about/img10.png) no-repeat left center;
	height:27px;
}
#about #cont .section .cBox06 h3{
	background:url(../../img/about/img12.png) no-repeat left center;
	height:29px;
}
#about #cont .section .cBox07 h3{
	background:url(../../img/about/img14.png) no-repeat left center;
	width:920px;
	height:29px;
}
#about #cont .section .cBox08 h3{
	background:url(../../img/about/img16.png) no-repeat left center;
	height:29px;
}
#about #cont .section .cBox09 h3{
	background:url(../../img/about/img17.png) no-repeat left center;
	height:29px;
}
#about #cont .section .cBox10 h3{
	background:url(../../img/about/img19.png) no-repeat left center;
	height:29px;
}
#about #cont .section .cBox11 h3{
	background:url(../../img/about/img20.png) no-repeat left center;
	height:29px;
}


#about #cont .attention .block.right{
	width:403px;
}
#about #cont .attention .block p{
	margin:0 0 1em;
}
#about #cont .attention .block table{
	font-size:1.083em;
}
#about #cont .attention .block table.data{
	margin:0;
}
#about #cont .attention .block table th{
	vertical-align: top;
	padding:0 0 1em;
	width:130px;
}
#about #cont .attention .size table th{
	width:100px;
}
#about #cont .attention .block table td{
	vertical-align: top;
	padding:0 0 1em 10px;
	position:relative;
}
#about #cont .attention .block table td:after{
	position:absolute;
	content:":";
	left:0;
	top:0;
	display:block;
}
#about #cont .attention .block table tr:last-child th{
	padding:0;
}
#about #cont .attention .block table tr:last-child td{
	padding:0 0 0 10px;
}
#about #cont .attention .block .img{
	float:right;
}
#about #cont .attention .block .img img{
	margin:0 0 10px !important;
}
#about #cont .attention .block .text{
	float:left;
	width:200px;
	padding:0;
}
#about #cont .attention .block ul{
	font-size:1em;
}
#about #cont .attention .block ul li{
	margin:0 0 0 1.2em;
	text-indent:-1.2em;
}

#about #cont .section .cBox07 .sp_none{
	display:block;
}
#about #cont .section .cBox07 .pc_none{
	display:none;
}

@media screen and (max-width:737px){
	#about #cont h1{
		padding:5px 15px;
		font-size:18px;
		margin:0 -3% 20px;
	}
	#about #cont .about .section-cont > p{
		text-align:left;
		font-size:14px;
		margin:0 0 15px;
	}
	#about #cont .about .section-cont .catch{
		background: none;
		height: auto;
		text-indent:0;
		font-size:16px;
		font-weight:bold;
	}
	#about #cont .section .block h3{
		background: none;
		width:auto;
		height: auto;
		text-indent:0;
		font-size:16px;
		font-weight:bold;
		color:#f29c27;		
	}
	#about #cont .section .cBox08 h3,
	#about #cont .section .cBox09 h3,
	#about #cont .section .cBox10 h3,
	#about #cont .section .cBox11 h3{
	    color:#777;
	}
	#about #cont .section .block h3 span{
		display:block;
		font-size:10px;
		font-weight:normal;
	    color: rgb(51, 51, 51);
	}
	#about #cont .section .block h3 .pc_none{ display: block;}
	#about #cont .section .block.cBox01,
	#about #cont .section .block.cBox02{
		padding: 20px;
	}
	#about #cont .section .block{
		width: auto;
		float: none;
		margin: 10px 0;
	}
	#about #cont .section .block.right{
		width:auto;
		float: none;
		margin: 10px 0;
	}
	#about #cont .section .block img{
		max-width: 100%;
		height: auto;
	}
	#about #cont .section .block p.img {
	    float: none;
		text-align:center;
		margin-bottom:10px;
		font-size: 1.0em;
	}
	#about #cont .section .block p.img-center {
		text-align:center;
	}
		#about #cont .section .block p.img  img{
			max-width: 100%;
			height:auto;
		}
	#about #cont .section .block .text {
		float:none;
		width:auto;
		padding: 0;
	}
	#about #cont .section .block .more-link{
		position:static;
		text-align:center;
	}
	
	#about #cont .section .block .more-link.pc_none{
		display: block;
	}
	#about #cont .section .block .more-link a,
	#about #cont .section .block .more-link.pc_none a{
		display:inline-block;
		margin:15px 0;
		padding:15px 25px;
		border-radius:8px;
		font-weight:bold;
		border:1px solid #e1e1e1;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+50,e1e1e1+51,f6f6f6+100;White+Gloss+%231 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
	}
	#about #cont .section .block .more-link.sp_none{
		display: none;
	}
	#about #cont .section .cBox07 .sp_none{
		display: none;
	}
	#about #cont .section .cBox07 .pc_none{
		display: block;
	}
}

/*** ------------------------------------------------------------------------------ 

ラインナップ（#lineup）

-----------------------------------------------------------------------------  ***/
#lineup #cont h1{
	padding:5px 25px;
	background:url(../../img/lineup/bg-lineup.png);
	color:#fff;
	font-size:19px;
	font-weight:bold;
}
#lineup #cont .section-cont .catch{
	background:url(../../img/lineup/img02.png) no-repeat center top;
	height:34px;
	text-indent:-9999px;
	text-align:left;
}
#lineup #cont .headline {
	margin:0 0 40px;
	border-bottom: 1px #CCCCCC solid;
	padding:0 0 20px;
}
#lineup #cont .headline .section-cont > p{
	text-align: center;
	font-size:1.333em;
}
#lineup #cont .headline .section-cont > p.catch{
	margin:0 0 40px;
}
#lineup #cont .type {
	margin:0 0 50px;
	border-bottom: 1px #CCCCCC solid;
	padding:0 0 30px;
}



#lineup #cont #simple .img  p{ margin:8px 0 0 0;}
#lineup #cont #simple .section-cont .sp_none{ display:block;}
#lineup #cont #simple .section-cont .pc_none{ display:none;}

#lineup #cont #lite .img  p{ margin:0 0 8px 0;}
#lineup #cont #lite .section-cont .sp_none{ display:block;}
#lineup #cont #lite .section-cont .pc_none{ display:none;}

#lineup #cont #booklet .img p:nth-of-type(1){ margin:18px 0 8px 0;}
#lineup #cont #booklet .section-cont .sp_none{ display:block;}
#lineup #cont #booklet .section-cont .pc_none{ display:none;}






#lineup #cont .type:nth-child(3) {
	padding:0 0 30px;
}
#lineup #cont .type .img{
	width:661px;
	float:left;
	overflow:hidden;
}
#lineup #cont .type h2{
	float:left;
}
#lineup #cont .type:nth-child(4) h2{
	padding:18px 0 0;
}
#lineup #cont .type .section-cont{
	padding:0 0 0 670px;
	width:290px;
}
#lineup #cont .type .section-cont p{
	margin:0 0 10px;
}
#lineup #cont .type .section-cont p.attention{
	font-size:0.917em;
	margin:0;
}
#lineup #cont .type .section-cont table{
	width:100%;
	border:#CCCCCC 1px solid;
	margin:0;
}
#lineup #cont .type .section-cont table th{
	border:#CCCCCC 1px solid;
	width:70px;
	background: #EEEEEE;
	text-align: center;
	padding:9px 0;
}
#lineup #cont .type .section-cont table td{
	padding:9px 10px;
	border:#CCCCCC 1px solid;
}
#lineup #cont .type:nth-child(3) .section-cont table th{
	padding:6px 0;
}
#lineup #cont .type:nth-child(3) .section-cont table td{
	padding:6px 10px;
}

@media screen and (max-width:737px){
	#lineup #cont h1{
		padding:5px 15px;
		font-size:18px;
		margin:0 -3% 20px;
	}
	#lineup #cont .section-cont .catch {
		background: none;
		height: auto;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
	}
	#lineup #cont .headline{
		margin: 0 0 30px;
	}
	#lineup #cont .headline .section-cont > p,
	#lineup #cont .headline .section-cont > p.catch{
		text-align: left;
		font-size: 15px;
		margin:0 0 15px;
	}
	#lineup #cont .type .img{
		width: auto;
		float: none;
		text-align:center;
	}
	#lineup #cont .type .img h2{
		float: none;
		margin-bottom:0;
	}
	
	#lineup #cont #simple{ margin:0 0 30px;}
	#lineup #cont #simple .img  p{ margin:0 0 8px 0;}
	#lineup #cont #simple .section-cont .sp_none{ display: none;}
	#lineup #cont #simple .section-cont .pc_none{
		display: block;
		background:#f2971b;
		padding:10px 0;
	}
	
	#lineup #cont #lite{ margin:0 0 30px;}
	#lineup #cont #lite .img  p{ margin:0 0 8px 0;}
	#lineup #cont #lite .section-cont .sp_none{ display: none;}
	#lineup #cont #lite .section-cont .pc_none{
		display: block;
		background:#e6326d;
		padding:10px 0;
	}
	
	#lineup #cont #booklet{ margin:0 0 30px;}
	#lineup #cont #booklet  .img h2{ padding:0;}
	#lineup #cont #booklet .img p:nth-of-type(1){ margin:0 0 8px 0;}
	#lineup #cont #booklet .section-cont .sp_none{ display: none;}
	#lineup #cont #booklet .section-cont .pc_none{
		display: block;
		background:#3981c4;
		padding:10px 0;
	}
	
	#lineup #cont .type .img img{
		max-width: 100%;
	}
	#lineup #cont .type .section-cont {
		padding: 0;
		width: auto;
	}
	#lineup #cont .type .section-cont p{
		margin:0;
	}
	#lineup #cont .type .section-cont > p {
		text-align:center;
	}
	#lineup #cont .type .section-cont > p img{
		max-width: 100%;
		height:auto;
	}
	#lineup #cont .type .section-cont table{
		margin-bottom:0;
	}
}

/*** ------------------------------------------------------------------------------ 

みんなのアルバム（#sample）

-----------------------------------------------------------------------------  ***/
#sample #cont h1{
	padding:5px 25px;
	background:url(../../img/album/bg-album.png);
	color:#fff;
	font-size:19px;
	font-weight:bold;
}
#sample #cont .section-cont .catch{
	background:url(../../img/album/img02.png) no-repeat center top;
	height:73px;
	text-indent:-9999px;
	text-align:left;
}

#sample #cont .headline .section-cont > p{
	text-align: center;
	font-size:1.333em;
}
#sample #cont .headline .section-cont > p.catch{
	margin:0 0 40px;
}

#sample #cont .sample h2{
	background:url(../../img/album/img03.png) no-repeat;
	height:30px;
	text-indent:-9999px;
	text-align:left;
	margin:0 0 40px;
}
#sample #cont .sample ul {
	margin:0 0 0 -52px;
}
#sample #cont .sample ul li{
	float:left;
	width:200px;
	margin:0 0 0 52px;
	height:257px;
	text-align: center;
}
#sample #cont .sample ul li img{
	box-shadow: 3px 3px 4px 0px #999;
	margin:0 0 15px;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}
#sample #cont .sample ul li img:hover{
    -webkit-transform: scale(1.1);  
    -moz-transform: scale(1.1);  
    transform: scale(1.1);  
	box-shadow: none;
}
#sample #cont .sample ul li strong{
	font-size: 1.286em;
}

@media screen and (max-width:737px){
	#sample #cont h1{
		padding:5px 15px;
		font-size:18px;
		margin:0 -3% 20px;
	}
	#sample #cont .section-cont .catch {
		background: none;
		height: auto;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
	}
	#sample #cont .headline .section-cont > p,
	#sample #cont .headline .section-cont > p.catch{
		text-align: left;
		margin:0 0 15px;
	}
	#sample #cont .sample h2 {
		background: #e7e7e7;
		height: auto;
		padding:5px 15px;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
		border-radius:8px;
	}
	#sample #cont .sample ul {
		margin: 0;
	}
	#sample #cont .sample ul li {
		width: 49%;
		margin: 0 2% 5% 0;
		height: auto;
	}
	#sample #cont .sample ul li:nth-child(2n){
		margin: 0;
	}
	#sample #cont .sample ul li img{
		max-width: 100%;
		height:auto;
	}
	#sample #cont .sample ul li strong{
		display:block;
	}
	#sample #cont .sample ul li br{
		display: none;
	}
}


/*** ------------------------------------------------------------------------------ 

つくり方ガイド（#guide）

-----------------------------------------------------------------------------  ***/
#guide #cont h1{
	padding:5px 25px;
	background:url(../../img/guide/bg-guide.png);
	color:#fff;
	font-size:19px;
	font-weight:bold;
}
#guide #cont .section-cont .catch{
	background:url(../../img/guide/img02.png) no-repeat center top;
	height:37px;
	text-indent:-9999px;
	text-align:left;
}
#guide #cont .headline .section-cont > p{
	text-align: center;
	font-size:1.333em;
}
#guide #cont .headline .section-cont > p.catch{
	margin:0 0 40px;
}
#guide #cont .guide-line .link dl,
#guide #cont .guide-line .link dl ul{
	font-size:1em;
}
#guide #cont .guide-line{
	width:800px;
	margin: 0 auto 40px !important;
}
#guide #cont .guide-line a{
	outline:none;
}
#guide #cont .guide-line a:link {
	color: #0099CC;
	text-decoration: underline;
}
#guide #cont .guide-line a:visited {
	color: #0099CC;
	text-decoration:underline;
}
#guide #cont .guide-line a:hover {
	color: #0099CC;
	text-decoration:none;
}
#guide #cont .guide-line a:active {
	color: #0099CC;
	text-decoration:none;
}
@media screen and (max-width:737px){
	#guide #cont h1{
		padding:5px 15px;
		font-size:18px;
		margin:0 -3% 20px;
	}
	#guide #cont .section-cont .catch {
		background: none;
		height: auto;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
	}
	#guide #cont .headline .section-cont > p,
	#guide #cont .headline .section-cont > p.catch{
		text-align: left;
		font-size: 15px;
		margin:0 0 15px;
	}
	#guide #cont .guide-line {
		width: auto;
		margin: 0 auto 40px !important;
	}
	#guide .section .hide .content h4 {
		padding: 30px 0 0 20px;
		float: none;
		width: auto;
	}
	#guide .section .hide .content .inner {
		margin: 0;
		padding: 20px;
	}
	#guide .section .hide .content .inner img{
		max-width: 100%;
		height:auto;
	}
	#guide .section h3 {
		border-bottom: #CCC 1px dotted;
		padding: 10px 20px 10px 10px;
		font-size: 1.333em;
		background: url(../../img/guide/help_icon_arrow.png) right -5px top 15px no-repeat;
		border-left: #CCC 1px solid;
		border-right: #CCC 1px solid;
		cursor: pointer;
		font-size:15px;
	}
	#guide #cont .guide-line .link dl,
	#guide #cont .guide-line .link dl ul{
		font-size:15px;
	}
}


/*** ------------------------------------------------------------------------------ 

よくあるご質問（#qa）

-----------------------------------------------------------------------------  ***/
#qa #cont h1{
	padding:5px 25px;
	background:url(../../img/qa/bg-qa.png);
	color:#fff;
	font-size:19px;
	font-weight:bold;
}
#qa #cont .section-cont .catch{
	background:url(../../img/qa/img02.png) no-repeat center top;
	height:74px;
	text-indent:-9999px;
	text-align:left;
}
#qa #cont .headline .section-cont > p{
	text-align: center;
	font-size:1.333em;
	margin:0 0 30px;
}
#qa #cont .headline .section-cont > p.catch{
	margin:0 0 30px;
}
#qa #cont .headline ul{
	width:834px;
	margin:0 auto;
	font-size:1.333em;
	padding:0 38px 0 0;
}
#qa #cont .headline ul li{
	margin:0 0 30px 38px;
	float:left;
	width:240px;
}
#qa #cont .headline ul li a{
	display:block;
	border-radius:5px;
	text-align: center;
	background: #CCCCCC;
	font-weight: bold;
	padding:10px 0;
}
#qa #cont .headline ul li a:hover{
	text-decoration: none;
	background: #3981C4;
	color:#FFF;
}
#qa #cont .qa {
	width:800px;
	margin:0 auto 40px;
}
#qa #cont .qa h2{
	font-size:1.333em;
	color:#3980C4;
	border-left:5px #3980C4 solid;
	font-weight: bold;
	padding:0 0 0 15px;
}
#qa #cont .qa dl{
	border-top:#CCC 1px solid;
	border-left:#CCC 1px solid;
	border-right:#CCC 1px solid;
	font-size:1em;
}
#qa #cont .qa dl dt a{
	display:block;
	background: url(../../img/qa/icon_q.png) 15px center no-repeat;
	padding:10px 25px 10px 55px;
	font-size:1.333em;
	border-bottom:#CCC 1px solid;
	position:relative;
}
#qa #cont .qa dl dt a:after{
	content:"";
	display:block;
	width:17px;
	height: 17px;
	background: url(../../img/qa/icon_arrow_close.png) no-repeat;
	position:absolute;
	top:13px;
	right:15px;
}
#qa #cont .qa dl dt.double a:after{
	top:25px;
}
#qa #cont .qa dl dt a.open,
#qa #cont .qa dl dt a:hover{
	border-bottom:#CCC 1px dotted;
	text-decoration: none;
	background: url(../../img/qa/icon_q.png) 15px center no-repeat #D1F1F5;
}
#qa #cont .qa dl dt a.open:after{
	background: url(../../img/qa/icon_arrow_open.png) no-repeat;
}
#qa #cont .qa dl dd{
	padding:20px 15px 20px 55px;
	background: url(../../img/qa/icon_a.png) 15px 20px no-repeat;
	font-size:1.333em;
	display:none;
	border-bottom:#CCC 1px solid;
}
#qa #cont .qa dl dd a{
	outline:none;
}
#qa #cont .qa dl dd a:link {
	color: #0099CC;
	text-decoration: underline;
}
#qa #cont .qa dl dd a:visited {
	color: #0099CC;
	text-decoration:underline;
}
#qa #cont .qa dl dd a:hover {
	color: #0099CC;
	text-decoration:none;
}
#qa #cont .qa dl dd a:active {
	color: #0099CC;
	text-decoration:none;
}
@media screen and (max-width:737px){
	#qa #cont h1{
		padding:5px 15px;
		font-size:18px;
		margin:0 -3% 20px;
	}
	#qa #cont .section-cont .catch {
		background: none;
		height: auto;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
	}
	#qa #cont .headline .section-cont > p,
	#qa #cont .headline .section-cont > p.catch{
		text-align: left;
		font-size: 15px;
		margin:0 0 15px;
	}
	#qa #cont .headline ul{
		width: auto;
		padding:0 10px;
	}
	#qa #cont .headline ul li{
		width: auto;
		margin:0 0 10px 0;
		float:none;
	}
	#qa #cont .qa{
		width: auto;
		margin: 0 auto 40px;
	}
	#qa #cont .qa dl br{
		display:none;
	}
	#qa #cont .qa dl dt a{
	    padding: 10px 30px 10px 55px;
		font-size:15px;
	}
	#qa #cont .qa dl dd {
		font-size: 15px;
	}
}


/*** ------------------------------------------------------------------------------ 

ご納品までの流れ（#flow）

-----------------------------------------------------------------------------  ***/
#flow #cont h1{
	padding:5px 25px;
	background:url(../../img/flow/bg-flow.png);
	color:#fff;
	font-size:19px;
	font-weight:bold;
}
#flow #cont .section-cont .catch{
	background:url(../../img/flow/img02.png) no-repeat center top;
	height:35px;
	text-indent:-9999px;
	text-align:left;
}

#flow #cont .headline .section-cont > p{
	text-align: center;
	font-size:1.333em;
	margin:0 0 30px;
}
#flow #cont .headline .section-cont > p.catch{
	margin:0 0 30px;
}

#flow #cont .step{
	padding:0 0 50px;
	background: url(../../img/flow/img06.png) center bottom no-repeat;
	margin:0 0 40px;
	position:relative;
}
#flow #cont .step.no06{
	background: none;
	padding:0;
	margin:0 0 70px;
}
#flow #cont .step .inner{
	border-radius:10px;
	border:#CCC 1px solid;
	padding:30px;
}
#flow #cont .step:after{
	content:"";
	display:block;
	width:191px;
	height:110px;
	position:absolute;
	left:0;
	top:0;
}
#flow #cont .step.no01:after{
	background: url(../../img/flow/img_step01.png) no-repeat;
}
#flow #cont .step.no02:after{
	background: url(../../img/flow/img_step02.png) no-repeat;
}
#flow #cont .step.no03:after{
	background: url(../../img/flow/img_step03.png) no-repeat;
}
#flow #cont .step.no04:after{
	background: url(../../img/flow/img_step04.png) no-repeat;
}
#flow #cont .step.no05:after{
	background: url(../../img/flow/img_step05.png) no-repeat;
}
#flow #cont .step.no06:after{
	background: url(../../img/flow/img_step06.png) no-repeat;
}
#flow #cont .step h2{
	text-align: center;
	padding:0 0 20px;
	border-bottom: #CCC 1px solid;
	width:800px;
	margin:0 auto 20px;
}
#flow #cont .step.no01 h2{
	background:url(../../img/flow/img03.png) no-repeat center top;
	height:27px;
	text-indent:-9999px;
	text-align:left;
}
#flow #cont .step.no02 h2{
	background:url(../../img/flow/img07.png) no-repeat center top;
	height:28px;
	text-indent:-9999px;
	text-align:left;
}
#flow #cont .step.no03 h2{
	background:url(../../img/flow/img09.png) no-repeat center top;
	height:28px;
	text-indent:-9999px;
	text-align:left;
}
#flow #cont .step.no04 h2{
	background:url(../../img/flow/img10.png) no-repeat center top;
	height:28px;
	text-indent:-9999px;
	text-align:left;
}
#flow #cont .step.no05 h2{
	background:url(../../img/flow/img11.png) no-repeat center bottom;
	height:28px;
	text-indent:-9999px;
	text-align:left;
}
#flow #cont .step.no06 h2{
	background:url(../../img/flow/img12.png) no-repeat center top;
	height:28px;
	text-indent:-9999px;
	text-align:left;
}

#flow #cont .step.no05 h2{
	border: none;
	padding:20px 0 0;
}
#flow #cont .step p{
	text-align: center;
	font-size:1.25em;
	margin:0 0 2em;
}
#flow #cont .step.no04 p,
#flow #cont .step.no05 p,
#flow #cont .step.no06 p{
	margin:0;
}
#flow #cont .step p strong {
	font-size:1.067em;
}
#flow #cont .step p.balloon{
	position:absolute;
	top:30px;
	right:50px;
}
#flow #cont .step.no06 p.balloon{
	top:125px;
}
#flow #cont .step.no01 p span{
	color: #FFF;
	background:#E6326D;
	display:inline-block;
	padding:0 5px;
	font-size:0.813em;
	margin:0 5px 0 0; 
}
#flow #cont .step.no01 .contact{
	position:relative;
}
#flow #cont .step.no01 .contact p{
	margin:0;
	background: url(../../img/flow/img05.jpg) no-repeat left top;
	height:200px;
    background-size: contain;
	text-indent:-9999px;
}
#flow #cont .step.no01 .contact p.contact-image{
	display: none;
}

#flow #cont .step.no01 .contact ul{
	position:absolute;
	left:316px;
	top:106px;
}
#flow #cont .step.no01 .contact ul li{
	float:left;
	margin:0 10px 0 0;
}
#flow #cont .step.no01 .contact ul li a{
	width:190px;
	height:60px;
	display:block;
	text-indent:-9999px;
}
#flow #cont .step.no01 .contact ul li.pc_none{ display: none;}
#flow #cont .step.no01 .contact ul li.text a{ background: url(../../img/btn_material.png) no-repeat left center; background-size: 190px;}
#flow #cont .step.no01 .contact ul li.mitsumori a{ background: url(../../img/btn_estimate.png) no-repeat left center; background-size: 190px;}
#flow #cont .step.no01 .contact ul li.text a:hover,
#flow #cont .step.no01 .contact ul li.mitsumori a:hover{ opacity:0.7;}

#flow #cont .step dl{
	width:600px;
	margin:0 auto -30px;
	font-size:1em;
}
#flow #cont .step dt{
	width:120px;
	text-align: center;
	font-weight: bold;
	background: #E6326D;
	color:#FFFFFF;
	font-size:1.5em;
	float:left;
	clear:both;
	margin:0 0 30px;
}
#flow #cont .step dd{
	margin:0 0 30px 140px;
	color:#E6326D;
	font-size:1.417em;
	line-height:1.4;
	font-weight: bold;
}
#flow #cont .step.no03 ul{
	width:600px;
	margin:0 auto;
	font-size:1.333em;
	font-weight: bold;
}
#flow #cont .step.no03 ul li{
	padding:0 0 0 20px;
	background: url(../../img/flow/icon_cube.png) left center no-repeat;
	margin:0 0 10px;
}
#flow #cont .step.no06 dl{
	width:730px;
	padding:0 0 0 50px;
}
#flow #cont .step.no06 dt{
	width:170px;
	padding:5px 0 5px 10px;
}
#flow #cont .step.no06 dd{
	margin:0 0 30px 200px;
	color:#E6326D;
	font-weight: bold;
	padding:10px 0 0;
}
#flow #cont .step.no06 dt.blue{
	background:#3981C4;
}
#flow #cont .step.no06 dd.blue{
	color:#3981C4;
	padding:12px 0 0;
}
#flow #cont .step.no06 dd.blue span{
	color:#333;
	font-size:0.746em;
	font-weight: normal;
}
@media screen and (max-width:737px){
	#flow #cont h1{
		padding:5px 15px;
		font-size:18px;
		margin:0 -3% 20px;
	}
	#flow #cont .section-cont .catch {
		background: none;
		height: auto;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
	}
	#flow #cont .headline .section-cont > p,
	#flow #cont .headline .section-cont > p.catch{
		text-align: left;
		font-size: 15px;
		margin:0 0 15px;
	}
	#flow #cont .step .inner {
		padding: 30px 15px 20px 20px;
	}
	#flow #cont .step{
		margin:0 0 30px;
	}
	#flow #cont .section.step h2{
		width: 100%;
		background: none;
		height: auto;
		text-align:center;
		text-indent: 0;
		font-size: 16px;
		font-weight: bold;
		color:#a5549c;
	}
	#flow #cont .step h2 img{
		max-width: 100%;
		height:auto;
	}
	#flow #cont .step p.balloon {
		position: absolute;
		top: -30px;
		right: 0;
	}
	#flow #cont .step p.balloon img{
		width:65%;
		height:auto;
	}
	#flow #cont .step.no03 ul{
		width:auto;
	}
	#flow #cont .step.no03 ul li{
		background: url(../../img/flow/icon_cube.png) left top 4px no-repeat;
	}
	#flow #cont .step dl{
		width:auto;
		
	}
	#flow #cont .step dt{
		float:none;
		margin-bottom:15px;
	}
	#flow #cont .step dd{
		margin:0 0 30px;
	}
	#flow #cont .step dd img{
		max-width: 100%;
		height:auto;
	}
	#flow #cont .section.step:after{
		background-size: 90px auto;
	}
	#flow #cont .step p {
		text-align: left;
		font-size: 15px;
	}
	
	
	#flow #cont .step.no01 .contact{
		background: url(../../img/bg-contact.png);
		padding:10px;
		border-radius:8px;
	}
	#flow #cont .step.no01 .contact p{
		background: none;
		height:auto;
		margin:0 0 5px 0;
	    padding: 0 95px 0 0;
		text-indent: 0;
		font-size:14px;
		font-weight:bold;
		line-height:1.4;
	}
	#flow #cont .step.no01 .contact p.contact-image{
		display: block;
		position: absolute;
		top: -30px;
		right: 5px;
		padding: 0;
	}
	#flow #cont .step.no01 .contact p.contact-image img{
		width: 100px;
	}
	#flow #cont .step.no01 .contact ul{
		background:#fff;
		margin:0 0 0 0;
		padding:15px 10px;
		border-radius:8px;
		position: relative;
		top: inherit;
		left: inherit;
	    z-index: 10;
	}
	#flow #cont .step.no01 .contact ul li{
		float:none;
		margin:0 0 10px 0;
		text-align:center;
	}
	#flow #cont .step.no01 .contact ul li:last-child{
		margin:0;
	}
	#flow #cont .step.no01 .contact ul li.pc_none{
		text-align:left;
		display:block;
	}
	#flow #cont .step.no01 .contact ul li a{
		width:auto;
		height:auto;
		margin:0 0 5px 0;
		padding:10px;
		display: block;
		color:#fff;
		border-radius:8px;
		text-align:center;
		text-indent:0;
	}
	#flow #cont .step.no01 .contact ul li.pc_none span{
		font-size:12px;
	}
	#flow #cont .step.no01 .contact ul li.pc_none a{
		background: url(../../img/icon_tel01.jpg) no-repeat left 10px center #ffab2e;
	}
	#flow #cont .step.no01 .contact ul li.text a{
		background: url(../../img/icon_text01.jpg) no-repeat left 10px center #3980c4;
	}
	#flow #cont .step.no01 .contact ul li.mitsumori a{
		background: url(../../img/icon_mitsumori01.jpg) no-repeat left 10px center #e5326c;
	}
}



/*** ------------------------------------------------------------------------------ 

資料請求（#form）

-----------------------------------------------------------------------------  ***/
#form #cont  h1{
	border:none;
	height: auto;
	line-height: 1.6;
	padding:0;
	margin:0;
	text-align: center;
}
#form #cont h1 .right{
	padding:0 0 0 60px;
}
#form #cont .section.explanation {
	border:10px #E4E4E4 solid;
}
#form #cont .section.explanation .section-cont {
	padding:30px 32px;
	position:relative;
}
#form #cont .section.explanation .section-cont p.flow{
	margin:0 0 30px;
}
#form #cont .section.explanation .section-cont p.flow.pc_none{
	display:none;
}
#form #cont .section.explanation .section-cont p.flow.sp_none{
	display:block;
}
#form #cont .section.explanation .section-cont p.flow-sp{ 
	display:none;
	margin:0 0 30px;
}
#form #cont .section.explanation .section-cont p span{
	display:block;
}
#form #cont .section.explanation .section-cont img.img {
	float:right;
	margin:-15px 0 0;
}
#form #cont .section.explanation .section-cont .ex-text {
	margin:0 0 4em;
}
#form #cont .section.explanation .section-cont .ex-text img {
	vertical-align: middle;
	padding:0 5px 0 0;
}

@media screen and (max-width:737px){
	#form #cont  h1 img{
		max-width: 100%;
		height:auto;
	}
	#form #cont h1 .right{
		padding:0;
	}
	#form #cont .section.explanation .section-cont p.flow img{
		max-width: 100%;
		height:auto;
	}
	#form #cont .section.explanation .section-cont p.flow.pc_none{
		display:block;
	}
	#form #cont .section.explanation .section-cont p.flow.sp_none{
		display:none;
	}
	#form #cont .section.explanation .section-cont {
		padding:20px 10px;
		position:relative;
		box-sizing:border-box;
	}
	#form #cont .section.explanation .section-cont .ex-text {
		margin:0 0 20px;
	}
	#form #cont .section.explanation .section-cont .imgBox{
		display:block;
		text-align:center;
	}
	#form #cont .section.explanation .section-cont img.img {
		float: none;
	}

}


/*table系*/
#form #cont .section.explanation .section-cont table{
	width:100%;
	border-top:1px #CCCCCC dotted;
	font-size:1.167em;
}
#form #cont .section.explanation .section-cont table th{
	padding:15px 10px;
	border-bottom:1px #CCCCCC dotted;
	width:220px;
	font-weight: bold;
	vertical-align: top;
}
#form #cont .section.explanation .section-cont table td{
	padding:15px 10px;
	border-bottom:1px #CCCCCC dotted;
}
#form #cont .section.explanation .section-cont table tr.last th, 
#form #cont .section.explanation .section-cont table tr.last td {
	border:none;
}


/*th系*/
#form #cont .section.explanation .section-cont table th span.attention {
	color:#999999;
	font-size:0.857em;
	font-weight: normal;
}
#form #cont .section.explanation .section-cont table th img {
	padding:0 0 0 5px;
	vertical-align: middle;
}


/*td系*/
#form #cont .section.explanation .section-cont table td ul {
	font-size:1em;
}
#form #cont .section.explanation .section-cont table td span.example {
	padding:0 0 0 15px;
	color:#666666;
}
#form #cont .section.explanation .section-cont table td li input {
	width: auto;
	margin:0 5px 0 0;
}
#form #cont .section.explanation .section-cont table td li {
	float:left;
	margin:0 20px 0 0;
	padding:2px 0;
	white-space: nowrap;
}
#form #cont .section.explanation .section-cont table td li .input-text input {
	width:120px;
	margin:0 0 0 5px;
}
#form #cont .section.explanation .section-cont table td dl {
	font-size:1em;
}
#form #cont .section.explanation .section-cont table td dl dt {
	float:left;
	width:60px;
	margin:0 10px 0 0;
	padding:5px 0;
	clear:both;
}
#form #cont .section.explanation .section-cont table td dl dd {
	float:left;
	width:500px;
	padding:5px 0;
}
#form #cont .section.explanation .section-cont table td dl dd.code input {
	width:100px;
}
#form #cont .section.explanation .section-cont table td dl dd span {
	color:#666666;
}
#form #cont .section.explanation .section-cont table td dl dd span.attention {
	font-size:0.86em;
	color:#999999;
}
#form #cont .section.explanation .section-cont table td dl dd.address-text input {
	margin:0 0 5px;
}
#form #cont .section.explanation .section-cont table td .material {
	padding:5px 0 0;
}
#form #cont .section.explanation .section-cont table td .material li {
	padding:2px 0;
	width: 100%;
}
#form #cont .section.explanation .section-cont table td .material li span {
	display:inline-block;
	width:240px;
}
#form #cont .section.explanation .section-cont table td .enquete li.long {
	width: 100%;
}
#form #cont .section.explanation .section-cont table .last td span.example {
	padding:0;
}


/*フォームパーツ系*/
#form #cont .section.explanation .section-cont table th strong {
	display:block;
}
#form #cont .section.explanation .section-cont table th span.block {
	display:block;
}
#form #cont .section.explanation .section-cont table td input {
	width: 190px;
}
#form #cont .section.explanation .section-cont table td textarea {
	width: 100%;
	height:200px;
}
#form #cont .section.explanation .section-cont table td span.min input {
	width: 80px;
}

/*送信ボタン*/
#form #cont .button {
	text-align: center;
	margin:0 0 50px;
}

/*ssl*/
#form #cont .ssl{
	border:#CCCCCC 1px solid;
	background: #EBEBEB;
	padding:12px 20px;
	position:relative;
	font-size:1.167em;
	margin:0 0 30px;
}
#form #cont .ssl p{
	margin:0;
}
#form #cont .ssl img{
	float:left;
	padding:0 20px 0 0;
}

a.privacy {
    text-decoration: underline;
}

a.privacy:hover {
    text-decoration: none;
}

@media screen and (max-width:737px){
	#form #cont .section.explanation .section-cont table {
	  width: 100%;
	  table-layout: fixed;
		word-break: break-all;
		word-wrap: break-all;
	}
	#form #cont .section.explanation .section-cont table th{
		display:block;
		width: 100%;
		float:left;
		box-sizing:border-box;
		padding:15px 10px 0 10px;
		border-bottom: none;
	}
	#form #cont .section.explanation .section-cont table td{
		display:block;
		width: 100%;
		float:left;
		box-sizing:border-box;
	}
	#form #cont .section.explanation .section-cont table td span{
		display:block;
	}
	#form #cont .section.explanation .section-cont table td span.input-text{
		display: inline;
	}
	#form #cont .section.explanation .section-cont table td span.example{
		padding:5px 0 0 0;
	}


	#form #cont .section.explanation .section-cont table td dl dt {
		float: none;
		width: 100%;
	}
	#form #cont .section.explanation .section-cont table td dl dd {
		float: none;
		width: auto;
	}
	#form #cont .section.explanation .section-cont table td dl dd.code span{
		display: inline;
	}
	#form #cont .section.explanation .section-cont table td dl dd.code span.input-code{
		display: block;
		margin-bottom:5px;
	}
	#form #cont .section.explanation .section-cont table td .material li{
		white-space:normal;
	}
	#form #cont .section.explanation .section-cont table td .material li span{
		display:block;
	}
	#form #cont .section.explanation .section-cont table td span.min{
		display: inline;
	}
	
	
	#form #footer #scroll{
		display: none !important;
	}
	#form #footer .copyright {
		padding: 0 0 1em;
	}
}