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

/*--------------------------------------------
共通
----------------------------------------------*/
html > * {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
	line-height: 1.5;
	background: #fff;
	font-size: 16px;
	-moz-user-select:none;
	-webkit-user-select:none;
	-webkit-user-drag:none;
	-khtml-user-select:none;
	-khtml-user-drag:none;	
	user-select:none;/*コピペ禁止*/
}

/*強調*/
strong {
	color: #E8551F;
}

strong_y {
	font-weight: bold;
	/*color: #ee0000;*/
	/*color: #ff3d0a;*/
	/*background-color: #ff6;*/
	background: linear-gradient(180deg,#fff 0%,#fff 10%,#ff6 10%,#fff 100%);
}

hr {
	border-bottom: 1px solid #d5d5d5;
	margin: 0 0 15px 0;
}

/*リスト表示*/
li {
	list-style: none;
}

/*リンク*/
a {
	color: #333;
}

a:hover {
/*	color: #777;*/
}

/*h系マークアップ用*/
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/*文字寄せ
---------------------------------------*/
/*右寄せ*/
.txt_right {
	text-align: right;
}
/*左寄せ*/
.txt_left {
	text-align: left;
}

.tbl_top_left {
	float: left;
}

.tbl_top_right {
	float: right;
	vertical-align: bottom;
	margin: 0;
	padding: 12px 0 0 0;
}

/*文字サイズ調整
---------------------------------------*/
/*小さく*/
.txt_small {
	font-size: 12px;
}

.text_small {
	font-size: 12px;
}


.txt_middle {
	font-size: 14px;
}


/*文字サイズ調整*/
.txt_verysmall {/*小さく*/
	font-size: 10px !important;
}

.text_verysmall {
	font-size: 10px;
}

/*大きく*/
.txt_large {
	font-size: 16px;
}

.txt_verylarge {
	font-size: 20px;
}

.txt_superlarge {
	font-size: 32px;
}


.gray_text {
	color: gray;
	margin: 0px 0px 15px 0px;
	padding: 10px;
	background: #f1f1f1;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
}
.gray_text_fontcolor_black {
	margin: 0px 0px 15px 0px;
	padding: 10px;
	background: #f1f1f1;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
}

.yellow_text {
	margin: 0px;
	padding: 8px;
	background: #FFFFCC;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
	width: 100%;
}
.green_text {
	margin: 0px;
	padding: 8px;
	background: #CCFFCC;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
	width: 100%;
}

.gold_text {
	margin: 0px;
	padding: 8px;
	background: #fff6e0cc;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
	width: 100%;
}

.yellow_marker {
	background: linear-gradient(180deg,#fff 0%,#fff 10%,#ff6 10%,#fff 100%);
}

/*文章内
--------------------------------------------*/
.yohaku{
	padding: 0 10px;
	width: 100%;
	margin: 0 auto;
}

.text_link{
	text-decoration: underline;
	color: #1a0dab;
}

.yajirushi {
	margin: -25px 0 0 0;
    font-size: 24px;
    font-weight: bold;
	color:#333;
    text-align: center;
}

.padding3{
	padding: 0 0 3px 0;
}

/*注釈
-------------------------------------*/
/*背景色（灰色）*/
.annotation_gray {
	padding: 10px;
	font-size: 12px;
	background: #f1f1f1;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
}

.hosoku_left{
	text-align: left;
	font-size: 10px;
	margin: 0;
	padding: 0px 0px 0px 0px;
	background-color: #fff;
}

.hosoku_right {
	display: block;
	text-align: right;
	margin: 0;
	padding: 0px 0px 0px 0px;
	background-color: #fff;
}


/*見出し背景色
---------------------------------------*/
.orange {
	background: #F90;
}

.red {
	color: #E5293C;
}

.green {
	background: #53AD5C;
}

.blue {
	background: #3683C9;
}

.pink {
	background: #F2719A;
}

.yellow {
	background: #F7B210;
}

.navy {
	background: #222e3d;
}

/*テーブルセル色変更（trに付与）
---------------------------------------*/
/*背景色黄色*/
.cell_yellow {
	background: #FAFFB5;
}

/*背景色オレンジ色*/
.cell_orange {
	background: #FCEDC3;
}

/*Clearfix*/
.cf {
	content: "";
	display: block;
	clear: both;
}

img {
	vertical-align: bottom;
}

.img_sentence{
	max-width: 400px;
}

/*比較表
-------------------------------------------------*/
.text {
	width: 100%;
	margin: 0 auto;
	padding: 0 5px 0 5px;
}
.text_amazon {
	font-size: 13px;
}

.frame_text {
    font-size: 14px;
    text-decoration: underline;
    margin: 10px auto 0;
}
.frame_text4 {
    font-size: 12px;
}

.frame_text_reg {
    font-size: 13px;
    text-decoration: underline;
    margin: 10px auto 0;
}

.frame_text_smbc_gold {
    font-size: 12px;
    text-decoration: underline;
    margin: 7px auto 2px;
}

.img_waku_smbc {
	margin: 0 auto 6px;
}


/*ランキング
-------------------------------------------------*/
.best01,.best02,.best03,.best04,.best05,.best06,.best07,.best08,.best09,.best10 {
	padding: 2px 0 0 46px;
	line-height: 44px;
}

.best99 {
	padding: 2px 0 0 0px;
	line-height: 44px;
}

/*1位表示*/
.best01 {
	background: url(/img/items/best1.gif) no-repeat;
	background-size: 40px;
}
/*2位表示*/
.best02 {
	background: url(/img/items/best2.gif) no-repeat;
	background-size: 40px;
}
/*3位表示*/
.best03 {
	background: url(/img/items/best3.gif) no-repeat;
	background-size: 40px;
}
/*4位表示*/
.best04 {
	background: url(/img/items/best4.gif) no-repeat;
	background-size: 40px;
}
/*5位表示*/
.best05 {
	background: url(/img/items/best5.gif) no-repeat;
	background-size: 40px;
}
/*6位表示*/
.best06 {
	background: url(/img/items/best6.gif) no-repeat;
	background-size: 40px;
}
/*7位表示*/
.best07 {
	background: url(/img/items/best7.gif) no-repeat;
	background-size: 40px;
}
/*8位表示*/
.best08 {
	background: url(/img/items/best8.gif) no-repeat;
	background-size: 40px;
}
/*9位表示*/
.best09 {
	background: url(/img/items/best9.gif) no-repeat;
	background-size: 40px;
}
/*10位表示*/
.best10 {
	background: url(/img/items/best10.gif) no-repeat;
	background-size: 40px;
}

/*以降*/
.best99 {
	background-size: 1px;
}
/*リストアイコン
---------------------------------------------------*/
.li_icon li{
	margin: 0 0 5px 0;
	padding: 2px 0 0 26px;
	height: 24px;
}
.inspection{
	background: url(/img/items/inspection-24.png) no-repeat;
}
.bank {
	background: url(/img/items/bank-24.png) no-repeat;
}
.attention {
	background: url(/img/items/attention-24.png) no-repeat;
}
.search {
	background: url(/img/items/search-24.png) no-repeat;
}
.bank_robbery {
	background: url(/img/items/bank_robbery-24.png) no-repeat;
}
.queen {
	background: url(/img/items/queen_gb-24.png) no-repeat;
}
.fine_print {
	background: url(/img/items/fine_print-24.png) no-repeat;
}

/*-----------------------------------------
レイアウト
---------------------------------------------*/
#wrap {
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: relative;
}

/*---------------------------------------------
ヘッダー
-----------------------------------------------*/
header {
/*	position: fixed;*/
/*	-webkit-backface-visibility: hidden;*/
	position: relative;
	width: 100%;
	height: 40px;
	background: #fff;
	z-index: 100;
}

h1 img {
	max-width: 100%;
}

#head_area {
	position: relative;
}

#head_area::after {
	content: "";
	display: block;
	clear: both;
}

/*ナビゲーション
--------------------------------------------*/
#top_nav {
	background: #fff;
	border-top: 1px solid #e8e8e8;
	border-bottom: 2px solid #330600;
	box-sizing: border-box;
	margin: 0 auto;
	width: 750px;
}

@media screen and (max-width: 979px) {
#top_nav {
    width: 700px;
}
}

@media screen and (max-width: 767px) {
#top_nav {
    width: 90%;
    max-width: 700px;
}
}

@media screen and (max-width: 479px) {
#top_nav  {
    width: 100%;
}
}

#top_nav::after {
	content: "";
	display: block;
	clear: both;
}

#top_nav ul {
	display: table;
	table-layout: fixed;
	width: 100%;
}

#top_nav li {
	display:table-cell;
	height: 40px;
	font-size: 10px;
	text-align: center;
	border-right: 1px solid #d1d1d1;
	box-shadow: 1px 0px 0 #fff;
	text-shadow: 1px 1px 1px #fff;
	vertical-align: middle;
	box-sizing: border-box;
}

#top_nav li a {
	display: block;
	/*padding: 3px 0;*//*iOSで高さが変わる…*/
}

.t_nav {
	padding: 3px 0 3px 20px;
}

.icon01 {
	background: url(/img/items/icon_ranking.png) no-repeat;
	background-size: 16px;
}

.icon02 {
	background: url(/img/items/icon_soku.png) no-repeat;
	background-size: 16px;
}

.icon03 {
	background: url(/img/items/search-24.png) no-repeat;
	background-size: 16px;
}

/*#top_nav li:last-child {
	border-right: none;
	box-shadow: none;
}*/

#top_nav li:first-child {
	width: 65%;
	border-left: 1px solid #d1d1d1;
}

#top_nav li:last-child {
	width: 10%;
}

/*PR表記*/
#top_nav li.top_pr{
	color: #676767;
	font-size: 13px;
}


/*ロゴ
--------------------------------------------------*/
#logo {
}

/*---------------------------------------------
コンテンツ
-----------------------------------------------*/
#contents {
	margin: 0 auto 20px auto;
	width: 750px;
}

@media screen and (max-width: 979px) {
#contents {
    width: 700px;
}
}

@media screen and (max-width: 767px) {
#contents {
    width: 90%;
    max-width: 700px;
}
}

@media screen and (max-width: 479px) {
#contents {
    width: 100%;
}
}

/*見出し
----------------------------------------------*/
.col1 h2,.col2 h2,.kobetsu001 h2,.kuchikomi_box h2 {
	font-size: 20px;
	margin: 15px 0 0 0;
	padding: 6px;
	text-align: center;
	color: #FFFFFF;
}

.col h3 {
	text-align: center;
	font-size: 22px;
}

/*アイコン付見出し*/
.kobetsu001 h3 {
	margin: 0 0 5px 0;
	padding: 2px 0 0 30px;
	font-size: 18px;
	height: 30px;
}

/*見出し
----------------------------------------------*/
.kobetsu002 h2 {
    border-left: 5px solid #f7b210;
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    line-height: 22px;
    padding-left: 10px;
    vertical-align: middle;
	margin: 20px 3px 3px;
}
.kobetsu002 h2 + span {
	display: inline-block;
	vertical-align: middle;
	margin: 20px 0 3px 10px;
	color: #aaa;
	font-size: 16px;
}
.kobetsu002 h3 {
	border-bottom: 3px dotted #53AD5C;
	border-left: 4px solid #53AD5C;
	margin: 15px 0 15px;
	padding: 3px 10px;
	font-size: 19px;
	clear: both;
	margin-left: 5px;
}
.kobetsu002 h4 {
	font-size: 17px;
}
.kobetsu002 p {
	margin: 3px 8px;
}

.kobetsu002 .titleBox {
	margin: 25px 0px 7px;
	padding: 0 10px;
}

.kobetsu002 .maru {
	display: inline-block;
	vertical-align: middle;
	color: #f7b210;
	font-size: 18px;
}

.kobetsu002 .title {
	display: inline-block;
	padding-left: 1px;
	vertical-align: middle;
	font-weight: bold;
	font-size: 18px;
}

.kobetsu002 em {
	background: linear-gradient(transparent 60%, #ff0 0%);
	font-weight: bold;
	font-size: 16px;
}

.kobetsu002 .section {
	border:2px dotted #d1d1d1;
	width: 90%;
	margin: 20px auto 10px;
}

.kobetsu002 .bullet {
	width: 100%;
}

/*----------------------------------------------*/

/*電球アイコン（ポイント）*/
.point_light {
	background: url(/img/items/light-30.png) no-repeat;
}

/*基本条件*/
.point_speech {
	background: url(/img/items/speech_bubble-48.png) no-repeat 0 5px;
	background-size: 30px;
}

/*おすすめポイント*/
.point_popular {
	background: url(/img/items/very_popular_topic-48.png) no-repeat 0 5px;
	background-size: 30px;
}
/*各おすすめポイント*/
.point_popular_point {
	background: url(/img/items/star.png) no-repeat 0 2px;
}

/*注文機能*/
.point_calendar {
	background: url(/img/items/shopping_cart_loaded-48.png) no-repeat 0 2px;
	background-size: 30px;
}

/*スプレッド*/
.point_cost {
	background: url(/img/items/calculator-48.png) no-repeat 0 2px;
	background-size: 30px;
}

/*スワップ*/
.point_swap {
	background: url(/img/items/money_box-48.png) no-repeat 0 2px;
	background-size: 30px;
}

/*優待*/
.point_previlege {
	background: url(/img/items/money_box-48.png) no-repeat 0 2px;
	background-size: 30px;

}

/*キャンペーン*/
.point_campaign {
	background: url(/img/items/crown-48.png) no-repeat 0 2px;
	background-size: 30px;

}


/*バナーヘッダー*/
#catch {
	width: 100%;
	border: 3px solid #f1f1f1;
}

#subcatch {
	width: 100%;
}

/*-----------------------------------------
検索フォーム
--------------------------------------------*/
.form_box {
	margin: 5px;
}
.form_box h2, .form_box h3 {
	color: #333;
	margin: 0 0 5px 0;
	padding: 5px 0;
	text-align: center;
	font-size: 16px;
	border-top: 1px solid #c5c5c5;
	border-right: 1px solid #c5c5c5;
	border-bottom: 3px solid #003B7D;
	border-left: 1px solid #c5c5c5;
	background: rgb(255,255,255);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUyJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUyJSIgc3RvcC1jb2xvcj0iI2YxZjFmMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNGY0ZjQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgb(255,255,255) 0%, rgb(255,255,255) 52%, rgb(241,241,241) 52%, rgb(244,244,244) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(52%,rgb(255,255,255)), color-stop(52%,rgb(241,241,241)), color-stop(100%,rgb(244,244,244)));
	background: -webkit-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 52%,rgb(241,241,241) 52%,rgb(244,244,244) 100%);
	background: -o-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 52%,rgb(241,241,241) 52%,rgb(244,244,244) 100%);
	background: -ms-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 52%,rgb(241,241,241) 52%,rgb(244,244,244) 100%);
	background: linear-gradient(to bottom,  rgb(255,255,255) 0%,rgb(255,255,255) 52%,rgb(241,241,241) 52%,rgb(244,244,244) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f4f4f4',GradientType=0 );
}

.f_box_layout {
	clear: both;
}
.f_box_layout ul {
	width: 100%;
	display: table;
	border-collapse: separate;/* セルの間隔を空ける */
    border-spacing: 2px 1px;
}
.f_box_layout li {
	padding: 10px;
	width: 50%;
	display: table-cell;
	font-size: 12px;
	border: 1px solid #c5c5c5;
	box-sizing: border-box;
}
.f_box_layout input {
	margin: 0 5px 0 0;
	vertical-align: top;
}

/*input[type="checkbox"] {
	display: none;
}

label {
	position: relative;
	display: inline-block;
	padding: 2px 3px 3px 22px;
	cursor: pointer;
	-webkit-transition: all .2s;
	transition: all .2s;
}
label::before,
label::after {
	position: absolute;
	content: '';
	-webkit-transition: all .2s;
	transition: all .2s;
}
label::before {
	top: 50%;
	left: 0;
	width: 14px;
	height: 14px;
	margin-top: -8px;
	background: #f4f4f4;
	border: 1px solid #ccc;
	border-radius: 3px;
}
label::after {
	opacity: 0;
	top: 50%;
	left: 3px;
	width: 8px;
	height: 4px;
	margin-top: -4px;
	border-left: 2px solid #3498db;
	border-bottom: 2px solid #3498db;
	-webkit-transform: rotate(-45deg) scale(.5);
	transform: rotate(-45deg) scale(.5);
}
label:hover::before {
	background: #fff;
}
input[type="checkbox"]:checked + label::before {
	background: #fff;
	border: 1px solid #3498db;
}
input[type="checkbox"]:checked + label::after {
	opacity: 1;
	-webkit-transform: rotate(-45deg) scale(1);
	transform: rotate(-45deg) scale(1);
}*/

.search_result {
    font-weight: bold;
}

.search_result02 {
    font-weight: bold;
	color: orange;
}


/*さらに検索
---------------------------------------------------*/
#acMenu::after {
	content: "";
	display: block;
	clear: both;
}

#acMenu dt{
	float: right;
    display:block;
    width:85px;
	line-height: 24px;
	margin: 5px 5px 5px 0;
	padding: 2px 0 0 28px;
	font-size: 12px;
    border: 1px solid #d1d1d1;
    cursor:pointer;
    background:url(/img/items/plus_icon-40.png) no-repeat 5px 4px;
	background-size: 20px;
}
#acMenu dd{
    width:100%;
    height:auto;
    display:none;
}
#acMenu dt.active{
    background:url(/img/items/minus_icon-40.png) no-repeat 5px 4px;	
	background-size: 20px;
}

.open {
	display: none;
}

/*フォーム 20151028改修版
---------------------------------------------*/
.form_box02 {
	clear: both;
}
.form_box02 > ul {
	display: table;
	width: 100%;
	font-size: 12px;
	margin: 0 0 10px 0;
	padding: 8px 0 8px 10px;
	border: 1px solid #d1d1d1;
}

.form_box02 > ul > li {
	display: table-cell;
	vertical-align: middle;
	padding: 0 0 0 10px;
}

.form_box02 > ul > li:first-child {
	width: 20%;
	border-right: 1px solid #e1e1e1;
	padding: 0 5px 0 0;
}
.form_koumoku ul {
	display: table;
}

.form_koumoku li {
	display: table-cell;
	padding: 0 10px 0 0;
}

.form_koumoku input {
	margin: 0 0 0 0;
	vertical-align: top;
}

.form_koumoku label {
	vertical-align: middle;
}

.submit {
	width: 100%;
}

/*-----------------------------------------
特集ページ（パネル）
-------------------------------------------*/
.feature_panel {
	padding: 10px 5px 0 5px;
}

.feature_panel ul {
	display: table;
	width: 100%;
	padding: 0 0 10px 0;
}
.feature_panel li{
	display: table-cell;
	width: 33%;
	text-align: center;
	padding: 0 5px;
}

.feature_panel li:last-child {
}

.feature_panel img {
	width: 100%;
}

/*特集ページ（ループ）
---------------------------------------------*/
.feature {
	display: table;
	margin: 0;
	width: 100%;
}

.feature ul {
	padding: 5px 0;
background: rgb(255,255,255);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2Y2ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVkZWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgb(255,255,255) 0%, rgb(255,255,255) 51%, rgb(246,246,246) 51%, rgb(237,237,237) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(50%,rgb(255,255,255)), color-stop(50%,rgb(246,246,246)), color-stop(100%,rgb(237,237,237)));
background: -webkit-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
background: -o-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
background: -ms-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
background: linear-gradient(to bottom,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
	border-bottom: 1px solid #fff;
}

/*.feature:last-child {
	margin: 5px 5px 0 5px;
	border-bottom: none;
}*/

.feature li {
	position: relative;/*←矢印アイコン用*/
	display: table-cell;
	vertical-align: top;
}
.feature li:last-child {
	width: 100%;
}

.feature li:last-child::after {
	display: block;
	content: '';
	position: absolute;
	top: 47%;
	right: 1.2em;
	width: 8px;
	height: 8px;
	border-right: 2px solid #777;
	border-bottom: 2px solid #777;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/*.t_img_box {
	position: relative;
	z-index: 100;
}*/
.feature img {
	margin: 0 0 0 5px;
	border: 1px solid #c5c5c5;
}

.feature h3 {
	margin: 0 0 3px 0;
	padding: 0 10px;
	font-size: 16px;
}
.feature p {
	padding: 0 15px 0 10px;
	font-size: 12px;
}

.feature02 {
	display: table;
	margin: 0;
	width: 100%;
}

.feature02 ul {
	padding: 5px 0;
background: rgb(255,255,255);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2Y2ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVkZWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgb(255,255,255) 0%, rgb(255,255,255) 51%, rgb(246,246,246) 51%, rgb(237,237,237) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(50%,rgb(255,255,255)), color-stop(50%,rgb(246,246,246)), color-stop(100%,rgb(237,237,237)));
background: -webkit-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
background: -o-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
background: -ms-linear-gradient(top,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
background: linear-gradient(to bottom,  rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(246,246,246) 50%,rgb(237,237,237) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
	border-bottom: 1px solid #fff;
}

/*.feature02:last-child {
	margin: 5px 5px 0 5px;
	border-bottom: none;
}*/

.feature02 li {
	position: relative;/*←矢印アイコン用*/
	display: table-cell;
	vertical-align: top;
}
.feature02 li:last-child {
	width: 100%;
}

.feature02 li:last-child::after {
	display: block;
	content: '';
	position: absolute;
	top: 47%;
	right: 1.2em;
	width: 8px;
	height: 8px;
	border-right: 2px solid #777;
	border-bottom: 2px solid #777;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/*.t_img_box {
	position: relative;
	z-index: 100;
}*/
.feature02 img {
	margin: 0 0 0 5px;
	border: 1px solid #c5c5c5;
}

.feature02 h3 {
	margin: 0 0 3px 0;
	padding: 0 10px;
	font-size: 16px;
}
.feature02 p {
	padding: 0 20px 0 10px;
	font-size: 14px;
}


/*特集（ループ/パネル式）
----------------------------------*/
/*.feature01 {
	margin: 0 0 15px 0;
}
.feature01 ul {
	display: table;
	width: 100%;
	padding: 5px 0 0 0;
	border-collapse: separate;/* セルの間隔を空ける */
    /*border-spacing: 5px 0;
/*}*/
/*.feature01 li {
	display: table-cell;
	box-sizing: border-box;
	padding: 10px 5px;
}

.feature01 span {
	padding: 2px 0 2px 24px;
}*/

/*背景色*/
/*.bg_color01 {
	background: #096;
}
.bg_color02 {
	background: #F90;
}
.bg_color03 {
	background:#3366CC;
}
/*アイコン*/
/*.i_ranking {
	background: url(/img/items/icon_ranking.png) no-repeat;
	background-size: 20px;
}

.i_iranai {
	background: url(/img/items/icon_iranai.png) no-repeat;
	background-size: 20px;
}

.i_lady {
	background: url(/img/items/icon_lady.png) no-repeat;
	background-size: 20px;
}*/

/*業者紹介（共通・スペック表）
---------------------------------------------*/
.t_space {
	margin: 5px 3px;
	padding: 0px;
/*	border-bottom: 1px solid #d1d1d1;*/
}


.t_space:last-child {
	border-bottom: none;
}

.t_space h3 {
	font-size: 20px;
	margin: 8px 0 5px; 
}

.t_space h3 a {
	text-decoration: underline;
}

/*.t_space h4 {
	width: 100%;
	text-align: center;
	margin: 0 0 5px 0;
	padding: 4px 30px;
	font-size: 16px;
	height: 30px;
	background-color: #ffd700;
}*/

.t_space h4 {
	width: 100%;
	margin: 5px 5px 5px ;
	padding: 4px 30px;
	/*padding: 6px 30px;*/
	font-size: 18px;
	height: 30px;
/*	background-color: #ffffff;*/
}

.t_img {
	display: block;
	max-width: 100%;
	margin: 0 auto 5px;
	padding: 1px;
	border: 1px solid #d5d5d5;
}

.t_space p,.t_space03 p {
	/*margin: 0 0 10px 0;*/
	line-height: 1.3;
}

.t_space p a,t_space02 p a,.t_space03 p a {
/*	color: blue;*/
	text-decoration: underline;
}

.t_space .appeal_point {
	font-size: 17px;
}

.t_space .img_card {
	text-align : center;
	width: 100%;
	margin: 15px auto 0;
}

.t_space02 {
	margin: 5px 5px 10px 5px;
	padding: 0 5px 10px;
/*	border-bottom: 1px solid #d1d1d1;*/
}



.t_space02:last-child {
	border-bottom: none;
}

.t_space02 h3 {
	font-size: 20px;
	margin: 8px 0 5px; 
}

.t_space02 h3 a {
	text-decoration: underline;
}


.t_space02 h4 {
	width: 100%;
	margin: 5px 5px 5px ;
	padding: 6px 30px;
	font-size: 18px;
	height: 30px;
	background-color: #ffffff;
}

.t_img {
	display: block;
	max-width: 100%;
	margin: 0 auto 5px;
	padding: 1px;
	border: 1px solid #d5d5d5;
}

.t_space p,.t_space03 p {
	/*margin: 0 0 10px 0;*/
	line-height: 1.3;
}

.t_space02 p a,t_space02 p a,.t_space03 p a {
/*	color: blue;*/
	text-decoration: underline;
}

.t_space02 .appeal_point {
	font-size: 17px;
}

.t_space02 .img_card {
	text-align : center;
	width: 100%;
	margin: 15px auto 5px;
}

/*PR表記
-------------------------------------------------*/
p.text_pr {
	text-align: right;
	font-size: 14px;
	margin-top: 5px;
	margin-bottom: -15px;
}

/*業者特徴
-------------------------------------------------*/
.point {
	margin-bottom: 2%;
	padding: 5px;
	background: #F9F9AC;
}

.point li {
	padding: 1px 0 0 22px;
	background: url(/img/items/check_green.png) no-repeat;
	background-size: 20px;
}


/*ボタンレイアウト
------------------------------------------*/
.button-box03 {
    width: 100%;
    text-align: center;
}

.post a.button {
    text-decoration: none;
}

.button04 {
	display: block;
	position: relative;
	background-color: #ed2f2f;
	border-radius: 4px;	
	color: #fff;
	line-height: 19px;
	-webkit-transition: none;
	transition: none;
	box-shadow: 0 3px 0 #bbb;/*0e8c73*/
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
	padding: 12px 10px;
	overflow: hidden;
	width: 72%;
	margin: 30px auto 30px;
}

.button07 {
	display: block;
	position: relative;
	background-color: #ed2f2f;
	border-radius: 4px;	
	color: #fff;
	line-height: 11px;
	-webkit-transition: none;
	transition: none;
	box-shadow: 0 3px 0 #bbb;/*0e8c73*/
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
	padding: 12px 10px;
	overflow: hidden;
	width: 80%;
	margin: 10px auto 10px;
}

.button_text {
    color: #fff  !important;
    margin: 0 auto;
    font-size: 16px;
    text-align: center;
}

.reflection {
	background-color: #fff;
	height: 100%;
	width: 30px;
	top: -180px;
	left: 0;
	position: absolute;
    opacity: 0;
	transform: rotate(45deg);
	animation: reflection 3s ease-in-out infinite;
	-webkit-transform: rotate(45deg);
	-webkit-animation: reflection 3s ease-in-out infinite;
	-moz-transform: rotate(45deg);
	-moz-animation: reflection 3s ease-in-out infinite;
	-ms-transform: rotate(45deg);
	-ms-animation: reflection 3s ease-in-out infinite;
	-o-transform: rotate(45deg);
	-o-animation: reflection 3s ease-in-out infinite;
}

@keyframes reflection {
	0% { transform: scale(0) rotate(45deg); opacity: 0; }
	80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
	81% { transform: scale(4) rotate(45deg); opacity: 1; }
	100% { transform: scale(50) rotate(45deg); opacity: 0; }
}


/*補足テキストエリア*/
.hosoku_gray {
	padding: 10px;
	font-size: 12px;
	background: #f1f1f1;
	color: #aaa;
}

.hosoku_gray li {
	/*list-style: inside;*/
}

/*個別ページテキストエリア*/
.txt_area001 {
	margin: 5px;
	padding: 10px;
	border: 1px solid #c5c5c5;
}

.txt_area002 {
	margin: 5px;
	padding: 5px;
}

.txt_area001 p, .txt_area002 p {
	margin: 0 0 10px 0;
}

.txt_area001 p:last-child, .txt_area002 p:last-child {
	margin: 0;
}

.txt_area001 ul, .txt_area002 ul {
	margin: 0 0 10px 0;
}

.txt_area001 a, .txt_area002 a {
	color: blue;
	text-decoration: underline;
}


/*画像レイアウト
------------------------------------------*/
.img_area {
	display: block;
	margin: 10px auto;
	max-width: 95%;
}

/* 親要素（コンテナ）のスタイル */
.rankingbox_card-gallery {
  display: flex;             /* 横並びにする指定 */
  justify-content: center;   /* 中央揃え（左寄せなら flex-start） */
  gap: 20px;                 /* 画像と画像の間の隙間 */
  padding: 0 20px 20px;             /* 周りの余白 */
  max-width: 1000px;         /* 横幅が広がりすぎないように制限 */
  margin: 0 auto;            /* コンテナ自体を画面中央に配置 */
}

/* 画像自体のスタイル */
.rankingbox_card-gallery img {
  width: 30%;                /* 3つ並ぶように幅を調整（隙間を考慮して33%以下に） */
  height: auto;              /* 縦横比を維持 */
  max-width: 150px;          /* 画像が大きくなりすぎないように上限を設定 */
  object-fit: contain;       /* 画像が見切れないように調整 */
}

/*--------------------------------------------
画像スライド
----------------------------------------------*/
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 90px;
  height     : 57px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #fff;
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  left       : -100%;
  animation  : slideAnime 12s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 3s }
.slide img:nth-of-type(3) { animation-delay: 6s }
.slide img:nth-of-type(4) { animation-delay: 9s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { left: -100% }
   3% { left: 0     }
  22% { left: 0     }
  25% { left: 100%  }
 100% { left: 100%  }
}

/*--------------------------------------------
画像スライド
----------------------------------------------*/
.slide3 {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 90px;
  height     : 57px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #fff;
}
 
 /*=== 画像の設定 ======================================= */
.slide3 img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  left       : -100%;
  animation  : slideAnime3 6s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide3 img:nth-of-type(1) { animation-delay: 0s }
.slide3 img:nth-of-type(2) { animation-delay: 2s }
.slide3 img:nth-of-type(3) { animation-delay: 4s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime3{
   0% { left: -100% }
   3% { left: 0     }
  22% { left: 0     }
  28% { left: 100%  }
 100% { left: 100%  }
}

/*フッター
--------------------------------------------------*/
footer {
	padding: 20px 0;
	background: #008000;
	color: #fff;
}

.foot_menu {
	margin: 0 0 10px 0;
	text-align: center;
}

.foot_menu li {
	padding: 0 5px;
	display: inline-block;
}

.foot_menu li:last-child {
}

.foot_menu li a {
	display: inline-block;
	color: #fff;
	text-decoration: underline;
}

#copy {
	text-align: center;
}

#footer {
	clear: both;
	padding: 30px 0 0 0;
	background-color: #c2ff66;
	box-shadow: 2px 0 3px #b5b5b5;
	behavior: url(/PIE.htc);
	font-size: 14px;
}

.footer_contents {
	width: 980px;
	margin: 0 auto;
	padding: 0 0 30px 40px;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
.footer_contents {
	width: 540px;
}
}
@media screen and (max-width: 479px) {
.footer_contents {
	width: 100%;
}
}


.footer_contents a {
	color: #333;
	text-decoration: none;
}

.footer_contents .sitename {
	font-size: 110%;
	font-weight: bold;
	padding: 0 0 5px 0;
}
@media screen and (max-width: 767px) {
.footer_contents .sitename {
	font-size: 16px;
}
}
@media screen and (max-width: 479px) {
.footer_contents .sitename {
	font-size: 14px;
}
}

.footer_contents .mokuji_waku {
	float: left;
	margin: 0 20px 0 5px;
	padding: 0 20px;
}

.footer_contents .groupname {
	margin: 0 0 0 0;
	padding: 0;
	border-bottom: 1px dotted #333;
	font-size: 95%;
	font-weight: bold;
}

.footer_contents li {
	margin: 5px 0 0 0;
	padding: 0 10px 0px 0;
	font-size: 80%;
	list-style:none;
}
@media screen and (max-width: 767px) {
.footer_contents li {
	font-size: 12px;
}
}
@media screen and (max-width: 479px) {
.footer_contents li {
	font-size: 10px;
}
}

.footer_contents li a {
}

.copylights {
	display: block;
	padding: 10px 0;
	text-align: center;
	font-size: 90%;
	/*background: #f8f8f8;*/
	background: #fff;
}

address {
	margin: 0 0 20px 0;
	text-align: center;
	font-size: 85%;
	background: #f8f8f8;
}

address a {
	color: #039;
}

.mokuji_waku {
	float: left;
}







/*ページトップ*/
#topcontrol {
z-index: 9999;
}
/*#pagetop {
	display: none;
	position: fixed;
	bottom: 40px;
	right: 10px;
}
#pagetop a {
	display: block;
	width: 60px;
	height: 60px;
	line-height: 60px;
}*/

/*個別ページ
------------------------------------------*/
.tbl001 {
	width: 100%;
	margin: 0 0 10px 0;
	text-align: center;
}

.tbl001 th,.tbl001 td {
	padding: 3px 6px;
	border: 1px solid #c5c5c5;
}

.tbl001 th {
	background: #f1f1f1;
}

/*特集ページ（パネル）
------------------------------------------*/
.feature_panel {
	padding: 10px 5px 0 5px;
}

.feature_panel ul {
	display: table;
	width: 100%;
	padding: 0 0 10px 0;
}
.feature_panel li{
	display: table-cell;
	width: 33%;
	text-align: center;
	padding: 0 5px;
}

.feature_panel li:last-child {
}

.feature_panel img {
	width: 100%;
}

/*----テーブル----*/

table {
	text-align: center;
	clear: both;
	width: 100%;
	margin: 13px auto;/*10px auto 15px*/
	border-collapse: collapse;
	border: 1px solid #808080;

}

.ranking_content_02 table {
	margin: 0;
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #808080;
}

.btn {
	border: 1px solid #000;
}

thead {
  position: sticky;
  z-index: 10;
  top: 0;
}

th {
	background-color: #dcdcdc;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}

.basic_info th{
	font-size: 12px;
}

@media screen and (max-width: 767px) {
th {
	background-color: #dcdcdc;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}
.thtd_sp_hidden {
	display: none;
}
}

@media screen and (max-width: 479px) {
th {
	background-color: #dcdcdc;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}
}
.th_hikaku {
	background-color: #F3FFD8;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}

@media screen and (max-width: 767px) {
.th_hikaku {
	background-color: #F3FFD8;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}
}

@media screen and (max-width: 479px) {
.th_hikaku {
	background-color: #F3FFD8;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}
}

.th_hikaku2 {
	background-color: #ffeec79e;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}

@media screen and (max-width: 767px) {
.th_hikaku2 {
	background-color: #ffeec79e;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}
}

@media screen and (max-width: 479px) {
.th_hikaku2 {
	background-color: #ffeec79e;
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 14px;
	padding: 2px 2px 2px 2px;
}
}

td {
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 15px;
	padding: 1px 1px 2px;
}

@media screen and (max-width: 767px) {
	td {
		font-size: 14px;
	}
}

@media screen and (max-width: 479px) {
	td {
		font-size: 14px;
	}
}

.td_hikaku {
	font-size: 14px;
}

@media screen and (max-width: 767px) {
.td_hikaku {
	font-size: 13px;
}
}

@media screen and (max-width: 479px) {
.td_hikaku {
	font-size: 13px;
}
}

.td_hikaku_appeal {
	padding: 10px 0;
}

.td_hikaku_small {
	font-size: 13px;
}

@media screen and (max-width: 767px) {
.td_hikaku_small {
	font-size: 11px;
}
}

@media screen and (max-width: 479px) {
.td_hikaku_small {
	font-size: 11px;
}
}



.right_table td {
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 12px;
	padding: 0 0 1px;
}

@media screen and (max-width: 767px) {
.right_table td {
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 12px;
	padding: 0 0 1px;
}
.thtd_sp_hidden {
	display: none;
}
}

@media screen and (max-width: 479px) {
.right_table td {
	border: 1px solid #cccccc;
	text-align: center;
	font-size: 12px;
	padding: 0 0 1px;
}
}

/*logoframe以下のbrを無効にする。画像の頭を揃える是正対応*/
/*三井住友カード (NL)*/
@media screen and (min-width: 554px) {
.logo_frame br{
	display: none;
}
}

/*三井住友カード デビュープラス*/
@media screen and (min-width: 386px) {
.logo_frame2 br:first-child{
	display: none;
}
}

/*ライフカード(学生専用)*/
@media screen and (min-width: 716px) {
.logo_frame3 br:first-child{
	display: none;
}
}

.hikaku-img {
	vertical-align: top;clear: both;
	width: 100%;
	margin: 10px auto;/*10px auto 15px*/
	border-collapse: collapse;
	border: 1px solid #ccc;
	
}

.information th {
	background-color: #dcdcdc;
	border: 1px solid #ccc;
	text-align: center;
	font-size: 14px; /*12px;*/
	padding: 2px 2px 2px 2px;

}

.information td {
	border: 1px solid #ccc;
	text-align: center;
	font-size: 14px; /*12px;*/
	padding: 2px 0 0;

}


.contents {
	background-color: #ebebeb;

}

.content {
	background-color: #ffffff;
	margin: 0 12px 20px;
	padding: 17.5px 15px 16px;
        border: solid 1px #000000;/*線*/
        border-radius: 10px;/*角の丸み*/

}

.box {
    padding: 0.5em 1em;
    margin: 16px 0;
    border: double 5px #cccccc;
}
.box p {
    margin: 0; 
    padding: 0;
}

.box02 {
    padding: 0.5em 1em;
    margin: 8px 0;
    font-weight: bold;
    border: solid 3px #b8ff4d;
}
.box02 p {
    margin: 0; 
    padding: 0;
}

.combination {
	margin: 5px 0;
	align: center;
	width: 33%;
	float: left;

}

.combination p {
	text-align: center;
}

.combination img {
	align: center;
}

.campaign {
    position: relative;	
    margin: 10px 0;
    padding: 0 5px 5px 5px;
    border: solid 3px #1aff1a;

}
.campaign .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #ffaf1a;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0; 


   /* font-size: 1.2em;
    background: #ffaf1a;
    padding: 2px;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;*/
}
.campaign p {
    padding: 10px 20px;
    margin: 0;

}


.points {
    padding: 0.5em 1em;
    margin: 2em 0;
    border: solid 1px #000000;
}
.points li {
    margin: 0; 
    padding: 0;
}

.flex-box {
  display: flex;
  flex-wrap: wrap;
}

.flex-box img {
  vertical-align: top;
  horizontal-align: left;
}

.flex-box01 ul {
	list-style: none;
}

.flex-box01 li {
	background: url(/img/parts/check_mark.png) left 0px top 3px no-repeat;	line-height: 24px;
	background-size: 16px;
	padding-left: 20px;
}

.thumnail-box {
  margin: 0;
  padding: 0;
  list-style: none;
}

.thumnail-box li {
  width: 33%;
  margin: 0 0 0 auto;
}

.thumnail-box li img {
  width: 100%;
  margin: 0 0 auto;
  padding: 20px 20px; 
  border: 1px solid #ccc;
}

.thumnail-box li p {
  text-align: center;
  width: 100%;
  margin: 0 0 2px auto;
  background-color: #faebd7;
  border: 1px solid #ccc;
}

/*注釈*/
.annotation_gray {/*背景色（灰色）*/
	padding: 10px;
	font-size: 14px !important;
	background: #f1f1f1;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
}



.best_01 {
	border-color: #eeda2e;
	border-style: solid;
	border-width: 4px;
	margin: 15px 0;
	padding: 0 10px 10px 10px;
}

.best_02 {
	border-color: #cccccc;
	border-style: solid;
	border-width: 4px;
	margin: 15px 0;
	padding: 0 10px 10px 10px;
}

.best_03 {
	border-color: #ddacac;
	border-style: solid;
	border-width: 4px;
	margin: 15px 0;
	padding: 0 10px 10px 10px;
}

.best_04,.best_05,.best_06,.best_07,.best_08,.best_09,.best_99 {
	border-color: #e6e6e6;
	border-style: solid;
	border-width: 4px;
	margin: 15px 0;
	padding: 0 10px 10px 10px;
}

#acMenu::after {
	content: "";
	display: block;
	clear: both;
}

#acMenu dt{
    text-align: center:
    display:block;
    width:85px;
	line-height: 24px;
	margin: 5px 5px 5px 0;
	padding: 2px 0 0 28px;
	font-size: 12px;
    border: 1px solid #d1d1d1;
    cursor:pointer;
    background:url(/img/parts/plus_icon-40.png) no-repeat 5px 4px;
	background-size: 20px;
}
#acMenu dd{
    width:100%;
    height:auto;
    display:none;
}
#acMenu dt.active{
    background:url(/img/parts/minus_icon-40.png) no-repeat 5px 4px;	
	background-size: 20px;
}

.open {
	display: none;
}
.ranking_top {
    width: 100%;
    display: flex;
    margin: 5px 0 13px;
    text-align: center;
}

/*---注釈アコーディオン---*/
.cp_box *, .cp_box *:before, .cp_box *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.cp_box {
	position: relative;
}
.cp_box label {
	position: absolute;
	z-index: 1;
	bottom: 0;
	width: 100%;
	height: 140px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
	background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 70%);
}
.cp_box input:checked + label {
	background: inherit; /* 開いた時にグラデーションを消す */
}
.cp_box label:after {
	line-height: 31px;
	font-size: 14px;
	position: absolute;
	z-index: 2;
	bottom: 30px;
	width: 110px;
	content: '続きを読む';
	transform: translate(-50%, 0);
	color: #ffffff;
	border-radius: 20px;
	background-color: #9E9E9E;
}
.cp_box input {
	display: none;
}
.cp_box .cp_container {
	overflow: hidden;
	height: 150px; /* 開く前に見えている部分の高さ */
	transition: all 0.5s;
}
.cp_box input:checked + label {
	/* display: none ; 閉じるボタンを消す場合解放 */
}
.cp_box input:checked + label:after {
	content: '閉じる';
}
.cp_box input:checked ~ .cp_container {
	height: auto;
	padding-bottom: 55px; /* 閉じるボタンのbottomからの位置 */
	transition: all 0.5s;
}