@charset "UTF-8";

.cf{zoom:1;}
.cf:before,.cf:after{content:""; display:table;}
.cf:after{clear:both;}


/*---------------共通およびスマホ記述-------------------*/

body{
	width:100%;
	margin:0;
	padding:0;
	font-size:0.8em;
	color:#555;
	font-family:"游明朝", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","Times New Roman","ＭＳ Ｐ明朝", "MS PMincho", serif;

	line-height:1.5em;
	
}
#wapper{
	width:100%;
}

header{
	text-align:center;
	margin:10px auto 0;
	
}




nav{
	width:100%;
	margin:15px auto 0;
}

nav ul li{
	width:33.3%;
	height:auto;
	float:left;
	margin:15px 0 0 0;
	padding:0;
	text-align:center;
	
}


/*------------workflow title-------------*/
article{
	clear:both;
	width:100%;
	height:auto;
	text-align:center;
	margin-bottom:20px;
}
article h1 img{
	width:220px;
	height:auto;
	margin:24px auto 0;
	
}
article #kansei{
	display:none;
}
article #kansei2 img{
	width:250px;
	height:auto;
	margin:20px auto 0;
}

/*------------workflow title end---------*/


/*------------step1----------------------*/
section #step1{
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step1 #waku1{
	display:none;
}

#step1 #step1_icon{
	float:left;
	margin-top:18px;
	margin-left:4%;
}


#step1 #title{
	float:left;
	font-size:1.4em;
	margin:47px 0 0 8px;
}

#tegaki_pic{
	clear:both;
	text-align:center;
	padding-top:10px;	
}

/*-----------------３個のナビ---------------*/
#tegaki_nav{
	width:100%;
	height:170px;
	padding:0;
	margin:0 0 35px 0;
}
#tegaki_nav .comment{
	width:300px;
	height:155px;
	margin:0 auto;
	padding-left:35px;
	padding-top:15px;
}

#tegaki_nav .comment p{
	float:left;
	margin:0 0 0 8px;
	padding:0;
}

#tegaki_nav .comment p.icon2{
	clear:both;
}
#tegaki_nav .comment p.icon3{
	clear:both;
}
#tegaki_nav .comment p#illust{
	font-size:0.7em;
}

#tegaki_nav .comment p.price{
	clear:both;
	color:#F00;
	font-size:0.9em;
	margin:0 0 5px 35px;
	padding:0;
}
#tegaki_nav .comment p.price2{
	display:none;
}
#tegaki_nav .comment p#illust2{
	display:none;
}





/*-----------------３個のナビ end---------------*/
/*------------step1 END------------------*/

/*------------step2 ---------------------*/

section #step2{
	
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step2 #waku2{
	display:none;
}

#step2 #step2_icon{
	float:right;
	margin-top:18px;
	margin-right:6%;
}

#step2 #title2{
	float:right;
	font-size:1.4em;
	margin:47px 3px 40px 0;
}

#step2 #tsyatupic{
	clear:both;
	text-align:center;
	margin-bottom:10px;
}

#tsyatu_nav{
	width:100%;
	height:auto;
	margin-bottom:30px;
}

#tsyatu_nav .navcom{
	width:220px;
	height:auto;
	margin:0 auto;
	text-align:left;
	padding-left:40px;
}

#tsyatu_nav .navcom p#tempo{
	font-size:0.9em;
	margin:10px auto 0;
	width:100%;
}
#tsyatu_nav .navcom p#comment2{
	display:none;
}

#tsyatu_nav .navcom p#tempo2{
	font-size:0.9em;
	margin:0 0 0 15px;
	width:80%;
}
#tsyatu_nav .navcom p#tempo3{
	display:none;
}
/*------------step2 END------------------*/


/*------------step3----------------------*/
section #step3{
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step3 #waku3{
	display:none;
}

#step3 #step3_icon{
	float:left;
	margin-top:18px;
	margin-left:4%;
}

#step3 #title3{
	float:left;
	font-size:1.4em;
	margin:47px 0 0 8px;
}

#seihan_pic{
	clear:both;
	text-align:center;
	padding-top:10px;	
}


#tsyatu_nav{
	width:100%;
	height:auto;
	
}
#seihann_nav .navcom p#ketei{
	display:none;
}

#seihann_nav .navcom{
	width:220px;
	height:auto;
	margin:10px auto 20px;
	padding-left:15px;
	}

#seihann_nav .navcom p#hanwatashi{
	font-size:0.9em;
	margin:10px auto 0;
	width:90%;
	height:auto;
}

/*------------step3 END------------------*/


/*------------step4    ------------------*/

section #step4{
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step4 #waku4{
	display:none;
}

#step4 #step4_icon{
	float:right;
	margin-top:18px;
	margin-right:6%;

}

#step4 #title4{
	float:right;
	font-size:1.4em;
	margin:47px 3px 40px 0;
	
	
}

#step4 #print_pic{
	clear:both;
	text-align:center;
	margin-bottom:10px;
}

#print_nav{
	width:100%;
	height:auto;
	
}
#print_nav .navcom{
	width:220px;
	height:auto;
	margin:0 auto 40px;
	padding-left:25px;
}

#print_nav .navcom p#ink{
	display:none;
}

#print_nav .navcom p#kikan{
	font-size:0.9em;
	margin:10px auto 0;
	/*width:80%;*/
}
#print_nav .navcom p#kikan2{
	font-size:0.9em;
	margin:0 auto 0;
	/*width:80%;*/
	padding-left:13px
}
#print_nav .navcom p#kikan3{
	display:none;
}

/*------------step4 END------------------*/

#pagetop{
	text-align:right;
	margin-right:4%;
}


footer{
	width:100%;
	margin:30px auto;
	
}
footer #footnav{
	width:100%;
	height:auto;
	padding-bottom:40px;
}

footer ul li{
	width:33.3%;
	height:auto;
	float:left;
	margin:0 auto 10px;
	padding:0;
	text-align:center;
	
}

#copyright{
	width:100%;
	height:auto;
	text-align:center;
	padding-top:50px;
	font-family:"游明朝", "Times New Roman","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro",serif;
	
	
}

#copyright2{
	display:none;
}

/*---------------共通およびスマホ記述 end---------------*/

@media screen and (min-width:600px){


/*-------------------step1-----------------------------*/

header{
	text-align:center;
	margin:30px auto 0;
	
}

nav{
	width:95%;
	margin:20px auto 0;
}

nav ul li{
	width:16.6%;
	height:auto;
	float:left;
	margin:10px 0 0 0;
	padding:0;
	text-align:center;
	
}

article h1 img{
	width:269px;
	height:28px;
	margin:40px auto 0;
	
}

article #kansei{
	display:block;
	margin:20px auto 0;
}
article #kansei2 img{
	display:none;
}

#step1 #step1_icon{
	float:left;
	margin-top:18px;
	margin-left:10%;
}

#step1 #title{
	margin:47px 3px 40px 30px;	
}



/*----------写真とコメント---------------*/

#designcon{
	clear:both;
	margin:0 auto;
}
	

#tegaki_pic{
	float:left;	
	width:48%;
	height:auto;
	padding-top:10px;
	text-align:right;	
}
#tegaki_pic img{
	width:240px;
	height:auto;
}

#tegaki_nav{
	float:left;
	width:50%;
	height:auto;
	padding:0;
	margin:10px 0 40px 0;
	font-size:1.0em;
	
}

#tegaki_nav .comment{
	padding-left:1%;
}

#tegaki_nav .comment p{
	margin:0;
	padding:0;
}

#tegaki_nav .comment p.icon2{
	clear:both;
}
#tegaki_nav .comment p.icon3{
	clear:both;
}
#tegaki_nav .comment p#illust{
	clear:both;
	font-size:0.8em;
	padding:0 0 0 30px;
}

#tegaki_nav .comment p.price{
	clear:both;
	color:#F00;
	font-size:0.9em;
	margin:0 0 5px 32px;
	padding:0;
}


#tegaki_nav .comment p{
	margin:0 0 0 5px;
	padding:0;
}


/*----------写真とコメント END---------------*/

/*-------------------step1 END-------------------------*/


/*-------------------step2 ----------------------------*/

section #step2{
	clear:both;
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step2 #step2_icon{
	float:right;
	margin-top:18px;
	margin-right:10%;
}

#step2 #title2{
	margin:47px 20px 50px 0;	
}

#tsyatucom{
	clear:both;
	margin:0;
	width:100%;
	height:auto;
}

#tsyatu_pic{
	float:right;	
	width:50%;
	height:auto;
}

#tsyatu_pic #tsyatupic{
	text-align:left;
	padding-left:3%;
	}

#tsyatupic img{
	width:240px;
	height:auto;
}

#tsyatu_nav{
	float:right;
	width:50%;
	height:auto;
	text-align:right;
	margin:20px 0 90px 0;
}

#tsyatu_nav .navcom{
	width:220px;
	height:auto;
	margin:0 auto;
	text-align:right;
	padding-left:40px;
}

#tsyatu_nav .navcom p#tort{
	padding-right:8px;
}

#tsyatu_nav .navcom p#tempo{
	font-size:0.9em;
	margin:10px auto 0;
	width:94%;
}
#tsyatu_nav .navcom p#comment2{
	display:none;
}

#tsyatu_nav .navcom p#tempo2{
	font-size:0.9em;
	margin:0 0 0 15px;
	width:94%;
}
#tsyatu_nav .navcom p#tempo3{
	display:none;
}

/*-------------------step2 END-------------------------*/


/*-------------------step3   -------------------------*/


section #step3{
	
	clear:both;
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step3 #title3{
	margin:47px 3px 40px 30px;	
}

#step3 #step3_icon{
	float:left;
	margin-top:18px;
	margin-left:10%;
}

#seihan_pic{
	float:left;	
	width:50%;
	height:auto;
	text-align:right;
}

#seihan_pic img{
	width:240px;
	height:auto;
}

#seihann_nav{
	float:left;
	width:50%;
	height:auto;
	text-align:left;
	margin:25px 0 70px 0;
}

#seihann_nav .navcom{
	padding-left:10px;
	
}

#seihann_nav .navcom p#hanwatashi{
	font-size:0.9em;
	width:100%;
	
	
}

/*-------------------step3 END-------------------------*/

/*-------------------step4  ---------------------------*/

section #step4{
	clear:both;
	width:100%;
	height:auto;
	margin:0 auto;
	
}

#step4 #step4_icon{
	float:right;
	margin-top:18px;
	margin-right:10%;
}

#step4 #title4{
	margin:47px 20px 50px 0;	
}

#printcom{
	clear:both;
	margin:0;
	width:100%;
	height:auto;
}

#printpic{
	float:right;	
	width:50%;
	height:auto;
	
}

#printpic #print_pic{
	text-align:left;
	padding-left:3%;
	}

#print_pic img{
	width:240px;
	height:auto;
}

#print_nav{
	width:50%;
	height:auto;
	text-align:right;
	padding-top:20px;
	
}

#print_nav .navcom{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	
}
#print_nav .navcom p{
	margin-right:8%;
}

#print_nav .navcom p#ichimai{
	padding-right:11px;
	margin-right:8%;
}
#print_nav .navcom p#kikan{
	padding-right:11px;
	margin-right:8%;
}
#print_nav .navcom p#kikan2{
	margin-right:8%;
}
/*-------------------step4  END ------------------------*/

/*-------------------footer  ---------------------------*/

#pagetop{
	clear:both;
}



footer{
	width:95%;
	margin:20px auto 0;
}

footer ul li{
	width:16.6%;
	height:auto;
	float:left;
	margin:10px 0 0 0;
	padding:0;
	text-align:center;
	
}
#copyright{
	display:none;
}
#copyright2{
	width:400px;
	height:auto;
	display:block;
	text-align:center;
	margin:20px auto 30px;
}

/*-------------------footer  END---------------------------*/
}


@media screen and (min-width:740px){


#wrapper{
	width:740px;
	margin:0 auto;
}
nav{
	width:100%;
	
	
}

#topnav{
	width:740px;
	height:35px;
	border-bottom:solid 1px #999;
	margin:20px auto 0;
}
	
article h1 img{
	width:269px;
	height:28px;
	margin:50px auto 0;
}

secton #step1{
	position:relative;
}

#step1 #waku1{
	display:block;	
	margin:32px auto 30px;
	position:absolute;
}
#step1 #step1_icon{
	float:left;
	margin-top:30px;
	margin-left:30px;
}

#step1 #title{
	font-size:1.5em;
	margin:60px 3px 35px 30px;	
}



/*----------写真とコメント---------------*/


/*---------------step1-------------------*/
#tegaki_pic{
	float:left;	
	width:250px;
	height:auto;
	margin-left:40px;
		
}
#tegaki_pic img{
	width:250px;
	height:auto;
}

#tegaki_nav{
	width:400px;
	height:auto;
	margin-top:20px;
	font-size:1.2em;
	margin-bottom:90px;
}

#tegaki_nav .comment{
	width:100%;
	height:160px;
	margin:0 auto;
	padding-left:25px;
}

#tegaki_nav .comment p{
	/*float:left;*/
	margin:0 0 30px 8px;
	padding:0;
}

#tegaki_nav .comment p#illust,.price{
	display:none;
}

#tegaki_nav .comment p.price2{
	/*float:left;*/
	color:#F00;
	font-size:0.9em;
	margin:0 0 5px 25px;
	padding:0;
	display:block;
}
#tegaki_nav .comment p#illust2{
	font-size:0.7em;
	display:block;
}

/*---------------step1 END---------------*/

/*---------------step2 ------------------*/

#step2{
	clear:both;
	position:relative;
}
#step2 #step2_icon{
	float:right;
	margin-top:18px;
	margin-right:30px;
}

#step2 #waku2{
	display:block;	
	position:absolute;
	margin:22px auto 0;
}

#step2 #title2{
	margin-bottom:45px;
}

#tsyatucom{
	clear:both;
	width:740px;
	height:auto;
}

#tsyatu_pic{
	float:right;	
	width:250px;
	height:190px;
	padding-right:50px;
}

#tsyatupic img{
	width:250px;
	height:190px;
}

#tsyatu_nav{
	width:430px;
	height:200px;
	margin:0 0 80px 0;
	font-size:1.1em;
	line-height:2.0em;
}

#tsyatu_nav .navcom{
	width:400px;
	height:auto;
	margin:20px 0 0;
	padding:0;
}
#tsyatu_nav .navcom p{
	display:none;
}
#tsyatu_nav .navcom p#comment2{
	display:block;
	width:400px;
	height:100px;
	margin:0;
	padding:0;
	
}

#tsyatu_nav .navcom p#tempo{
	display:none;
	
}
#tsyatu_nav .navcom p#tempo2{
	display:none;
	
}
#tsyatu_nav .navcom p#tempo3{
	display:block;
	font-size:0.8em;
	margin:0;
	width:400px;
	height:auto;
}


/*---------------step2 END---------------*/
/*---------------step3 ------------------*/
#step3{
	position:relative;
}
#step3 #waku3{
	display:block;	
	margin:298px auto 0;
	position:absolute;
}
#step3 #step3_icon{
	float:left;
	margin-top:20px;
	margin-left:30px;
}


#seihan_pic{
	width:250px;
	padding-left:0;
	margin-left:40px;
}
#seihan_pic img{
	width:250px;
	height:190px;
	
}

#seihann_nav{
	width:400px;	
	height:190px;
	margin:20px 0 58px 50px;
	font-size:1.3em;
}
#seihann_nav .navcom{
	width:400px;
	height:auto;
	font-size:0.9em;
	line-height:2.0em;
	
}
#seihann_nav .navcom p{
	display:none;
}

#seihann_nav .navcom p#ketei{
	display:block;
	padding-left:20px;
}

#seihann_nav .navcom p#hanwatashi{
	display:block;
	font-size:0.8em;
	line-height:3.0em;
	padding-left:21px;
}

/*---------------step3 END---------------*/



/*---------------step4 ------------------*/
#step4{
	clear:both;
	position:relative;
	
}
#step4 #waku4{
	display:block;	
	position:absolute;
	margin:16px auto 0;
}

#step4 #step4_icon{
	float:right;
	margin-top:18px;
	margin-right:40px;
}


#printpic{
	width:250px;
	height:190px;
	margin-right:50px;
}

#print_pic img{
	width:250px;
	height:auto;
}

#print_nav{
	float:right;
	width:400px;
	height:190px;
	margin:0 0 90px 0;
	font-size:1.2em;
	line-height:2.0em;
}

#print_nav .navcom{
	width:400px;
	height:190px;
	text-align:right;
	
}
#print_nav .navcom p{
	display:none;
}
#print_nav .navcom p#ink{
	display:block;
	margin:0;
	padding-right:30px;
	}
#print_nav .navcom p#kikan{
	display:none;
	
}
#print_nav .navcom p#kikan2{
	display:none;
	
}
#print_nav .navcom p#kikan3{
	display:block;
	width:370px;
	height:auto;
	font-size:0.8em;
	line-height:3.0em;
	margin:0;
	text-align:right;
	
	
}


/*---------------step4 END---------------*/


footer{
	width:740px;
	margin:0 auto;
	
}

#footnav{
	width:740px;
	height:35px;
	border-bottom:solid 1px #999;
	margin:20px auto 0;
}

#copyright{
	display:none;
}
#copyright2{
	width:400px;
	height:auto;
	display:block;
	text-align:center;
	margin:20px auto 30px;
	font-family:"游明朝", "Times New Roman","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}