@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Asap+Condensed:600');



/*@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.3.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
*/



/*additional reset
---------------------------------------------------*/
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

body.safari #content,
body.safari #footer {
    /*サファリでリンク先から戻った時文字が拡大する対応*/
    -webkit-text-size-adjust: 100%;
}

body {
    font: 14px/1.5 "Yu Gothic", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}



/** link **/

a:link {
    color: #1c7fbd;
    text-decoration: underline;
    font-weight: bold;
}

a:visited {
    color: #1c7fbd;
}

a:hover,
a:active {
    text-decoration: none;
}

.taC {
    text-align: center;
}

.taR {
    text-align: right;
}


/*初期設定
----------------------------------------------------*/
#wrapper {
    width: 700px;
    margin: 0 auto;
    padding: 0 0 0 0;
    overflow: hidden;
    color: #222;
    background: #fff;
}
@media screen and (max-width: 768px) {
    #wrapper {
        width: 100%;
    }
}
#wrap {
    width: 800px;
    margin-right: auto;
    margin-left: auto;
}

#content {
    margin: 0 auto;
    width: 700px;
    text-align: left;
    background-color: #fff;
    color: #000;
}

.content-main {
    /*width: 700px;*/
}

img {
    width: 100%;
    object-fit: contain;
    display: block;
}

img.pics {
    max-width: 100%;
    width: 700px;
}


.ie8 img {
    width: auto;
}


/*clearfix*/
.clearfix2 {
    clear: both;
    zoom: 1;
}

.clearfix3:after {
    content: "";
    display: block;
    clear: both;
}

.marker {
    background: linear-gradient(transparent 60%, #fdfb70 0%);
    font-weight: bold;
}
p {
    color: #474747;
}

/*layout
----------------------------------------------------*/

/* ========== ヘッダー ========== */
header {
    background: #e4f9ff;
    color: #fff;
}
.nav-wrapper {
    position: relative;
}

.header_flex {
    display: flex;
    padding: 2%;
    font-size: 14px;
}
.header_flex .left {
    flex: 6;
}

.title_top {
    display: flex;
    align-items: center;
    color: #026aa1;
}

/*
検索実装とナビ
----------------------------*/

.nav-wrapper{
	position: relative;
}


/* 
hamburger(ハンバーガーアイコン)
=================================== */
.hamburger {
	position: absolute;
	right: 15px;
	top: 13px;
	width: 30px;
	height: 25px;
	cursor: pointer;
	z-index: 300;
}

.hamburger__line {
	position: absolute;
	width: 20px;
	height: 2px;
	right: 0;
	background-color: #026aa1;
	transition: all 0.5s;
}

.hamburger__line--1 {
	top: 3px;
}

.hamburger__line--2 {
	top: 10px;
}

.hamburger__line--3 {
	top: 18px;
}

/*ハンバーガーがクリックされたら*/
.open .hamburger__line--1 {
	transform: rotate(-45deg);
	top: 5px;
	background-color: #026aa1;
}

.open .hamburger__line--2 {
	opacity: 0;
}

.open .hamburger__line--3 {
	transform: rotate(45deg);
	top: 5px;
	background-color: #026aa1;
}

/* 
sp-nav(ナビ)
=================================== */
.sp-nav {
	position: fixed;
	top: -100%;
	/*ハンバーガーがクリックされる前はWindow上部に隠す*/
	right: 0;
	width: 100%;
	/* 出てくるスライドメニューの幅 */
    height: 15vh;
	background-color: #FFFFFFE0;
	transition: all 0.5s;
	color: #333333;
	z-index: 200;
	overflow-y: auto;
	text-align: left;
	padding: 2em 1.5em 0em;
	border-radius: 0 0 15px 15px;
}

.sp-nav a {
	text-decoration: none;
	color: #333333;
	line-height: 1.4;
	font-weight: 500;
}

/*ハンバーガーがクリックされたら上からスライド*/
.open .sp-nav {
	top: 0;
}


/* 
black-bg(ハンバーガーメニュー解除用bg)
=================================== */
.black-bg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 5;
	background-color: #000;
	opacity: 0;
	visibility: hidden;
	transition: all 0.5s;
	cursor: pointer;
	z-index: 100;
}

/*ハンバーガーメニューが開いたら表示*/
.open .black-bg {
	opacity: 0.3;
	visibility: visible;
}

@media (max-width: 768px) {
	.hamburger {
		right: 15px;
		top: 7px;
	}

	.sp-nav {
		padding: 2em 0.1em 0em;
		height: 18vh;
	}
}

h1 {
    margin: 0;
    line-height: 0;
    position: relative;
}
.slider {
}

/* テーブルを囲ってる箱 */
.diffTable__box {
  /* 横幅 */
  width: 100%;
  /* 高さ */
  height: auto;
  /* 線｜太さ｜線種｜色｜ */
  border: 5px solid #a0d8ef;
  box-sizing: border-box;
  /* 外側の上余白 */
  margin-top: 10px;
  max-width: 100%;
}

/* テーブル全体の設定 */
.diffTable__area table {
  width: 100%;
  table-layout: fixed;
}

/* ひとマス分の設定 */
.diffTable__area table tr th,
.diffTable__area table tr td {
  /* 内側の余白｜上下余白｜左右余白｜ */
  padding: 10px 5px;
}

/* 画像が入るマスの部分 */
.diffTable__area table tr th {
  /* 要素の揃え位置 */
  vertical-align: bottom;
}

/* それ以外のマス部分 */
.diffTable__area table tr td {
  /* 要素の揃え位置 */
  vertical-align: top;
}

/* 各行の最後のマス */
.diffTable__area table tr th:last-of-type,
.diffTable__area table tr td:last-of-type {
  /* 罫線なし */
  border-right: none;
}

/* リンク部分 */
.diffTable__area table tr td a {
  display: block;
  /* 横幅 */
  width: 100%;
  /* 高さ */
  height: auto;
  /* 文字色 */
  color: #1C7FC1;
  /* 文字飾り */
  text-decoration: underline;
}

/* リンク部分のホバー設定 */
.diffTable__area table tr th a:hover,
.diffTable__area table tr td a:hover {
  /* 文字飾り */
  text-decoration: none;
}

.diffTable__area table tr th a .itemImg__box {
  height: 120px;
  /* 枠の高さ固定 */
}

/* 商品画像 */
.diffTable__area table tr th a .itemImg__box img {
  /* 横幅 */
  width: 100%;
  /* 固定の縦幅 */
  height: 69px;
  /* 画像を切り抜いて収める */
  object-fit: cover;
}



/* 背景水色の見出し部分 */
.diffTable__area table tr th.tableHead {
  /* 背景色 */
  background: #0abfff;
  /* 文字色 */
  color: #fff;
  /* 文字の太さ */
  font-weight: bold;
  /* 文字の大きさ */
  font-size: 16px;
  border-bottom: 1px solid #FFFFFF;
}


/* 評価と評価文の部分 */
.diffTable__area table tr td .evalu,
.diffTable__area table tr td .text {
  /* テキストの位置 */
  text-align: center;
  display: block;
}

/* 評価の「◎」部分 */
.diffTable__area table tr td .evalu {
  /* 行間 */
  line-height: 1;
}
/* 評価の「○」部分 */
.diffTable__area table tr td .evalu.maru {
  /* 行間 */
  line-height: 1.4;
}

.ex {
  font-size: 35px !important;
  line-height: 1.2 !important;
}

.go {
  font-size: 60px !important;
  line-height: 0.7 !important;
}

@media screen and (max-width:699px) {
  .go {
    font-size: 35px !important;
    line-height: 1 !important;
  }
}

.so {
  font-size: 27px !important;
  line-height: 1.1 !important;
}

.ba {
  font-size: 40px !important;
}

.nom_hyo {
  font-weight: bold;
  font-size: 0.8em;
}

.star_tr {
  text-align: center;
}

.rankstar {
  color: #d4b45f;
}

.yws_star {
  position: relative;
  letter-spacing: 0;
  color: #fff;
  margin: 0;
  padding: 0;
}

/* 半分欠ける星 */
.yws_star:before {
  content: "★★★★★";
  position: absolute;
  color: #d4b45f;
  width: calc(4.5em - 0 * (4.5em - .5em));
  overflow: hidden;
  white-space: nowrap;
}

.yws_star02,
.yws_star03 {
  position: relative;
  letter-spacing: 0;
  color: #fff;
  margin: 0;
  padding: 0;
}

.yws_star02:before,
.yws_star03:before {
  content: "★★★★★";
  position: absolute;
  color: #d4b45f;
  overflow: hidden;
  white-space: nowrap;
}

.yws_star02:before {
  width: calc(3.5em - 0 * (3.5em - .5em));
}

.yws_star03:before {
  width: calc(3.5em - 1em);
}

/* 比較表内のボタン */
.rankbtn {
  background: #F68B1F;
  border-radius: 10px;
  box-shadow: 0px 4px 0px #F15A22;
  color: #fff !important;
  text-decoration: none !important;
  line-height: 1.2;
  padding: 12% 0;
  font-size: 0.9em;
  vertical-align: middle;
}

.btn_dr {
  padding: 5% 0
}

/* 評価文 */
.diffTable__area table tr td .text {
  /* 文字の大きさ */
  font-size: 12px;
}

.bg-yellow {
  /* 背景色 */
  background: #ffffe6;
}

.red {
  /* 文字色 */
  color: #f8525d;
}

.blue {
  /* 文字色 */
  color: #008eff;
}

.black {
  /* 文字色 */
  color: black;
}

.yellow {
  /* 文字色 */
  color: #ff9900;
}

.size-larger {
  /* 文字の大きさ */
  font-size: 56px;
}

.size-large {
  /* 文字の大きさ */
  font-size: 40px;
}

.size-small {
  /* 文字の大きさ */
  font-size: 10px;
  vertical-align: sub;
}

.weight-bold {
  /* 文字の太さ */
  font-weight: bold;
}

.weight-normal {
  /* 文字の太さ */
  font-weight: normal;
}

.align-top {
  vertical-align: text-top;
}

/* レスポンシブの設定（任意 / 画面サイズ700px以下） */
@media screen and (max-width:700px) {

  /* テーブルを囲ってる箱 */
  .diffTable__box {
    /* 設定幅を超える場合はスクロールする */
    overflow-x: scroll;
  }

  .diffTable__area table {
    width: 540px;
  }

  .diffTable__area table tr th {
    position: static;
  }

  /* 評価の「◎」部分 */
  .diffTable__area table tr td .evalu {
    /* 行間 */
    line-height: 1.4;
  }

  .size-larger {
    /* 文字の大きさ */
    font-size: 40px;
  }

  /* 背景水色の見出しテキスト */
  .diffTable__area table tr th.tableHead span {
    position: sticky;
    left: 0;
    right: 0;
    top: 0;
    display: block;
  }
}

.sp_hyouji {
  text-align: center;
  font-size: 15px;
}

.sp_hyouji2 {
  text-align: center;
  font-size: 12px;
  color: #858585;
  margin: 4px 0 0;
}

.pc {
  display: none;
}

.diffTable__area table tr th.tableHead {
  text-align: center;
  /* 中央揃え */
  white-space: nowrap;
  /* テキストが折り返されないように設定 */
  width: 70px;
  /* 見出しの幅を狭める */
  padding: 5px 0;
  /* 上下のパディングを設定 */
}

/* 画像が入るマスの部分の調整 */
.diffTable__area table tr th a .itemImg__box img {
  width: auto;
  /* 画像の幅を自動調整に変更 */
  height: 100%;
  /* 画像の高さをマスに合わせて調整 */
}

/* テーブルのセルの調整 */
.diffTable__area table tr td {
  vertical-align: middle;
  /* セル内の内容を中央揃えに */
  padding: 10px;
  /* パディングを均一に設定 */
}

/* 各セルの調整 */
.diffTable__area table tr th,
.diffTable__area table tr td {
  padding: 10px 5px;
  /* パディングを調整 */
  vertical-align: middle;
  /* 垂直方向の中央揃え */
}

/* 製品情報部分 */
.diffTable__area table tr td {
  width: 16%;
  /* 製品情報の幅を調整（全体から見出しの幅を引いた割合） */
  padding: 5px 3px;
  border-right: 2px dotted #c4c4c4;
  line-height: 1.3
}

/* 最後の列の罫線を削除 */
.diffTable__area table tr td:last-of-type {
  border-right: none;
}

/* スマホ表示の調整も必要に応じて行う */
@media screen and (max-width:700px) {
  .diffTable__area table tr th.tableHead {
    width: 15%;
  }

  .diffTable__area table tr td {
    width: 23.33333%;
    /* 各製品の幅を調整 */
  }
}

.diffTable__area table th {
  padding: 8px 12px;
  /* パディングを設定 */

}

/* テーブルヘッダー部分のデザイン */
.diffTable__area table th.tableHead {
  background: #4dd1fb;
  color: white;
  font-weight: bold;
  text-align: center;
  padding: 10px 5px;
  white-space: nowrap;
  width: 50px;
  /* 項目部分の横幅を広げる */
  padding: 10px;
  /* パディングも調整可能 */

}

/* テーブルのデータ部分（残りの幅を均等に設定） */
.diffTable__area table td {
  text-align: center;
  vertical-align: middle;
  padding: 10px 5px;
  border-right: 2px dotted #c4c4c4;
  width: calc((100% - 20px) / 5);
  /* thの50pxを引いた残りの幅を5つのtdに均等に分割 */
  border-bottom: 2px dotted #c4c4c4;
  /* 横にもドット線を追加 */

}

/* 最後の列の右側のボーダーを削除する（オプション） */
.diffTable__area table th:last-of-type,
.diffTable__area table td:last-of-type {
  border-right: none;
}

/* 最後の行の下罫線を削除 */
.diffTable__area table tr:last-of-type th,
.diffTable__area table tr:last-of-type td {
  border-bottom: none;
}

/* 商品画像 */
.diffTable__area table th a .itemImg__box img {
  width: 100%;
  height: auto;
}

/* 縦横の罫線をドットに統一 */
.diffTable__area table th,
.diffTable__area table td {
  /* 縦横の線をドットに統一 */
  text-align: center;
  padding: 10px 5px;
  vertical-align: middle;
}

/* スマホ対応 */
@media screen and (max-width: 700px),
screen and (max-width: 600px) {
  .diffTable__box {
    overflow-x: scroll;
  }

  .diffTable__area table {
    table-layout: fixed;
    /* テーブルレイアウトを固定 */
    width: 660px;
    /* 幅を固定 */
  }

  .diffTable__area table th.tableHead {
    width: 30%;
    white-space: nowrap;
    padding: 10px 0;
    background: #4dd1fb;
    color: white;
  }

  .diffTable__area table td {
    width: 23.33333%;
  }

  .diffTable__area .itemImg__box img {
    height: 100px;
    /* 画像の高さを固定 */
    width: auto;
    /* 横幅は自動調整 */
    object-fit: contain;
    /* 画像が枠内に収まるように調整 */
  }
}

tr:first-child td {
  vertical-align: top !important;
}

.caution_txt {
    text-align: right;
    font-size: 8px;
}

.box01 {
    background: #fffce7;
    padding: 10px 20px;
    margin: 0 0 25px;
}
.box02 {
    background: #ececec;
    padding: 20px 20px 3px;
    margin: 0 0 25px;
}
h2 {
    margin: 20px 0 10px;
}
.box03 {
    padding: 1px 13px;
    background: #e2f1ff;
    border-left: 5px solid #1fade7;
    border-radius: 10px;
    margin: 20px 0;
}
.box03 h3 {
    font-size: 19px;
    border-bottom: 2px dotted #1fade7;
    padding-bottom: 7px;
    line-height: 1.3;
    text-align: center;
}


.box28 {
    margin: 2em 0;
    background: #ffffff;
    border: solid 2px #ffa722;
}

.box28 .box-title {
    font-size: 1.2em;
    background: #ffa722;
    padding: 4px;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    letter-spacing: 0.05em;
}

.box28 p {
    padding: 15px 20px;
    margin: 0;
}


table.point {
    border-collapse: collapse;
    width: 85%;
    margin: 0 auto;
    border: 1px solid #999;
}

table.point td {
    border-collapse: collapse;
    font-size: 0.8rem;
    text-align: center;
    border: 1px solid #999;
    vertical-align: middle;
    background-color: #fff;
    padding: 10px;
}


table.point td:nth-child(1) {
    background: #f7f7f7;
}

@media screen and (max-width: 768px) {

    /*タブレット、スマホの場合*/
    table.point {
        width: 95%;
        margin: 0 auto;
        border: 1px solid #999;
    }
}


/* ------アコーディオン（成分）--------- */
.accordion {
    margin: 2em 0;
}

.accordion__summary {
    background: #cfcfcf;
    /* アコーディオンの見出しの背景色 */
    position: relative;
    display: block;
    cursor: pointer;
    padding: 10px 38px 10px 10px;
    font-size: 15px;
}

.accordion__summary::after {
    content: "▼";
    font-size: 1em;
    /* 記号のサイズ */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.accordion input:checked~.accordion__summary::after {
    content: "−";
}

.accordion input {
    display: none;
}

.accordion__detail {
    display: none;
    background: #fff;
    padding: 4px 10px;
    margin: 10px 0;
}

.accordion input:checked~.accordion__detail {
    display: block;
}

.accordion__text {
    margin: 0;
}
h5 {
    padding: 0.5em;
    color: #1fade7;
    background: #e9f9ff;
    border-left: solid 5px #1fade7;
    font-weight: bold;
    margin-bottom: 20px;
    margin-top: 0%;
    font-size: large;
}
video {
    display: block;
    object-fit: contain;
    width: 100%;
    margin: 15px auto;
}


/* ------アコーディオン（レポ）--------- */
h7 {
    padding: 10px 15px;
    border-left: 3px solid #71C1DE;
    font-size: 18px;
    margin: 30px 10px;
}




.acc_wrapper {
    margin: 20px auto;
}

.acc_content_wrapper {
    position: relative;
    margin-bottom: 45px;
}

element.style {
    height: 90px;
}

@media screen and (min-width: 700px) {
    .frame {
        padding: 15px;
        margin-top: 20px;
        /* position: relative; */
    }
}
.show_more,
.show_more02 {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 15px;
    padding-top: 60px;
    text-align: center;
    line-height: 15px;
    background: linear-gradient(180deg, rgb(255, 255, 255, 0) 0%, rgb(255, 255, 255, 1) 70%);
    cursor: pointer;
    transition: bottom 0.2s;
}
element.style {
    height: auto;
}
.acc_content {
    height: 12vh;
    overflow: hidden;
}
.active {
    background: none;
}
.show_more span {
    background: #ff8a00;
    border: 7px solid #ff8a00;
    border-radius: 5px;
    color: #ffffff;
}


/* 口コミ・タブ */
.tab_menu01,
.tab_menu,
.tab_menu2,
.tab_menu3,
.tab_menu4,
.tab_menu5 {
    z-index: 2;
    position: relative;
    font-size: 14px;
    padding: 1% 0;
    width: 32%;
    margin: 0 3px 0 0;
    color: #fff;
    background-color: #9c9c9c;
    line-height: 36px;
    float: left;
    text-align: center;
    transition: all 0.2s ease;
    border-radius: 8px 8px 0 0;
    cursor: pointer;
    box-sizing: border-box;
}

.tab_menu01 {
    width: 48.5%;
}

@media (max-width: 768px) {

    .tab_menu,
    .tab_menu2,
    .tab_menu3,
    .tab_menu4,
    .tab_menu5 {
        width: 31%;
    }

    .tab_menu01 {
        width: 47%;
    }

    .tab_menu01:first-of-type,
    .tab_menu:first-of-type,
    .tab_menu2:first-of-type,
    .tab_menu3:first-of-type,
    .tab_menu4:first-of-type,
    .tab_menu5:first-of-type {
        margin: 0 5px 0 16px;
    }
}

.tab_menu01:hover,
.tab_menu:hover,
.tab_menu2:hover,
.tab_menu3:hover,
.tab_menu4:hover,
.tab_menu5:hover {
    color: #838383;
}

.tab_menu01:first-of-type,
.tab_menu:first-of-type,
.tab_menu2:first-of-type,
.tab_menu3:first-of-type,
.tab_menu4:first-of-type,
.tab_menu5:first-of-type {
    margin: 0 5px 0 10px;
}

input:checked+.tab_menu01,
input:checked+.tab_menu,
input:checked+.tab_menu2,
input:checked+.tab_menu3,
input:checked+.tab_menu4,
input:checked+.tab_menu5 {
    background-color: #1fade7;
    border-bottom: solid 2px #1fade7;
    color: #fff;
}

input[name="tab_menu01"],
input[name="tab_menu"],
input[name="tab_menu2"],
input[name="tab_menu3"],
input[name="tab_menu4"],
input[name="tab_menu5"] {
    display: none;
}

.tab_content {
    display: none;
    z-index: 1;
    clear: both;
    background-color: #fff;
    border: solid 2px #ccc;
    border-radius: 0px;
    padding: 0% 3% 0%;
    position: relative;
    top: -2px;
}

#tab_01:checked~#tab_01_content,
#tab_02:checked~#tab_02_content,
#tab_a:checked~#tab_a_content,
#tab_b:checked~#tab_b_content,
#tab_c:checked~#tab_c_content,
#tab_d:checked~#tab_d_content,
#tab_e:checked~#tab_e_content,
#tab_f:checked~#tab_f_content,
#tab_g:checked~#tab_g_content,
#tab_h:checked~#tab_h_content,
#tab_i:checked~#tab_i_content,
#tab_j:checked~#tab_j_content,
#tab_k:checked~#tab_k_content,
#tab_l:checked~#tab_l_content,
#tab_m:checked~#tab_m_content,
#tab_n:checked~#tab_n_content,
#tab_o:checked~#tab_o_content,
#tab_p:checked~#tab_p_content {
    display: block;
}
.voice {
    width: 15%;
}
.voice img {
    width: 100%;
    margin-right: 2%;
}

.fukidashi{
    width: 83%;
}
h2.voice_title {
    font-size: 23px;
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 5px;
    margin-top: 18px;
}

.tx {
    display: flex;
    flex-direction: column;
}

b.voice-name {
    font-size: 16px;
    color: #00ad9e;
}
.voice_box {
    display: flex;
    background: aliceblue;
    padding: 20px;
    margin: 20px 0;
    border-radius: 10px;
    justify-content: space-between;
}


/* ぽこぽこ動くCTA */
.cta_poko {
    margin: 20px auto 30px;
}

.cta_poko img {
    filter: drop-shadow(0 5px 0 #aaa);
    animation: pekopeko 2s infinite;
    position: relative;
}

@keyframes pekopeko {
    0% {
        filter: drop-shadow(0 5px 0 #aaa);
        top: 0px;
    }

    10% {
        filter: drop-shadow(0 0 0 #aaa);
        top: 5px;
    }

    20% {
        filter: drop-shadow(0 5px 0 #aaa);
        top: 0px;
    }

    30% {
        filter: drop-shadow(0 0 0 #aaa);
        top: 5px;
    }

    40% {
        filter: drop-shadow(0 5px 0 #aaa);
        top: 0px;
    }
}
.midle_title{
    margin-top: 60px;
    position: relative;
    background: #ecf9ff;
    color: #1fade7;
    font-size: 20px;
    text-align: center;
    border-top: 5px solid #1fade7;
    font-size: 30px;
    padding: 10px 0;
    font-weight: bold;
    line-height: 1.3;
    margin-bottom: 10px;
}
/*オススメ*/
.recommend {
    background: #fffeed;
    padding: 5%;
    margin: 40px 0 0;
    border: 1px solid #0186c9;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    border-radius: 10px;
}


h6 {
    padding: 0.5em;
    /*文字周りの余白*/
    color: #474747;
    /*文字色*/
    background: #e2e2e2;
    /*背景色*/
    border-left: solid 5px #474747;
    /*左線（実線 太さ 色）*/
    font-weight: bold;
    font-size: large;
    margin-bottom: 10px;
    margin-top: 10%;
}

ul,
li {
    margin-bottom: 5px;
    list-style: none;
    margin-left: -6px;
}

.column_list ul li {
    margin-bottom: 5px;
    list-style: none;
    margin-left: -1.5em;
}


ul.points {
    border: 1px solid #eee;
    background: #f9f9f9;
    margin: 0px 0 10px;
    padding: 1em 1em 1em 2em;
    font-size: .9em;
}
footer {
    margin-top: 5%;
    background: #555555;
    color: #fff;
    text-align: center;
    padding: 30px;
    font-size: 13px;
    /* padding-bottom: 3%; */
    line-height: 1.1;
}
footer a {
    color: #fff !important;
}
.slider {
    position: absolute !important;
    width: 95%;
    bottom: 2.5%;
    margin: auto;
    right: 0;
    left: 0;
}