@charset "UTF-8";

span.keycolor{ color:#693; font-weight:bold;}


/*
green base -----------------------------------------------------*/

#featureArea{
	padding:0;
	margin:0;
	}

#featureArea .ttlArea{
	padding: 0 0 15px 0;
	margin: 10px 0 40px 0;
	border-bottom:1px solid #ccc;
	}

#featureArea .ttlArea .txtArea{
	float:right;
	padding:0;
	margin:0;
	width:600px;
	}
	
#featureArea h2{
	border-bottom:1px solid #ccc;
	margin: 0 0 15px 0;
	padding: 0 0 10px 0;
	font-size:36px;
	line-height: 1.2;
	color:#693;
	}
#featureArea h2 br {
	display: none;
}
#featureArea h2 br:first-of-type {
	display: inline;
}

#featureArea h3{
	padding:15px 0 10px 0;
	margin:0;
	font-size:20px;
	color:#693;
	}

#featureArea .ttlArea p{
	padding:0 0 10px 0;
	margin:0;
	font-size:14px;
	}

#featureArea .ttlArea .number{
	padding:0 0 10px 0;
	margin:0;
	font-size:36px;
	color:#693;
	text-align:right;
	font-weight:bold;
	}

#featureArea .ttlArea img{
	float:left;
	}


#f-pageBox{
	clear:both;
	width: 100%;
	}

.f-pageBoxInner{
	padding:10px;
	margin:0 0 10px 0;
	background:#FFF;
	border:1px solid #CCC;
	}

#featureNumber {
	border-bottom:1px solid #ccc;
	margin: 0 0 20px 0;
	padding: 0 0 10px 0;
	font-size:24px;
	line-height: 1.2;
	font-weight:bold;
	color:#000;
}
#featureNumber span {
	font-size:36px;
	line-height: 1.2;
	color:#693;
}


/*
area1 ---*/	
.f-pageBoxInner .area1{
	padding:0;
	}
		
.f-pageBoxInner .area1 .detailtxtArea{
	float:right;
	width:337px;
	}

.f-pageBoxInner .area1 .detailtxtArea .detailttlArea h4{
	font-size:18px;
	color:#693;
	font-weight:bold;
	padding:0 0 5px 0;
	text-align:right;
	}

.f-pageBoxInner .area1 .detailtxtArea .detailttlArea p{
	font-size:16px;
	padding:0 0 10px 0;
	text-align:right;
	border-bottom:1px solid #693;
	}

.f-pageBoxInner .area1 .detailtxtArea .detailttlArea .cachArea{
	font-size:16px;
	padding:10px 0 15px 0;
	font-weight:bold;
	}

.f-pageBoxInner .area1 .detailtxtArea .pointArea p{
	line-height:16px;
	padding: 0 0 5px 0;
	}

.f-pageBoxInner .area1 .detailtxtArea .pointArea p.lokemita{
	color:#FF0000;
	padding: 10px 0;
	}

.f-pageBoxInner .area1 .detailtxtArea table{
	border-bottom:dotted 1px #CCC;
	margin:10px 0;
	}

.f-pageBoxInner .area1 .detailtxtArea th, .f-pageBoxInner .area1 .detailtxtArea td{
	border-top:dotted 1px #CCC;
	padding:5px;
	}

.f-pageBoxInner .area1 .detailtxtArea th{
	background:#dbe9fc;
	font-weight:bold;
	color:#474d87;
	width:70px;
	}

.f-pageBoxInner .area1 .detailBtn{
	text-align:right;
	}

.f-pageBoxInner .area1 .imgArea{
	float:left;
	width:567px;
	}

.f-pageBoxInner .area1 .imgArea ul li{
	float:left;
	width:273px;
	padding:0 9px 9px 0;
	}
	
.f-pageBoxInner .area1 .imgArea ul li img{
	padding:0 0 2px 0;
	}



/*
area2 ---*/
#f-pageBox ul.f-pageBoxInner-s:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}
#f-pageBox ul.f-pageBoxInner-s {
	width: 100%;
}

#f-pageBox .f-pageBoxInner-s li {
	float: left;
	padding: 0;
	margin: 0 20px 20px 0;
	background: #fff;
	border: 1px solid #ccc;
	border-top: 3px solid #693;
	width: 318px;
	}
#f-pageBox .f-pageBoxInner-s li:nth-child(3n) {
	margin: 0 0 20px 0;
	}

#f-pageBox .f-pageBoxInner-s li.end{
	margin-right: 0;
	}

#f-pageBox .end{
	margin-right:0;
	}
	
#f-pageBox .f-pageBoxInner-s .area2{
	padding: 0 0 20px 0;
	width: 318px;
	}
#f-pageBox .f-pageBoxInner-s .detailttlArea {
	background: #eee;
	padding: 16px 19px;
	}

#f-pageBox .f-pageBoxInner-s .area2 .detailttlArea h4 {
    display: block;
    font-size: 20px;
	margin: 0 0 12px 0;
    padding: 0 0 10px 0;
    border-bottom: 1px dotted #ccc;
    font-weight: bold;
    line-height: 1.2;
	color: #000;
}
#f-pageBox .f-pageBoxInner-s .area2 .detailttlArea h4 a {
    color: #000;
    text-decoration: none;
}
#f-pageBox .f-pageBoxInner-s .area2 .detailttlArea h4 a:hover {
    color: #b33b00;
    text-decoration: underline;
}
#f-pageBox .f-pageBoxInner-s .area2 .detailttlArea p{
	font-size:12px;
    line-height: 1.2;
	}

#f-pageBox .f-pageBoxInner-s .area2 .detailttlArea .cachArea{
	font-size:16px;
	padding:10px 0 15px 0;
	font-weight:bold;
	}

#f-pageBox .f-pageBoxInner-s .area2 .pointArea {
	padding: 0 19px 14px 19px;
	line-height: 1.6;
}
#f-pageBox .f-pageBoxInner-s .area2 .pointArea p{
	margin: 0 0 5px 0;
	}

#f-pageBox .f-pageBoxInner-s .area2 .pointArea p.lokemita{
	color:#FF0000;
	padding: 0;
	}

#f-pageBox .f-pageBoxInner-s .area2 table{
	width: 280px;
	border-bottom:solid 1px #eee;
	margin: 0 19px;
	font-size: 12px;
	border-collapse: collapse;
	}
#f-pageBox .f-pageBoxInner-s .area2 table .SpeTag {
	float: left;
    margin: 0 2px 0 0;
}
#f-pageBox .f-pageBoxInner-s .area2 table img{
	margin: 0;
	}
#f-pageBox .f-pageBoxInner-s .area2 th,
#f-pageBox .f-pageBoxInner-s .area2 td{
	border-top:solid 1px #eee;
	padding:8px;
	line-height: 1.4;
	}
#f-pageBox .f-pageBoxInner-s .area2 td.icon {
	padding:8px 0;
	text-align: center;
	}
#f-pageBox .f-pageBoxInner-s .area2 th{
	background: #e1d6cc;
	color: #630;
	width:76px;
	text-align: center;
	}

#f-pageBox .f-pageBoxInner-s .area2 .imgArea{
	padding: 19px;
	}
	
#f-pageBox .f-pageBoxInner-s .area2 .imgArea img{
	width: 100%;
	height: auto;
	}

#f-pageBox .f-pageBoxInner-s .detailBtn{
	padding: 0 19px 19px 19px;
	text-align:center;
	}
#f-pageBox .f-pageBoxInner-s .detailBtn a {
    position: relative;
    display: block;
    background: #693;
    margin: 0;
    padding: 15px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    color: #fff;
    -webkit-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    z-index: 1;
}
#f-pageBox .f-pageBoxInner-s .detailBtn a:hover {
	opacity: 0.8;
}
#f-pageBox .f-pageBoxInner-s .detailBtn a:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    width: 6px;
    height: 6px;
    margin: -4.2px 0 0 0;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 2;
}