@charset "utf-8";

/* 共通
------------------------- */
body {
	font-family: Helvetica, "ヒラギノ角ゴ Pro W3",HiraKakuPro-W3, Osaka, "メイリオ",Meiryo, "ＭＳ Ｐゴシック",verdana, arial, sans-serif;
	color: #333;
}

#contents {padding: 20px 0;}

#article {
    color: #5F5F5F;
	font-size: 13px;
	line-height: 2;
	letter-spacing: 0.2em;
}

#article p {
	line-height: 2;
	padding: 0 10px;
}

#article a {
    -webkit-transition: all .3s;
    transition: all .3s;
}

#article a:hover {
	filter: alpha(opacity=60);
    -moz-opacity: 0.60;
    opacity: 0.60;
    zoom: 1;
    -webkit-transition: all .3s;
    transition: all .3s;
}

#article figure {margin: 0;}

#article section,
#article .main_visual,
#article .point_area section .lead {margin-bottom: 50px;}

#article h3 {
	border-bottom: 4px double #8B8B8B;
	margin-bottom: 15px;
}

#article h3 span {
	display: block;
	color: #5f5f5f;
	font-size: 24px;
	line-height: 30px;
	font-weight: bold;
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_drive_recorder.jpg") no-repeat 7px 50%;
	padding: 3px 0 3px 40px;
}

#article section .column_02,
#article section .column_03,
#article section .column_04,
#article .selection_area .detail_box {overflow: hidden;}

#article section .column_04 li {
	float: left;
	width: 225px;
	margin-right: 20px;
}

#article section .column_02 li dl dd figure,
#article section .column_04 li dl dd figure {
	display: table-cell;
	vertical-align: middle;
}

#article section .column_04 li dl dd figure {
	height: 166px;
	background: #F7F7F7;
}

#article section .column_04 li dl dd p {margin-top: 10px;}

#article section .column_02,
#article section .column_03 {margin-top: 30px;}

#article section .column_02 li {
	float: left;
	width: 470px;
	margin: 0 20px 20px 0;
}

#article section .column_02 li dl dt,
#article .selection_area section h4 {
	color: #FFF;
	font-size: 22px;
	font-weight: bold;
	line-height: 40px;
	text-align: center;
	background: #b8bdc1;
	margin-bottom: 20px;
}

#article section .column_02 li dl dd figure {
	height: 235px;
	margin-bottom: 20px;
}

#article section .column_02 li dl dd p {margin-top: 10px;}

/* パンくず */
#topic_path.new {padding-bottom: 8px;}
#topic_path02.new {padding-top: 8px;}
#topic_path02.new p {
	background: url(https://img.goo-net.com/goopit/assets/img/share/bg-topic_path_home.png) no-repeat left top;
	line-height: 17px;
	width: 934px;
	height: auto;
	margin: 0;
	padding-left: 26px;
}

#topic_path02.new p a,
#topic_path02.new p span {
	background: url(https://img.goo-net.com/goopit/assets/img/share/bg-topic_path_arrow.png) no-repeat left;
	margin: 0;
	padding: 0 7px 0 18px;
}

#topic_path02.new p span {font-size: 11px;}
#topic_path02.new p a {color: #999;}
#topic_path02.new p a:hover {text-decoration: underline;}
#topic_path02.new p a.top {
	background: none;
	color: #E73535;
	padding-left: 0;
}

#topic_path02.new p a.top, #topic_path02.new p a.second, #topic_path02.new p a.third, #topic_path02.new p a.fourth, #topic_path02.new p a.fifth, #topic_path02.new p a.sixth {
	height: 16px;
	font-size: 11px;
}

#topic_path02 {
	width: 960px;
	margin: 0 auto;
}

/* main_visual */
#article .main_visual p {
	color: #FFF;
	font-size: 11px;
	letter-spacing: 0.36em;
	background: #0070C6;
	padding: 10px 18px;
}

/* point_area */
#article .point_area section .column_04 li dl dt {
	text-align: center;
	border: 1px solid #8B8B8B;
	margin-bottom: 10px;
	padding: 0 15px;
}

#article .point_area section .column_04 li dl dt span {
	display: block;
	font-size: 18px;
	font-weight: bold;
	line-height: 58px;
	letter-spacing: 0;
}

#article .point_area section .column_04 li dl dt .image_quality {
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_image_quality.jpg") no-repeat 0 50%;
}

#article .point_area section .column_04 li dl dt .gps {
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_gps.jpg") no-repeat 0 50%;
}

#article .point_area section .column_04 li dl dt .g_sensor {
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_g-sensor.jpg") no-repeat 0 50%;
}

#article .point_area section .column_04 li dl dt .mounting_position {
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_mounting_position.jpg") no-repeat 0 50%;
}

/* glossary_area */
#article .glossary_area section .column_02 {
	border-bottom: 1px dashed #8B8B8B;
	margin: 0;
}

#article .glossary_area section .column_02 li {
	padding: 20px 20px 20px 0;
	margin: 0;
}

#article .glossary_area section .column_02 li dl dt {
	color: #5f5f5f;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.6;
    text-align: left;
	background: #FFF;
	margin-bottom: 10px;
}

/* selection_area */
#article .selection_area section .column_03 {
	padding: 0 10px;
	margin-bottom: 30px;
}

#article .selection_area section .column_03 li {
	float: left;
	width: 300px;
	margin: 0 20px 10px 0;
}

#article .selection_area section .column_03 li a {
	display: block;
	color: #979797;
	text-align: center;
	text-decoration: none;
	line-height: 38px;
	border: 1px solid #979797;
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_under_arrow.gif") no-repeat 97% 50%;
}

#article .selection_area section section {margin-bottom: 20px;}

#article .selection_area section section .detail_box {
	letter-spacing: 0;
	margin-bottom: 20px;
}

#article .selection_area section section .detail_box figure {
	float: left;
	width: 272px;
	height: 204px;
	background: #C6C6C6;
}

#article .selection_area section section .detail_box dl {
	float: right;
	width: 658px;
}

#article .selection_area section section .detail_box dl dt {line-height: 1.4;}

#article .selection_area section section .detail_box dl dt span {
	display: block;
	font-size: 18px;
	font-weight: bold;
}

#article .selection_area section section .detail_box dl dd .price {color: #EC3839;}

#article .selection_area section section .detail_box dl dd p,
#article .selection_area section section .detail_box dl dd div {
	font-weight: bold;
	letter-spacing: 0;
	line-height: 1.6;
	padding: 0;
	margin-bottom: 3px;
}

#article .selection_area section section .detail_box dl dd p span {
	display: inline-block;
	/display: inline;
	width: 150px;
	/zoom: 1;
}

#article .selection_area section section .detail_box dl dd p a {
	text-decoration: none;
	font-weight: normal;
}

#article .selection_area section section .detail_box dl dd p .tel {
	background: url("https://img.goo-net.com/goopit/assets/img/feat/driverecorder/icon_tel.gif") no-repeat 0 50%;
	padding-left: 15px;
	margin-left: 5px;
}

#article .selection_area section section .detail_box dl dd div span {display: block;}

#article .selection_area section section .detail_box dl dd ul {
	display: inline-block;
	/display: inline;
	width: 310px;
	vertical-align: top;
	padding-right: 10px;
	/zoom: 1;
}

#article .selection_area section section .detail_box dl dd ul li {
	font-size: 11px;
	font-weight: normal;
}

#article .selection_area section section h5 {
	font-size: 18px;
	border-bottom: 1px solid #8B8B8B;
	padding-bottom: 10px;
	margin-bottom: 10px;
	padding: 0 10px;
}

#article .selection_area section section section {
	border-bottom: 1px solid #8B8B8B;
	margin-bottom: 40px;
	padding-bottom: 10px;
}

#article .selection_area section section section section {border-bottom: none !important;}

#article .selection_area section section section .box {
	border-bottom: 1px dashed #8B8B8B;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

#article .selection_area section section section li p {margin-top: 5px;}

#article .selection_area section section section .column_04 {margin: 20px 0;}

#article .selection_area section section section .column_04.ttl,
#article .selection_area section section section .column_04.lead {margin-top: 0;}

#article .selection_area section section section .column_04 li {
	height: 165px;
	background: #C6C6C6;
}

#article .selection_area section section section .column_04 .ttl,
#article .selection_area section section section .column_04 .lead {
	height: auto;
	background: none;
}

#article .selection_area section section section .column_04 li p {padding: 0;}

#article .selection_area section section section li span {
	display: block;
	font-size: 13px;
	font-weight: bold;
}

#article .selection_area section section section .column_02 {margin-top: 0;}

#article .selection_area section section section .column_02 li .column_02 li {
	width: 225px;
	margin-bottom: 0;
}

/* comparison_area */
#article .comparison_area section .tab_link {
	overflow: hidden;
	margin: 25px 0 40px;
}

#article .comparison_area section .tab_link li {
	float: left;
	width: 320px;
	text-align: center;
}

#article .comparison_area section .tab_link li a {
	display: block;
	width: 140px;
	color: #b8bdc1;
	font-size: 16px;
	line-height: 40px;
	letter-spacing: 0;
	text-decoration: none;
	border-bottom: 2px solid #b8bdc1;
	margin: 0 auto;
}

#article .comparison_area section .tab_link li .active {
	color: #5f5f5f;
	font-weight: bold;
	border-bottom: 2px solid #5f5f5f;
}

#article .comparison_area section section {display: none;}

#article .comparison_area section .active {display: block;}

#article .comparison_area section table {
	width: 100%;
	font-size: 11px;
	border: 1px solid #c6c6c6;
	border-collapse: collapse;
}

#article .comparison_area section table th,
#article .comparison_area section table td {
	border: 1px solid #c6c6c6;
	padding: 10px;
}

#article .comparison_area section table td {text-align: center;}

#article .comparison_area section table thead th {
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.14em;
}

#article .comparison_area section table thead td {padding: 4px;}

#article .comparison_area section table thead .ttl {
	font-size: 11px;
	background: #E3E3E3;
}

#article .comparison_area section table td span {
	font-size: 18px;
	line-height: 1;
}

/* btn_area */
#article .btn_area ul {
	overflow: hidden;
	padding: 0 20px;
}

#article .btn_area ul li {
	float: left;
	width: 450px;
	margin-right: 20px;
}

/* page_top */
#page_top{
	width: 960px;
	margin: 0 auto;
	text-align: right;
	padding-top: 0;
}

#page_top span a {
	background: url(https://img.goo-net.com/goopit/assets/img/magazine/common/icon_top_page.png) right center no-repeat;
	display: inline-block;
    height: 23px;
	text-decoration: underline;
    color: #0099ff;
	font-size: 13px;
	padding-right: 20px;
}

/* 調整用
------------------------- */
.mb0{margin-bottom: 0 !important;}
.mb5{margin-bottom: 5px !important;}
.mb10{margin-bottom: 10px !important;}
.mb20{margin-bottom: 20px !important;}
.mb30{margin-bottom: 30px !important;}
.mr0{margin-right: 0 !important;}
.mt0{margin-top: 0 !important;}
.pt0{padding-top: 0 !important;}
.pb0{padding-bottom: 0 !important;}
.pb20{padding-bottom: 20px !important;}
.pr0{padding-right: 0 !important;}
.right{text-align: right !important;}
.center{text-align: center !important;}
.bold{font-weight: bold !important;}
.float_L{float: left !important}
.float_R{float: right !important}
.w_100 {width: 100% !important;}
.border_b_none {border-bottom: none !important;}