@charset "utf-8";


#slickSlyder{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fecf02+0,fbe82c+100 */
	background: #fecf02; /* Old browsers */
	background: -moz-linear-gradient(top,  #fecf02 0%, #fbe82c 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #fecf02 0%,#fbe82c 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #fecf02 0%,#fbe82c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fecf02', endColorstr='#fbe82c',GradientType=0 ); /* IE6-9 */
}



#cardElm_sp{
	display:none;
}


@media screen and ( max-width:750px) {

	#cardElm{
		display:none;
	}

	#cardElm_sp{
		display:block;
	}

	#articleBox {
	    padding:15px 15px;
	}

	.innerBox{
		display:block;
		overflow:hidden;
		margin-bottom:25px;
	}

	.innerBox p{
		font-size:1.4rem;
		line-height:155%;
	}

	#cardElm_sp > img{
		width:100%;
		height:auto;
		max-width:640px;
	}

	#cardElm_sp h3{
		display:block;
		overflow: hidden;
		text-align:left;
	    font-size: 1.8rem;
	    line-height: 125%;
	    font-weight:bold;
	    padding-left: 10px;
	    background-color:#fdd100;
	    color:#333333;
	    padding: 0.5em;
	    text-align:center;

	    border-radius: 10px 10px 0px 0px;
	    -webkit-border-radius: 10px 10px 0px 0px;
	}

	.stepBox{
		display:block;
		overflow:hidden;
		text-align:center;
		padding:0 15px;
		border-left:4px solid #fdd100;
		border-right:4px solid #fdd100;
		border-bottom:4px solid #fdd100;
	}

	.stepBox > p{
		display:block;
		overflow:hidden;
		font-size:1.6rem;
		line-height:125%;
		padding:15px 0 15px 65px;
		text-align:left;
		background-image:url('../images/_sp/n01.png');
		background-repeat: no-repeat;
		background-position:0 50%;
	}

	.stepBox:nth-child(3) > p{
		background-image:url('../images/_sp/n02.png');
	}
	.stepBox:nth-child(4) > p{
		background-image:url('../images/_sp/n03.png');
	}

	.stepBox > img{
		width:80%;
		height:auto;
		max-width:580px;
	}

	.frameBox{
		display:block;
		overflow:hidden;
		padding:15px 15px;
		border-left:4px solid #fdd100;
		border-right:4px solid #fdd100;
		border-bottom:4px solid #fdd100;
	}

	.frameBox ul{
		display:block;
		margin-top:15px;
	}

	.frameBox ul > li{
		display:block;
		overflow:hidden;
		padding:0.5em 10px 0.5em 45px;
		margin:0.5em 0;
		font-size:1.4rem;
		line-height:125%;
		background-color:#fce900;
		position:relative;
	}

	.frameBox ul > li:before{
		content:"";
		display:inline-block;
		overflow:hidden;
		width: 25px;
		height:29px;
		background:url('../images/_sp/cheakmk.png') no-repeat 0 0;
		position:absolute;
		top:calc(50% - 15px);
		left:10px;
	}


}