@charset "utf-8";
/**/
*{margin:0; padding:0;}
body{font-family:sans-serif;}
article, aside, dialog, figure, footer, header,hgroup, nav, section {display:block;}
/*header{text-align:center; padding-bottom: 0px; border-bottom:1px solid #ccc;  }*/



ul li {
    list-style: none outside none;
}

.clb { clear: both;}
.bold { font-weight: bold;}
.taC { text-align: center;}
.mT10{ margin-top: 10px;}
.mT15{ margin-top: 15px;}
.mB10 { margin-bottom: 10px;}
.mB15 { margin-bottom: 15px;}
.mL10 { margin-left: 10px;}
.fs12 { font-size: 12px;}
.fs10 { font-size: 10px;}
.img_col img { width: 100%; }
.fll { float: left;}



#col_box { background:#FFF; padding-bottom: 30px;}
.header_img { padding: 0;}
.header_img img { width: 100%;}
.img_01 img { width: 95%;}
.img_01 { border-top: #FFF 1px solid;border-bottom: #FFF 1px solid; padding: 0; margin: 0;}

.col_A { line-height:1.4em; font-size: 1.0em; padding: 10px; margin-bottom: 0px;}
.col_B { line-height:1.4em; font-size: 1.0em; padding: 10px; margin-bottom: 10px;}
.col_C { line-height:1.4em; font-size: 1.0em; padding: 0 10px; margin-bottom: 10px;}

.about_nav ul {
display:table;
table-layout: fixed;
width:100%;
z-index: 10;
}
.about_nav li {
	background: #f0f0f0; 
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-right: 1px solid #cdcdcd;
	border-bottom: 1px solid #cdcdcd;
    list-style: none;
	text-align: center;
	display: table-cell;
	vertical-align:middle;
	font-size: 75%;
	width: 100%;
	padding: 8px 0;
	z-index: 10;
	}

.about_nav li a {
    text-decoration: none;
	color:#03C;
	z-index: 10;
}

li.nav_on {
	background: #c1c1c1;
	border-top: 1px solid #b7b7b7;
	border-left: 1px solid #b7b7b7;
	border-right: 1px solid #b7b7b7;
	border-bottom: 1px solid #b7b7b7;
	z-index: 10;
	}

#container li.nav_on a {
	color: #565656;
	z-index: 10;
	}

	

.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
	z-index: 10;
}



h2.content_tit_h2 {
  color: #fff;
  font-size: 1.0em;
  position: relative;
  margin: 10px 0 10px 0;
  padding: 8px 16px;
  background: #820202;
  z-index: 2;
}
h2.content_tit_h2:before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border: 8px solid #fff;
  border-top: 8px solid rgba(0, 0, 0, 0.5);
  border-left: 8px solid rgba(0, 0, 0, 0.5);
}

h3.content_tit_h3 {
	border-left: 5px solid #820202;
	border-bottom: 1px solid #eeeeee;
	color: 000;
	font-size: 1.0em;
	font-weight: bold;
	padding-left: 10px;
	margin: 20px 0 10px 0;
	}

	
	

.point { padding: 5px 8px; border-radius: 8px; border: 1px solid #a68343; font-size: 12px; font-weight: bold; color: #a68343; margin: 0 0 10px 0;}	
.point span { font-size: 14px;}
.point2 { padding: 5px 8px; border-radius: 8px; border: 1px solid #a68343; font-size: 12px; font-weight: bold; color: #a68343; margin: 0 0 10px 0;}	
.point2 span { font-size: 16px; font-weight: bold;}
a.Btn_A {
	display: inline-block;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.88, #820202), color-stop(0.00, #d30d0d));
background: -webkit-linear-gradient(top, #d30d0d 0%, #820202 88%);
background: -moz-linear-gradient(top, #d30d0d 0%, #820202 88%);
background: -o-linear-gradient(top, #d30d0d 0%, #820202 88%);
background: -ms-linear-gradient(top, #d30d0d 0%, #820202 88%);
background: linear-gradient(to bottom, #d30d0d 0%, #820202 88%);
	color: #FFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border: 1px solid #820202;
	-moz-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
	-webkit-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
	text-shadow: 0px 0px 3px rgba(0,0,0,0.5);
	padding: 10px;
	font-size: 20px;
	text-decoration: none;
	font-weight: bold;
	width: 90%;
	text-align: center;
}


a.Btn_A:hover{
background: -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 120, color-stop(0.88, #820202), color-stop(0.00, #d30d0d));
background: -webkit-radial-gradient(50% 100%, circle, #d30d0d 0%, #820202 88%);
background: -moz-radial-gradient(50% 100%, circle, #d30d0d 0%, #820202 88%);
background: -o-radial-gradient(50% 100%, circle, #d30d0d 0%, #820202 88%);
background: -ms-radial-gradient(50% 100%, circle, #d30d0d 0%, #820202 88%);
background: radial-gradient(50% 100%, circle, #d30d0d 0%, #820202 88%);
}

.ranking_col h3 {
	border-left: 5px solid #820202;
	border-bottom: 1px solid #eeeeee;
	color: 000;
	font-size: 1.0em;
	font-weight: bold;
	padding-left: 10px;
	margin: 20px 0 10px 0;
	}
.ranking_col_list_A { padding: 10px; text-align: center;}
.ranking_col_tit_A { 	
	border-bottom: 1px solid #eeeeee;
	color: 000;
	height: 30px;
	font-size: 16px;
	font-weight: bold;
	padding-left: 10px;
	margin: 10px 0 10px 0;
	}
.ranking_col_list_A_tit { font-weight: bold; margin: 10px 0; text-align: left;}	
.ranking_col_list_B_tit { font-weight: bold; font-size: 18px; margin: 10px 0; text-align: left; color:#820202;}	
	
li.ranking_col_img	{ display: block; margin: 0 auto;}
li.ranking_col_img img {margin: 0 auto; text-align: center; width: 220px;}
.ranking_col_tit_A .fa { margin-right: 5px; font-size: 26px;}
.ranking_col_list_A_text { margin: 10px 0; font-size: 14px; text-align: left;}

.ranking_col h3.content_tit_h3_03 {
	border-left: none;
	border-bottom: 1px solid #eeeeee;
	color: 000;
	font-size: 1.0em;
	font-weight: bold;
	padding-left: 10px;
	margin: 20px 0 10px 0;
	}

.ranking_col h3.content_tit_h3_02 {
	color: #FFF;
	font-size: 16px;
	font-weight: bold;
	padding: 5px 10px;
	margin: 10px 0 10px 0;
	background: #820202;
	border: none;
	}



i { margin-right: 5px;}
.yerrow												{ color: #FC0;}
.glay												{ color: #999;}
.space_s											{ letter-spacing: -2px;}
.bronze												{ color:#cc9900;}


/* inner */
.inner {
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding:10px 10px 10px 10px;
	background: #d9f3fc;
	border-top: 1px solid #0068b3;
	border-bottom: 1px solid #0068b3;
	font-size: 0.8em;
	color: #0068b3;
	}

.inner_img { float: left; padding: 10px;}
.inner_col { padding: 0 10px; margin-bottom: 10px;}
.inner_col h5 { font-size: 0.9em; font-weight: bold; color: #0068b3;}
.inner_col p {font-size: 0.8em;}

.col_img { padding: 10px 0; }
.col_img2 { padding: 5px 0; }
.col_img3 { padding: 10px; }
.col_img3 img { width: 100%;}


.col_img_white { margin: 0 auto; width: 300px; padding: 10px 0;  background: #FFF; margin-bottom: 30px;}
.ora_col { background: #ff7200; padding: 10px 0; color: #FFF; font-size: 16px;}

p.LinkBar { border-bottom: 1px solid #CCCCCC; border-top: 1px solid #CCCCCC;}
p.LinkBar a { color: #333333;
    display: block;
    font-weight: bold;
    height: 35px;
    line-height: 35px;
    padding: 0 5px;
    position: relative;
    text-decoration: none;}
	
p.LinkBar a:after{content:"";display:block;width:7px;height:7px;border-right:solid 3px #999;border-bottom:solid 3px #999;-webkit-transform:translate(0, 0) rotate(-45deg);position:absolute;top:50%;right:10px;margin:-3px 0 0 0;transform:rotate(-45deg)}
	
.sample_02_col { padding: 0 10px;}
.sample_02{
	font-size: 0.8em;
width:100%;
border-collapse: separate;
border-spacing: 0px;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
font-weight: bold;
text-align: left;
}
.sample_02 th{
width: 40%;
padding: 10px;
text-align: left;
vertical-align: top;
color: #444;
background-color: #ccc;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.sample_02 td{
padding: 10px;
background-color: #fafafa;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}


.sample_02 td.tit {
width: 60%;	
background-color: #fffec6;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
font-weight: bold;

}

.text01 { padding: 20px 0; font-size: 20px; font-weight: bold;}
.text02 { padding: 10px 0; font-size: 20px; font-weight: bold;}


.LOGO_Area { padding: 5px 5px 0px 5px;}
.LOGO_Area2 { padding: 20px 0px 0px 10px;}


.ConBox {
    background-color: #d9f3fc;
    border: 1px solid #0068b3;
    border-radius: 5px;
    margin: 20px 6px ;
}

.ConBox p {
    font-size: 0.7em;
	padding: 5px;
}



.ConBox2 {
    background-color: #d9f3fc;
    border: 1px solid #0068b3;
    border-radius: 5px;
    margin: 20px 6px ;
	padding-bottom: 10px;
}

.ConBox2 p {
    font-size: 0.9em;
	padding: 5px;
}


.btn--contents {
    border-radius: 5px;
    font-size: 0.9em;
    line-height: 1.2em;
    padding: 5px 20px;
	margin: 10px 0;
}


.Btn_carsensor { background: #f4b300; border-radius: 10px; color: #FFF; font-size: 0.9em; padding: 10px;}
.btn--search{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffaf4b+0,ff920a+100;Orange+3D+%231 */
background: #ffaf4b; /* Old browsers */
background: -moz-linear-gradient(top,  #ffaf4b 0%, #ff920a 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffaf4b 0%,#ff920a 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffaf4b 0%,#ff920a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffaf4b', endColorstr='#ff920a',GradientType=0 ); /* IE6-9 */
box-shadow:0 1px 0 rgba(2,55,120,0.3);border:solid 1px #a47c0d; display: block; font-weight: bold; color: #FFF;}
.btn--search:hover{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fce40f+0,ed7d0e+100 */
background: #fce40f; /* Old browsers */
background: -moz-linear-gradient(top,  #fce40f 0%, #ed7d0e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fce40f 0%,#ed7d0e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fce40f 0%,#ed7d0e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fce40f', endColorstr='#ed7d0e',GradientType=0 ); /* IE6-9 */

box-shadow:0 1px 0 rgba(2,55,120,0.3);border:solid 1px #a47c0d;}



.btn--search_2{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#499bea+0,207ce5+100;Blue+3d+%237 */
text-align: center;
background: #499bea; /* Old browsers */
background: -moz-linear-gradient(top,  #499bea 0%, #207ce5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #499bea 0%,#207ce5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #499bea 0%,#207ce5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5',GradientType=0 ); /* IE6-9 */
box-shadow:0 1px 0 rgba(2,55,120,0.3);border:solid 1px #466bdb; display: block; font-weight: bold; color: #FFF;}

.btn--search_2:hover{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4fb6f7+0,1e4ddb+100 */
background: #4fb6f7; /* Old browsers */
background: -moz-linear-gradient(top,  #4fb6f7 0%, #1e4ddb 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #4fb6f7 0%,#1e4ddb 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #4fb6f7 0%,#1e4ddb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4fb6f7', endColorstr='#1e4ddb',GradientType=0 ); /* IE6-9 */
box-shadow:0 1px 0 rgba(2,55,120,0.3);border:solid 1px #466bdb;}


.btn--search_3{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#499bea+0,207ce5+100;Blue+3d+%237 */
text-align: center;
background: #499bea; /* Old browsers */
background: -moz-linear-gradient(top,  #499bea 0%, #207ce5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #499bea 0%,#207ce5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #499bea 0%,#207ce5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5',GradientType=0 ); /* IE6-9 */
box-shadow:0 1px 0 rgba(2,55,120,0.3);border:solid 1px #466bdb; display: block; font-weight: bold; color: #FFF;
font-size: 1.2em; margin: 0;}

.btn--search_3:hover{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4fb6f7+0,1e4ddb+100 */
background: #4fb6f7; /* Old browsers */
background: -moz-linear-gradient(top,  #4fb6f7 0%, #1e4ddb 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #4fb6f7 0%,#1e4ddb 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #4fb6f7 0%,#1e4ddb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4fb6f7', endColorstr='#1e4ddb',GradientType=0 ); /* IE6-9 */
box-shadow:0 1px 0 rgba(2,55,120,0.3);border:solid 1px #466bdb;}






#acMenu { padding: 10px;}
#acMenu dt{
    display:block;
    width:100%;
    line-height:2.0em;
    text-align:center;
    border:#eee 1px solid;
    cursor:pointer;
	background: #0068b3;
	color: #FFF;
    }
	
	
#acMenu dt::before{
left: 10px;
width: 6px;
height: 6px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}

#acMenu dd{
    background:#fff;
    width:100%;
    line-height:1.4em;
    text-align:center;
    border:#eee 1px solid;
    display:none;
    }
	
#acMenu dd img { width: 90%; padding:10px;}	
/*---------------*/




.arrow{
position: relative;
color: #000;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
}
.arrow::before,
.arrow::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}




.new_item4 { margin-top: 10px; border-bottom: 1px solid #eee; padding: 5px;}
.new_item4:after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}
.new_item4 h4 { margin-left: 30px ; margin-top: 0px; margin-bottom: 0px; line-height: 1.4em; position: relative;margin-right: 10px; font-weight: bold;font-size: 14px; line-height: 1.4em; padding: 3px 0 5px 0;}
.new_item4 h4 img { margin-left: 3px;}
.new_item4 h4.first { margin-left: 0px ; margin-top: 0px; font-weight: normal; font-size: 12px; margin-bottom: 10px; line-height: 1.4em; position: relative;margin-right: 10px; font-weight: normal;font-size: 12px; line-height: 1.4em;}

.new_item4_img { display: block; text-align: center; margin: 0 auto;}


.new_item4 h4.TOP { font-size: 16px;}

#container .rank_1{	position: absolute;	top:-0px;	left:0px;}
#container .rank_1,#container .rank_2,#container .rank_3,#container .rank_other {	position: relative;	top:0px;	left:0px;}
#container .rank_1 {
	background: none repeat scroll 0 0 #FFCC00;  
	color: #FFFFFF;	
	display: inline-block;
    font-weight: bold;
    line-height: 1.3em;
    margin: 0 10px 0 0;
    width: 18px;
	text-align: center;
	font-size:14px;
	padding:3px;
	}


#container .rank_2 {
	background: none repeat scroll 0 0 #999999;  
	color: #FFFFFF;	
	display: inline-block;
    font-weight: bold;
    line-height: 1.3em;
    margin: 0 10px 0 0;
    width: 18px;
	text-align: center;
	font-size:14px;
	padding:3px;
	}
	
	
	
#container .rank_3 {
	background: none repeat scroll 0 0 #CC9900;  
	color: #FFFFFF;	
	display: inline-block;
    font-weight: bold;
    line-height: 1.3em;
    margin: 0 10px 0 0;
    width: 18px;
	text-align: center;
	font-size:14px;
	padding:3px;
	}	











/******************************
 * accordion
******************************/


ul.accordion{
     width:100%;
     overflow: hidden;
}

ul.accordion ul{
     display: none;
}    


ul.accordion li p{
     background: #820202;
     padding:10px 10px;
     border-bottom: 1px solid #fff;
     cursor: pointer;/*カーソルを通常の物に*/
	 color: #FFF;
	 font-size: 14px;
	 font-weight: bold;  
}

ul.accordion ul li{
     background: #fff;
     padding:10px 20px;
 	border-bottom: 1px solid #eeeeee;	 
	font-size: 14px;  
}

ul.accordion ul li:last-child{
     border:none;
}
    
.rank_No { font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; font-weight: bold;}
.rank_txt { font-size: 0.8em; margin-right: 10px;}



/******************************
 ソーシャルエリア全体を囲む要素
 * 他のコンテンツと距離を取りたい場合は[margin]を設定して下さい
******************************/
.social-area-syncer
{
	width: 100% ;
	min-height: 190px ;
	padding: 1.5em 0 ;
}

/* デスクトップPCでは高さを拡張する */
@media screen and ( min-width:480px )
{
	.social-area-syncer
	{
		min-height: 119px ;
	}
}

/******************************
 [ul]要素
******************************/
/* スマホ */
ul.social-button-syncer
{
	width: 238px ;
	margin: 24px auto ;
	padding: 0 ;
	border: none ;
	list-style-type: none ;
}

/* デスクトップ */
@media screen and ( min-width:480px )
{
	ul.social-button-syncer
	{
		width: 410px ;
	}
}

/******************************
 [li]要素
******************************/
ul.social-button-syncer li
{
	float: left ;
	text-align: center ;
	height: 71px ;
	margin: 0 8px ;
	padding:0 ;
}

/******************************
 各種ボタン
******************************/
/* [Twitter] */
.sc-tw
{
	width: 71px ;
}

/* [Facebook] */
.sc-fb
{
	z-index: 99 ;
	width: 69px ;
}

/* [LINE] */
.sc-li
{
	width: 50px ;
}

.sc-li-img
{
	border: none ;
	margin: 0 auto ;
	padding:0 ;
	width: 36px ;
	height: 60px ;
}

/* デスクトップPCではLINEボタンを表示しない */
@media screen and ( min-width:480px )
{
	.sc-li
	{
		display: none ;
	}
}
