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

html {
	font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
	background-color: #FFFFFF;
	font-size: 1rem;
	font-size: 16px;
}
img{
	outline:none;
	border-style:none;
    height: auto;
    max-width: 100%;
}
a{
    color:#0B5EC2;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
	border: none;
}
a:visited{
    color:#0B5EC2;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}
a:hover {
    color: #F5A862;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}


/*****HEADER*****/
header {
	text-align: center;
}
header .header {
	width:984px;
	margin: 70px auto 50px;
}

header .header h1 {padding-bottom: 50px;}
header .header p img {width:574px; padding-bottom: 50px;}
header .header p.top_catch {font-size: 20px;font-weight: bold;line-height: 150%;}

@media only screen and (max-device-width : 480px) {
	header .header {
		width: 96%;
		margin-top:30px;
	}
	img {
		width: 100%;
	}
}

/*****MAIN*****/

main {
	width:984px;
	margin: 0 auto;
	padding-top: 50px;
	padding-bottom: 100px;
}
section p {font-size:18px;line-height: 150%;}

@media only screen and (max-device-width : 480px) {
	main {width:96%;}
}
section h2 {font-size: 18px; line-height: 150%;}
@media only screen and (max-device-width : 480px) {
	section h2 {font-size: 20px; line-height: 150%;}
}
table {width: 100%; margin: 10px auto 20px;}

table th {
	padding: 10px;
	border: 1px solid #979797;
	background-color: #F5EEB6;
	vertical-align: middle;
}
table td {
	padding: 10px 12px;
	background-color: #FFFFFF;
}
table td.square {
	background-image:url("/image/square.png");
	background-repeat: no-repeat;
	background-position:10px 50% ;
	padding-left: 30px;
}
table td.line {
	border-width: 1px;
	border-style: none solid solid solid;
	border-color: #979797;
}

table td.line-dot {
	border-width: 1px;
	border-style: solid solid dashed solid;
	border-color: #979797;
}
table td.price {text-align: center;vertical-align: middle; font-size:18px;}

@media only screen and (max-device-width : 480px) {
.scroll{
	overflow: auto;
	white-space: nowrap;
}
.scroll::-webkit-scrollbar{
height: 5px;
}
.scroll::-webkit-scrollbar-track{
background: #F6F6F6;
}
.scroll::-webkit-scrollbar-thumb {
background: #C2C2C2;
}
}

/*****FOOTER*****/

footer{	
    width:100%;
	background-color: #F5EEB6;
}
footer .about-inn {
	width: 986px;
	margin: 0 auto;
	height:300px;
	padding-top: 70px;
}
@media only screen and (max-device-width : 480px) {
	footer .about-inn {
		width:96%;
		height: auto;
		padding-top:20px;
		padding-bottom: 20px;
	}
	
}
footer .right, footer .left { float: left;}
footer .left img { width: 175px; margin: auto;}
footer .left { width:40%; text-align: center;}
footer .right { font-size: 18px;line-height: 200%;}
footer .right h2 { line-height: 100%; padding-bottom: 0.5rem;}
footer .right p a { font-size:23px;}

@media only screen and ( max-device-width : 480px) {
	footer .right, footer .left {float:none;}
	footer .left { width:100%; }
	footer .left img { witdh:350px; padding-bottom: 10px;}
	footer .right h2 { text-align: center;}
	footer .right p a { font-size: 20px;}
	
}



footer p.copy {
	font-size: 14px;
	text-align: center;
	padding: 20px 0;
	background-color: #FFFFFF;
	clear:both;
}