@charset "UTF-8";
/* CSS Document */

#sample p{
	text-align: center;
}
@media screen and (min-width:769px) { 
.pcOnly{display:block;}
.spOnly{display:none;}
#pcPoint{
	margin-top: 40px;
}
#pcFree{
	margin-top: 40px;
}
#pcFlow{
	margin-top: 80px;
}
#pcHow{
	margin-top: 50px;
	margin-bottom: 180px;
}
#sample{
	background: url("../images/pitasapo_sample_bg_pc.png") no-repeat center top / cover;
	padding-top: 50px;
}
#sample p:nth-of-type(2){
	margin-top: 36px;
}
#sample p:nth-of-type(4){
	margin-top: 30px;
}
#sample p.btn{
	margin-top: 30px;
}
#sample p.btn a{
	display: block;
	position: relative;
}
#sample p.btn a img{
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;  
}
#sample p.btn a img.btnOn{
	position: absolute;
	left: 0;
	top: 0;
}
#sample p.btn a img.btnOff,
#sample p.btn a:hover img.btnOn{
	filter:Alpha(opacity:1);
	-moz-opacity: 1;
	opacity: 1;
}
#sample p.btn a img.btnOn,
#sample p.btn a:hover img.btnOff{
	filter:Alpha(opacity:0);
	-moz-opacity: 0;
	opacity: 0;
}
}
@media screen and (max-width: 750px){
.l-inner {
    width: 100%;
}
}
@media screen and (max-width: 1016px){
.l-inner {
    padding: 0;
}
}
@media screen and (max-width:768px) { 
.pcOnly{display:none;}
.spOnly{display:block;}
#sample{
	background: url("../images/pitasapo_sample_bg_sp.png") no-repeat center top / cover;
	padding-top: calc(100vw*50/748);
}
#sample p:nth-of-type(1) img{
	width: calc(100%*484/748);
}
#sample p:nth-of-type(2){
	margin-top: calc(100vw*35/748);
}
#sample p:nth-of-type(2) img{
	width: calc(100%*639/748);
}
#sample p:nth-of-type(3) img{
	width: calc(100%*484/748);
}
#sample p:nth-of-type(4){
	margin-top: calc(100vw*35/748);
}
#sample p:nth-of-type(4) img{
	width: calc(100%*676/748);
}
#sample p.btn{
	margin-top: calc(100vw*35/748);
}
}