#product-html-02 {
	font-size : 100%;
}

@media only screen and (min-device-width : 320px) and (orientation:portrait) {
#product-html-02{ font-size : 60%;}
}

@media only screen and (max-device-width : 480px) and (orientation:landscape) {
#product-html-02{ font-size : 60%;}
}

@media only screen and (min-device-width : 375px) and (orientation:portrait) {
#product-html-02{ font-size : 60%;}
}

@media only screen and (max-device-width : 667px) and (orientation:landscape) {
#product-html-02{ font-size : 80%;}
}

@media only screen and (min-device-width : 768px){
#product-html-02{ font-size : 100%;}
}
 
@media only screen and (min-device-width : 1024px) {
#product-html-02{ font-size : 100%};
}


@media(max-width:640px) {
	#include_area p.soft img {
		width: auto;
		height: 3em;
		margin: 0 2% 2% 0!important;
	}
}

div.area-a,
div.area-b {
	display: inline-block;
	text-align: center;
	background-color: #EBEBEB;
	padding: 2% 0;
	margin: 0 0 3%;
}

div.area-a p,
div.area-b p {
	font-size: 1.05em;
	font-weight: bold;
	margin: 0 0 0.8em;
}

div.area-a p img,
div.area-b p img {
	vertical-align: -5px;
	margin: 0 0.6% 0 0;
}

div.area-a {
	width: 49%;
	margin: 0 2.5% 0 0;
}

div.area-b {
	width: 48%;
}

div.link-area img {
	margin: 0 0.5%;
}


@media(max-width:640px) {

div.area-a,
div.area-b {
	display: block;
	text-align: center;
	background-color: #EBEBEB;
	padding: 4% 0;
}


div.area-a {
	width: 100%;
    margin: 0 auto 2.5%;
}

div.area-b {
	width: 100%;
}

body #include_area p img {
    width: 6%;
}

div.area-a p,
div.area-b p {
	font-size: 0.75rem;
}

div.link-area img {
    margin: 0 0.5%;
    width: 60%;
}