@charset "Shift_jis";

/*  -----------------------------
for smart phone
-------------------------- */

@media screen and (max-width: 768px) {
    body {
        padding-top: 0;
    }
    .contents {
        width: 100%;
        padding: 0;
    }
    .header {
        background: #ffffff;
        position: static;
        left: 0;
        top: 0;
        width: 100%;
        z-index: 999;
        box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.25);
        -webkit-box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.25);
        -moz-box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.25);
    }
    .header h1 {
        text-align: center;
        float: none;
        padding: 9px 0 0;
        height: 40px;
    }
    .header h1 img {
        height: 25px;
    }
	
	h2 br {
		display: block;
	}
	
	div#PCfooter {
		display: none;
	}
	
	div#SPfooter{
		display:block;
	}
	
    footer.sp {
        padding: 10px 0;
        text-align: center;
        display: block;
        line-height: 1.2;
        font-size: 10px;
    }


}


/*  -----------------------------
for smart phone index
-------------------------- */

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

	#mainvisual {
		width: auto;
		margin: 10px 0;
	}

	#mainvisual img {
		width: 100%;
	}

	.pcImg {
		display: none !important;
	}

	.spImg {
		display: block !important;
	}


	/* Q&A */
	



	ul.point li {
		border-bottom: 1px solid #666666;
		
	}
	
	ul.point li:last-child {
		border: none;
	}
	
	div.writerImg {
		text-align: center;
		float: none;
	}
	
	div.writerImgRight {
		text-align: center;
		float: none;
	}
	
	div.writerImg img {
		width: 40%;
	}
	
	div.writerImgRight img {
		width: 40%;
	}
	
	table.question img.qmark {
		width: 60px;
	}
	
	div.qaText {
		float: left;
		width: 100%;
		margin-top: 0;
	}
	
	div.qaTextLeft {
		float: left;
		width: 100%;
		margin-top: 0;
	}
	
	table.question {
		width: 100%;
	}
	
	
	table.question p.qtext {
		font-size: 22px;
		font-weight: bold;
		line-height: 1.4;
		margin-left:10px;
	}
	
	table.question p.qtext br {
		display: none;
	}
	
	p.blueLine img {
		width: 100%;
	}

	table.answer {
		width:100%;
	}
	
	p.writer {
		width: 100%;
		font-size: 22px;
	}
	

	
	/* balloon */
	
	div#excellent .balloonLeft,
	div#excellent .balloonRight {
		max-width: 100%;
		margin: 20px 30px 50px;
	}

	div#excellent img {
		width: 100%;
		float: none;
		margin: 0;
	}

	div#excellent img.rside {
		width: 100%;
		float: none;
		margin: 0;
	}

	div#excellent p {
		margin-top: 0;
		overflow: none;
	}

	div#excellent p.rside {
		margin-top: 0;
		overflow: none;
	}
	
	div#excellent br.mainTxt {
		display: none;
	}
	
	



    .product-info-box {
       display: block;
        float: none;
		width: 300px;
    }
    .product-info-box .text {
        width: auto;
		float: left;
    }
    .product-info-box .item-name {
        width: auto;
        font-size: 22px;
        line-height: 1.2;
    }
    .product-info-box .item-price {
        padding-top: 0;
    }

}