@charset "shift_jis";
/*
==================================================
テーブル共通
==================================================
*/
/*table{
width:100%;
font-size:13px;
margin:10px 0;
border-collapse: collapse;
}
th{
background-color:#EBEBEB;
padding:0;
}
td{
background-color:#FFFFFF;
padding:0;
}
table,td,th{
border:solid 1px #CCC;
overflow:hidden;
}*/
#menu .ritem td,#rmenu .ritem td{border:none;}
.rtitle {
height: 44px;
text-align: center;
overflow: hidden;
padding: 4px;
}
.rimg {
text-align: center;
}
.timg img{
max-width:200px;
height:auto;
}
.price {
color: #CC0000;
font-weight: bold;
}
.tdesc {
text-align: left;
vertical-align: top;
}
/*
==================================================
商品陳列型
==================================================
*/
.ritm{
background-color:#FFFFFF;
table-layout:fixed;
}
.ritm th,.ritm td{
padding:6px;
line-height: 120%;
vertical-align:top;
text-align: center;
}
/*
==================================================
特定取引法に関する表記
==================================================
*/
.tokusho {
}
.tokusho th, .tokusho td {
padding: 8px;
}
.tokusho th {
background-color: #E3E3E3;
width: 30%;
}
/*
==================================================
商品説明
==================================================
*/
.ritm_desc {
}
.ritm_desc td {
vertical-align: top;
padding: 10px;
}
.ritm_desc .title {
background-color: #EBEBEB;
padding: 5px;
margin-bottom: 8px;
text-align:left;
line-height:120%;
font-family: 'HGP創英角ｺﾞｼｯｸUB', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W6', sans-serif;
font-weight:normal;
}
.ritm_desc .title a{
color:#333;
}
.ritm_desc .title a:hover{
color:#FF0000;
}
.ritm_desc .desc{
padding:20px;
}
.ritm_desc .price {
text-align: left;
padding: 0px;
}
.ritm_desc .img {
width: 20%;
}
.ritm_desc .more, .ritm_desc .price, .ritm_desc .review {
line-height: 25px;
height: 25px;
margin-right: 5px;
margin-left: 5px;
}
/*
==================================================
ランキングテーブル１
==================================================
*/
table.rnk1item {
table-layout:auto;
}
.rnk1item td,.rnk1item th{
border:none;
border-bottom:dotted 1px #CCC;
}
.rnk1item th {
background-color: #FFF;
width: auto;
padding:5px;
vertical-align:middle;
}
.rnk1item td {
background-color: #FFFFFF;
vertical-align: top;
font-size: 12px;
line-height: 130%;
padding: 15px 10px;
}
.rnk1item .ttitle {
font-size: 18px;
font-weight: bold;
margin-bottom: 12px;
line-height: 130%;
}
.rnk1item th, .rnk1item td {
}
.rnk1item .timg {
width: auto;
padding-top: 10px;
vertical-align:middle;
}
.rnk1item .alt th, .rnk1item .alt td {
}
/*
==================================================
ランキングテーブル２
==================================================
*/
table.rnk2item {
table-layout:auto;
}
.rnk2item .timg, .rnk2item .tdesc {
padding: 8px;
vertical-align: top;
}
.rnk2item th.ttitle {
padding: 10px;
text-align: left;
font-size: 16px;
}
.rnk2item td.tdesc {
width:100%;
}
.rnk2item td.timg {
width:auto;
}
.rnk2item td.tdesc,.rnk2item td.timg {
border:none;
}
.rnk2item .timg img {
padding-bottom: 10px;
height:auto;
}
.rnk2item .tdesc {
line-height: 150%;
}
table.rnk2item table.ttable {
width:101%;
margin: 0px;
padding: 0px;
border:none;
}
.ttable th, .ttable td {
padding: 8px;
line-height:130%;
text-align: center;
border:none;
border-right:dotted 1px #CCC;
}
/*
==================================================
ランキングテーブル３
==================================================
*/
.rnk3item {
table-layout:auto;
}
.rnk3item th {
text-align: left;
padding: 8px;
font-size: 17px;
}
.rnk3item th img {
vertical-align: bottom;
margin-right: 6px;
}
.rnk3item td {
padding: 10px;
border:none;
}
.rnk3item td.timg {
text-align: center;
width: auto;
}
/*
==================================================
価格比較テーブル
==================================================
*/
.prc1item {
table-layout:auto;
}
.prc1item th {
padding: 6px;
text-align: center;
}
.prc1item td {
text-align: center;
padding: 6px;
}
.prc1item td {
text-align: center;
padding: 6px;
}
.prc1item .alt td {
background-color: #F5F5F5;
}
.prc1item .price {
text-align: right;
width: 100px;
font-size:15px;
}
/*
==================================================
項目説明型
==================================================
*/
.dsc1item,.dsc2item {
background-color: #CCCCCC;
table-layout:fixed;
}
.dsc1item th, .dsc1item td,.dsc2item th, .dsc2item td {
padding: 6px;
}
.dsc1item th{
width:30%;
}
.dsc1item th , .dsc2item th {
text-align: center;
}
.dsc1item td , .dsc2item td {
vertical-align: top;
}
/*
==================================================
メニュー型
==================================================
*/
.tblmenu1item td {
font-size: 12px;
line-height: 130%;
vertical-align:top;
border:none;
}
.tblmenu1item td .ttitle {
background-color: #EEEEEE;
font-weight: bolder;
padding: 7px;
margin-bottom: 8px;
font-size: 13px;
}
/*
==================================================
スマホサイト用スタイル
==================================================
*/
/* 共通 */
table{
line-height:140%;
}
.timg{
vertical-align:top;
}
.timg img{
max-width:80px;
height:auto;
}
table .txt-img img{
margin:8px 0;
max-width:70px;
height:auto;
}
/* ランキングテーブル1 */
.rnk1item .ttitle{
font-size:15px;
}
.rnk1item th{
display:none;
}
:root {
    box-sizing: border-box;
    word-wrap: break-word;
}
* , ::before, ::after {
    box-sizing: inherit;
    word-wrap: inherit;
}
html {
-webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: auto;
/*WindowsはメイリオでMacはヒラギノ*/
font-family: -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */
'Helvetica Neue',            /* Macの欧文 (OS X 10.10以前) */
'Segoe UI',                  /* Windowsの欧文 */
'Hiragino Kaku Gothic ProN', /* Macのヒラギノ */
Meiryo,                      /* Windowsのメイリオ */
sans-serif;
}
sub,sup {
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}
div,p,h1,h2,h3,h4,h5,h6 {
display:block;
margin:0;
/*overflow:hidden;*/
padding:0;
/*text-align:left;*/
}
/*h1,h2,h3,h4,h5,h6,.title {
text-shadow:0 1px 1px #CCC;
}*/
a {
color:#0000ff;
}
a:hover {
color: #F30;
}
a:active,a:focus {
outline:0;
}
img {
border:0;
/*max-width:100%;*/
}
.clear {
clear:both;
font-size:1px;
}
/*
==================================================
初期設定
==================================================
*/
:focus {
outline: 0;
}
input,button,textarea,select {
font-size: 100%;
}
/*input[type="checkbox"],input[type="radio"] {
vertical-align: middle;
}*/
textarea {
overflow: auto;
}
.txt-img {
padding-bottom:5px;
padding-left:5px;
padding-right:5px;
}
.center {
/*margin-bottom:5px;
margin-top:5px;*/
text-align:center;
}
.fl_imgl {
float:left;
}
.fl_imgr {
float:right;
}
.ctr_img {
text-align: center;
}
.fl_imgl img {
margin-bottom:15px;
margin-right:15px;
}
.fl_imgr img {
margin-bottom:15px;
margin-left:15px;
}
.ctr_img img {
margin: 1em 0;
}
/*[class^="fl_img"] img,*/
.fl_imgl img,.fl_imgr img,.ctr_img img {
padding: 4px;
background-color: #fff;
border: 1px solid #ddd;
}
.clear,.FloatEnd {
clear:both;
}
/*
========== ブラウザデフォルトリスト ==========
*/
ol {
list-style: decimal none outside;/* 一括指定（list-style-type/image/position） */
padding: 0 0.5em 0 2em;
margin: 0 0 20px 1em;
}
ul {
list-style: disc none outside;/* 一括指定（list-style-type/image/position） */
padding: 0 0.5em 0 2em;
margin: 0 0 20px 0;
}
ol li,ul li {
margin: 0 0 0.5em 0;
line-height: 1.5;
}
/*オリジナルのリスト見出しを使用する場合は以下の設定を消去して、新たに設定する*/
/*html>/**//*body ul li {
list-style: none;
list-style-image: url(img/li.gif);
}*/
ul {
list-style: none;
margin: 0 0 20px 1em;
padding: 0;
}
ul li {
background: url(img/li.gif) left 0.60em no-repeat;
line-height: 1.5;
padding: 2px 0 0 16px;
margin: 4px 0 3px 0;
}
/*
==================================================
全体構造
==================================================
*/
body {
margin: 0;
padding: 0;
font-size: 16px;
color: #111;
background: #fff;
}
img {
vertical-align: middle;/* 垂直型リストで画像を並べた時の隙間を消す方法、IEでimgの下に隙間を持つ（inline解釈）問題対策 */
max-width :100%; /* フルードイメージへの対応 */
height: auto;
}
p,a {
word-wrap: break-word;
}
/*
==================================================
コンテンツ
==================================================
*/
/*
========== レイアウト ==========
*/
#contents {
padding: 15px 4% 0 4%;
margin: 0 auto;
background-color: #fff;
}
#col_subarea {
margin-bottom: 40px;
}
/*
========== clearfix ==========
*/
#sec_whatsnew li:after {
content: '';
display: block;
clear: both;
}
/*
========== セクション・段落 ==========
*/
#imgtop {
margin-bottom: 20px;
}
.text,.space {
margin: 0 0 40px 0;
}
#col_mainarea h1 {
background-color: #FAF7EE;
border-top: 1px solid #DCC291;
border-right: 1px solid #DCC291;
border-left: 1px solid #DCC291;
position: relative;
padding: 8px 5px 10px 25px;
line-height: 1.3;
font-size: 20px;
margin: 0 0 20px 0;
text-align:  left;
}
#col_mainarea h1:before {
content:"";
display: block;
background: url(img/bg-h2.png) no-repeat;
height: 22px;
width: 20px;
position: absolute;
left: 2px;
top: 50%;
margin-top: -11px;
}
#col_mainarea h1:after {
content:"";
display: block;
height: 5px;
width: 100%;
background-color: #DB9B00;
border: 1px solid #996500;
position: absolute;
bottom: 0;
left: 0;
box-sizing: border-box;
}
#col_mainarea h2,
#space1 h2,#space2 h2,#space3 h2,#space4 h2,#space5 h2,#space6 h2{
background-color: #FAF7EE;
border: 1px solid #DCC291;
border-left: 4px solid #744E02;
padding: 10px 8px 8px 8px;
line-height: 1.3;
font-size: 20px;
margin: 0 0 20px 0;
text-align: left;
}
#col_mainarea .text h2{
background-color: #FAF7EE;
border: 1px solid #DCC291;
border-left: 4px solid #744E02;
padding: 10px 8px 8px 8px;
line-height: 1.3;
font-size: 20px;
margin: 25px 0 20px 0;
text-align: left;
}
#col_mainarea h3,.h3other,
#space1 h3,#space2 h3,#space3 h3,#space4 h3,#space5 h3,#space6 h3{
    border-bottom: 4px solid #895B02;
    margin: 0 0 20px 0;
    padding: 4px 0 2px 12px;
    line-height: 1.4;
    font-size: 20px;
    clear: both;
    position: relative;
    font-weight: bold;
text-align:  left;
}
#col_mainarea .text h3,.text .h3other {
    border-bottom: 4px solid #895B02;
    margin: 25px 0 20px 0;
    padding: 4px 0 2px 12px;
    line-height: 1.4;
    font-size: 20px;
    clear: both;
    position: relative;
    font-weight: bold;
}
#col_mainarea h3:before,.h3other:before {
    content:"";
    display: block;
    position: absolute;
    left: 0;
    top: 8%;
    margin-top: 0;
    width: 5px;
    height: 95%;
    background-color: #895B02;
}
#col_mainarea h4,
#space1 h4,#space2 h4,#space3 h4,#space4 h4,#space5 h4,#space6 h4{
border-left: 5px solid #895B02;
padding: 0 0 0 6px;
font-size: 20px;
line-height: 1.4;
margin: 25px 0 15px 0;
clear: both;
text-align: left;
}
#col_mainarea h5,
#space1 h5,#space2 h5,#space3 h5,#space4 h5,#space5 h5,#space6 h5{
background: url(img/h5.gif) left center no-repeat;
font-size: 17px;
line-height: 1.4;
padding: 2px 0 2px 30px;
margin: 0 0 5px 0;
text-align: left;
}
#col_mainarea h6,
#space1 h5,#space2 h6,#space3 h6,#space4 h6,#space5 h6,#space6 h6,
.text .reference {
background: url(img/h6.gif) left center no-repeat;
font-size: 18px;
line-height: 1.4;
padding: 1px 0 1px 28px;
margin: 0 0 20px 0;
clear: both;
text-align: left;
font-weight: bold;
}
.text p,.space p,
[id^="space"],[id^="space"] p{
line-height: 1.8;
margin: 0 0 1em 0;
}
[class^="fl_img"] + p {
margin-top: -0.25em;
}
.text .more,.gl_txt .more {
text-align: right;
font-size: 17px;
font-weight: bold;
}
.text .more a,.gl_txt .more a {
background: url(img/h6.gif) left center no-repeat;
padding: 1px 0 1px 28px;
display: inline-block;
}
.text .pubdate {
text-align: right;
margin: -1.4em 0 0 0;
font-size: 12px;
}
#contents table p {
    margin: 0;
}
#space1 {
margin: 40px 0 40px 0;
}
#space2 {
margin: 40px 0 40px 0;
}
/*
========== 赤太文字・赤文字下線 ==========
*/
.redbold {
color: #f00;
font-weight: bold;
}
.redunder {
color: #f00;
text-decoration: underline;
}
.bluebold {
color: #03B8F3;
font-weight: bold;
}
.greenbold {
color: #66BF02;
font-weight: bold;
}
.orangebold {
color: #FF814E;
font-weight: bold;
}
.fl-img,.fr-img {
float: none;
margin: 0;
text-align: center;
display: block;
}
/*
========== 注釈・強調 ==========
*/
/*
========== 注釈・強調 ==========
*/
/*警告*/
.alert {
position: relative;
background-color: rgba(246,131,116,0.05);
border: 1px solid #d90000;
border-radius: 4px;
padding: 1em 1em 1em 1em;
position:relative;
margin: 2em 0 1.5em 0;
line-height: 1.8;
}
/*.alert:before {
content: "";
    position: absolute;
    left: 50%;
    top: -20px;
margin-left: -20px;
background: url(img/bg-alert.png) no-repeat;
background-size: 40px auto;
width: 40px;
height: 40px;
}*/
/*承認*/
.accept,.caution {
position: relative;
background-color: rgba(189,219,238,0.05);
border: 1px solid #B6D3E7;
border-radius: 4px;
padding: 1em 1em 1em 1em;
position:relative;
margin: 1.5em 0;
line-height: 1.8;
}
/*注意*/
.attention,.checkpoint {
position: relative;
background-color: rgba(230,193,65,0.05);
border: 1px solid #E6C141;
border-radius: 4px;
padding: 1em 1em 1em 1em;
position:relative;
margin: 2em 0 1.5em 0;
line-height: 1.8;
}
/*.attention::before,*/
.checkpoint::before {
content: "";
    position: absolute;
    left: 50%;
    top: -20px;
margin-left: -18px;
background: url(img/bg-attention.png) no-repeat;
background-size: 40px auto;
width: 40px;
height: 36px;
}
/*注釈*/
.thint {
position: relative;
background-color: rgba(153,204,0,0.05);
border: 1px solid #99CC00;
border-radius: 4px;
padding: 1em 1em 1em 1em;
position:relative;
margin: 1.5em 0;
line-height: 1.8;
}
/*.thint:before {
content: "";
    position: absolute;
    left: 50%;
    top: -20px;
margin-left: -20px;
background: url(img/bg-thint.png) no-repeat;
background-size: 40px auto;
width: 40px;
height: 40px;
}*/
/* 引用 */
blockquote {
margin: 25px auto;
padding: 10px 15px 10px 15px;
border: 1px solid #DCC291;
line-height: 1.7;
position: relative;
background-color: #FAF7EE;
word-wrap: break-word;
}
blockquote:before {
content:"";
display: block;
background: url(img/bg-blockquote.png) no-repeat;
background-size: 18px auto;
height: 28px;
width: 37px;
position: absolute;
left: 50%;
top: -10px;
margin-left: -9px;
}
.caution p,.checkpoint p,.blockquote p {
line-height: 1.7;
font-size: 14px;
}
/*example*/
.example {
position: relative;
background-color: #FFFDF9;
border: 1px solid #E7D59E;
border-radius: 4px;
padding: 1em 1em 1em 1em;
position:relative;
margin: 1.5em 0;
line-height: 1.8;
}
/*この記事のまとめ*/
.matome {
    position: relative;
background-color: #FFFDF9;
border: 3px solid #E7D59E;
border-radius: 4px;
padding: 2em 1.5em 1.5em 1.5em;
position:relative;
margin: 2.6em 0 2em 0;
line-height: 1.8;
}
.matome:before {
    content: "";
display: block;
width: 240px;
height: 32px;
background: url(img/bg-matome.png) no-repeat 10px top;
background-size: 220px auto;
position: absolute;
left: 50%;
top: -16px;
margin: 0 0 0 -120px;
z-index: 2;
}
.matome:after {
    content: "";
display: block;
width: 240px;
height: 3px;
background: #fff;
position: absolute;
left: 50%;
top: -3px;
margin: 0 0 0 -120px;
}
/*ここがポイント！*/
.important {
    position: relative;
background-color: rgba(202,64,53,0.03);
border: 3px solid #CA4035;
border-radius: 4px;
padding: 2em 1.5em 1.5em 1.5em;
position:relative;
margin: 3em 0 2em 0;
line-height: 1.8;
}
.important:before {
    content: "";
display: block;
width: 210px;
height: 34px;
background: url(img/bg-important.png) no-repeat 10px top;
background-size: 190px auto;
position: absolute;
left: 50%;
top: -17px;
margin: 0 0 0 -105px;
z-index: 2;
}
.important:after {
    content: "";
display: block;
width: 210px;
height: 3px;
background: #fff;
position: absolute;
left: 50%;
top: -3px;
margin: 0 0 0 -105px;
}
.text blockquote p,
.alert p,
.accept p,.caution p,.example p,.matome p,.important p,
.attention p,.checkpoint p,
.thint p {
    margin-bottom: 1em;
line-height: 1.8;
}
.text blockquote :last-child,
.alert :last-child,
.accept :last-child,.caution :last-child,.example :last-child,.matome :last-child,.important :last-child,
.attention :last-child,.checkpoint :last-child,
.thint :last-child {
margin-bottom: 0;
}
.source {
font-size: 11px;
color: #777;
margin: 10px 0;
line-height: 1.5;
}
.source p {
line-height: 1.5;
margin-bottom: 1em;
}
/*
========== 新着情報・更新履歴 ==========
*/
#sec_whatsnew {
margin: 0 0 40px 0;
}
#sec_whatsnew h2 {
background-color: #FAF7EE;
border: 1px solid #DCC291;
border-left: 4px solid #744E02;
padding: 10px 8px 8px 8px;
line-height: 1.3;
font-size: 20px;
margin: 0 0 10px 0;
text-align: left;
}
#sec_whatsnew ul {
padding: 0 5px;
margin: 0;
word-wrap: break-word;
}
#sec_whatsnew li {/*clearfix*/
list-style-image: none;
list-style-type: none;
background: none;
margin: 0 0 0.5em 0;
line-height: 1.8;
padding: 0 0 0.5em 0;
border-bottom: 1px dotted #cccccc;
}
#sec_whatsnew li span {
margin: 0 0 0 0;
float: none;
display: block;
}
/*
========== サイトマップ ==========
*/
#sitemaps {
margin-bottom: 40px;
padding: 0 0;
}
#sitemaps ul {
margin: 0 0 20px 0;
padding: 0;
}
#sitemaps li {
list-style-image: none;
list-style-type: none;
background: none;
margin: 0 0 10px 0;
padding: 0;
}
#sitemaps li a {
display: inline-block;
position: relative;
padding-left: 12px;
line-height: 1.5;
text-decoration: none;
}
#sitemaps li a::before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0.55em;
width: 0;
height: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
border-top: 6px solid #6FA041;
border-left: 6px solid transparent;
}
#sitemaps .l1 a {
background: url(img/h5.gif) 0 0.2em no-repeat;
padding: 2px 0 2px 30px;
display: inline-block;
line-height: 1.5;
font-size: 20px;
font-weight: bold;
}
#sitemaps .l1 a::before {
display: none;
}
#sitemaps .l1 {
margin-top: 2em;
}
#sitemaps .l2 {
margin-left: 15px;
}
#sitemaps .l3 {
margin-left: 30px;
}
/*
========== 検索結果 ==========
*/
#searchresult {
margin-bottom: 0px;
padding: 0px;
}
#searchresult dl {
margin: 0;
padding: 0;
}
#searchresult dt {
    border-bottom: 4px solid #895B02;
    margin: 20px 0 20px 0;
    padding: 4px 0 2px 12px;
    line-height: 1.4;
    font-size: 18px;
    clear: both;
    position: relative;
    font-weight: bold;
}
#searchresult dt:before {
    content:"";
    display: block;
    position: absolute;
    left: 0;
    top: 8%;
    margin-top: 0;
    width: 5px;
    height: 93%;
    background-color: #895B02;
}
#searchresult dt a {
    display: inline-block;
    text-decoration: none;
}
#searchresult dd {
margin: 0 0 25px 10px;
padding: 0;
line-height: 1.7;
}
/*
========== エントリーリスト ==========
*/
#entrylist {
margin: 40px 0;
padding: 0;
}
#entrylist dl {
margin: 0 10px;
padding: 0;
line-height: 1.5;
}
#entrylist dt {
margin: 0 0 10px 0;
padding: 0;
}
#entrylist dt a {
display: inline-block;
position: relative;
padding-left: 12px;
line-height: 1.5;
text-decoration: none;
font-size: 16px;
}
#entrylist dt a::before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0.55em;
width: 0;
height: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
border-top: 6px solid #6FA041;
border-left: 6px solid transparent;
}
#entrylist dd {
margin: 0 0 10px 15px;
padding: 0;
}
#entrylist h3 {
    border-bottom: 4px solid #895B02;
    margin: 0 0 18px 0;
    padding: 4px 0 2px 12px;
    line-height: 1.4;
    font-size: 18px;
    clear: both;
    position: relative;
    font-weight: bold;
}
#entrylist h3:before {
    content:"";
    display: block;
    position: absolute;
    left: 0;
    top: 8%;
    margin-top: 0;
    width: 5px;
    height: 93%;
    background-color: #895B02;
}
/*
========== general_layout ==========
*/
.general_layout_lt,
.general_layout_rt {
overflow: hidden;/* clearfix代替 */
}
.general_layout_lt .gl_img {
float: left;
margin: 0 10px 10px 0;
/*width: 20%;*/
}
.general_layout_rt .gl_img {
float: right;
margin: 0 0 10px 10px;
/*width: 20%;*/
}
.general_layout_lt .gl_img img,
.general_layout_rt .gl_img img {
width: auto;
height: auto;
}
.general_layout_lt .gl_txt,
.general_layout_rt .gl_txt {
overflow: hidden;/* テキスト部分の回り込み防止 */
}
/* 必要に応じた部分の上書き設定 */
.gl_img img {
/*border: 1px solid #dddddd;*/
}
.gl_img img.bn {
border: none;
}
td .general_layout_rt .gl_img {
margin-bottom: 0;
}
.gl_img .caption {/* キャプション（折り返してくれないので改行対策か、幅指定の汎用決め打ちが必要）→以下の方法で解決 */
display: block;
margin-top: 0.5em;
font-size: 77%;
text-align: left;/* キャプションの幅を画像の幅に合わせる方法で画像を中央寄せにしたから */
}
.gl_img {/* キャプションの幅を画像の幅に合わせる方法（画像がなくNoImage画像の処理をしない場合、幅の分スペースができてしまう） */
/*display: table;/* 親要素内にまとめながら、画像が2つ以上になる場合に必要 */
/*min-width: 120px;/* minimum width */
/*text-align: center;*/
}/* RWDの場合、FF/IEで親がdisplay: table-*;の時、子のimg {max-width: 100%; }が効かないので削除（事実上必要なし） */
/* カテゴリーリスト */
.gl_img p {
margin: 0 0 10px 0;
}
.gl_txt p {
line-height: 1.7;
margin: 0;
}
#sec_categorylist {
margin-bottom: 40px;
}
#sec_categorylist .general_layout_lt {
margin-bottom: 20px;
}
/*
========== 汎用カラーボタンデザイン ==========
*/
.area_btn {
text-align: center;
}
.button {
position: relative;
display: inline-block;
padding: 10px 20px;
text-align: center;
text-shadow: 0 -1px rgba(0, 0, 0, 0.4);
background-clip: padding-box;
border: 1px solid;
border-radius: 2px;
cursor: pointer;
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 1px 2px rgba(0, 0, 0, 0.25);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 1px 2px rgba(0, 0, 0, 0.25);
font-weight: bold;
color: #fff;
}
.button:before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
pointer-events: none;
background-image: -webkit-radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
background-image: -moz-radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
background-image: -o-radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
background-image: radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
}
.button:hover:before {
background-image: -webkit-radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
background-image: -moz-radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
background-image: -o-radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
background-image: radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
}
.button:active {
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}
.button:active:before {
content: none;
}
a.button {/* グローバルリンク設定の上書き */
color: #fff;
text-decoration: none;
}
.button-green {
border-color: #478228 #478228 #3c6f22;
background: #5ca934;
background-image: -webkit-gradient(linear, left top, left bottom, from(#69c03b), color-stop(0.66, #5ca934), to(#54992f));
background-image: -webkit-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: -moz-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: -ms-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: -o-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: linear-gradient(to bottom, #69c03b, #5ca934 66%, #54992f);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#69c03b', endColorstr='#54992f', GradientType=0);
}
.button-green:active {
background: #5ca934;
border-color: #3c6f22 #478228 #478228;
}
.button-red {
border-color: #ae3623 #ae3623 #992f1f;
background: #d5452f;
background-image: -webkit-gradient(linear, left top, left bottom, from(#da5c48), color-stop(0.66, #d5452f), to(#c73d28));
background-image: -webkit-linear-gradient(top, #da5c48, #d5452f 66%, #c73d28);
background-image: -moz-linear-gradient(top, #da5c48, #d5452f 66%, #c73d28);
background-image: -ms-linear-gradient(top, #da5c48, #d5452f 66%, #c73d28);
background-image: -o-linear-gradient(top, #da5c48, #d5452f 66%, #c73d28);
background-image: linear-gradient(to bottom, #da5c48, #d5452f 66%, #c73d28);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#da5c48', endColorstr='#c73d28', GradientType=0);
}
.button-red:active {
background: #d5452f;
border-color: #992f1f #ae3623 #ae3623;
}
.button-blue {
border-color: #0d78b6 #0d78b6 #0b689e;
background: #1097e6;
background-image: -webkit-gradient(linear, left top, left bottom, from(#25a5f0), color-stop(0.66, #1097e6), to(#0f8ad3));
background-image: -webkit-linear-gradient(top, #25a5f0, #1097e6 66%, #0f8ad3);
background-image: -moz-linear-gradient(top, #25a5f0, #1097e6 66%, #0f8ad3);
background-image: -ms-linear-gradient(top, #25a5f0, #1097e6 66%, #0f8ad3);
background-image: -o-linear-gradient(top, #25a5f0, #1097e6 66%, #0f8ad3);
background-image: linear-gradient(to bottom, #25a5f0, #1097e6 66%, #0f8ad3);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#25a5f0', endColorstr='#0f8ad3', GradientType=0);
}
.button-blue:active {
background: #1097e6;
border-color: #0b689e #0d78b6 #0d78b6;
}
.button-orange {
border-color: #df770c #df770c #c76a0a;
background: #f4902a;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f69f47), color-stop(0.66, #f4902a), to(#f38617));
background-image: -webkit-linear-gradient(top, #f69f47, #f4902a 66%, #f38617);
background-image: -moz-linear-gradient(top, #f69f47, #f4902a 66%, #f38617);
background-image: -ms-linear-gradient(top, #f69f47, #f4902a 66%, #f38617);
background-image: -o-linear-gradient(top, #f69f47, #f4902a 66%, #f38617);
background-image: linear-gradient(to bottom, #f69f47, #f4902a 66%, #f38617);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f69f47', endColorstr='#f38617', GradientType=0);
}
.button-orange:active {
background: #f4902a;
border-color: #c76a0a #df770c #df770c;
}
.button-pink {
border-color: #d31865 #d31865 #bc165a;
background: #e8367f;
background-image: -webkit-gradient(linear, left top, left bottom, from(#eb5190), color-stop(0.66, #e8367f), to(#e62473));
background-image: -webkit-linear-gradient(top, #eb5190, #e8367f 66%, #e62473);
background-image: -moz-linear-gradient(top, #eb5190, #e8367f 66%, #e62473);
background-image: -ms-linear-gradient(top, #eb5190, #e8367f 66%, #e62473);
background-image: -o-linear-gradient(top, #eb5190, #e8367f 66%, #e62473);
background-image: linear-gradient(to bottom, #eb5190, #e8367f 66%, #e62473);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eb5190', endColorstr='#e62473', GradientType=0);
}
.button-pink:active {
background: #e8367f;
border-color: #bc165a #d31865 #d31865;
}
.button-gray {
border-color: #2f3034 #2f3034 #232427;
background: #47494f;
background-image: -webkit-gradient(linear, left top, left bottom, from(#55585f), color-stop(0.66, #47494f), to(#3d3f44));
background-image: -webkit-linear-gradient(top, #55585f, #47494f 66%, #3d3f44);
background-image: -moz-linear-gradient(top, #55585f, #47494f 66%, #3d3f44);
background-image: -ms-linear-gradient(top, #55585f, #47494f 66%, #3d3f44);
background-image: -o-linear-gradient(top, #55585f, #47494f 66%, #3d3f44);
background-image: linear-gradient(to bottom, #55585f, #47494f 66%, #3d3f44);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#55585f', endColorstr='#3d3f44', GradientType=0);
}
.button-gray:active {
background: #47494f;
border-color: #232427 #2f3034 #2f3034;
}
.button-darkblue {
border-color: #2d477b #2d477b #263c68;
background: #3b5ca0;
background-image: -webkit-gradient(linear, left top, left bottom, from(#4369b6), color-stop(0.66, #3b5ca0), to(#365391));
background-image: -webkit-linear-gradient(top, #4369b6, #3b5ca0 66%, #365391);
background-image: -moz-linear-gradient(top, #4369b6, #3b5ca0 66%, #365391);
background-image: -ms-linear-gradient(top, #4369b6, #3b5ca0 66%, #365391);
background-image: -o-linear-gradient(top, #4369b6, #3b5ca0 66%, #365391);
background-image: linear-gradient(to bottom, #4369b6, #3b5ca0 66%, #365391);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4369b6', endColorstr='#365391', GradientType=0);
}
.button-darkblue:active {
background: #3b5ca0;
border-color: #263c68 #2d477b #2d477b;
}
.button-purple {
border-color: #8040be #8040be #733aab;
background: #9966cb;
background-image: -webkit-gradient(linear, left top, left bottom, from(#a87dd3), color-stop(0.66, #9966cb), to(#8f57c6));
background-image: -webkit-linear-gradient(top, #a87dd3, #9966cb 66%, #8f57c6);
background-image: -moz-linear-gradient(top, #a87dd3, #9966cb 66%, #8f57c6);
background-image: -ms-linear-gradient(top, #a87dd3, #9966cb 66%, #8f57c6);
background-image: -o-linear-gradient(top, #a87dd3, #9966cb 66%, #8f57c6);
background-image: linear-gradient(to bottom, #a87dd3, #9966cb 66%, #8f57c6);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a87dd3', endColorstr='#8f57c6', GradientType=0);
}
.button-purple:active {
background: #9966cb;
border-color: #733aab #8040be #8040be;
}
/*ピックアップランキング*/
.picup-ranking {
margin: 40px auto 40px;
}
#col_mainarea .picup-ranking h2 {
margin-bottom: 10px;
}
.pr-mod {
margin: 0 0 20px 0;
}
#col_mainarea .picup-ranking h3 {
border-bottom: 2px solid #624202;
margin: 0 0 15px 0;
padding: 12px 0 12px 70px;
line-height: 1.4;
font-size: 24px;
}
#col_mainarea .picup-ranking h3:before,
#col_mainarea .picup-ranking h3:after {
display: none;
}
.picup-ranking p {
line-height: 1.8;
margin: 0 0 1em 0;
}
.picup-ranking .pr-img {
text-align: center;
width: 300px;
height: auto;
margin-right: auto;
margin-left: auto;
/*border: 1px solid #ccc;*/
}
.pr-btn .button {
display: block;
padding: 5px 0;
font-size: 24px;
margin: 0 auto;
width: 90%;
border-radius: 2em;
}
.pr-rank1 {
background: url(img/bg-rank1.png) left center no-repeat;
background-size: 60px auto;
}
.pr-rank2 {
background: url(img/bg-rank2.png) left center no-repeat;
background-size: 60px auto;
}
.pr-rank3 {
background: url(img/bg-rank3.png) left center no-repeat;
background-size: 60px auto;
}
/*
==================================================
ヘッダー
==================================================
*/
#header {
background-color: #FAF7EE;
border-top: 3px solid #624202;
border-bottom: 3px solid #624202;
}
#header p {
padding: 15px 10px;
line-height: 1.5;
text-align: center;
font-size: 26px;
}
#header p a {
color: #333333;
text-decoration: none;
}
#header #logo {
padding: 10px;
text-align: center;
}
#header #logo img {
width: 70%;
max-width: 320px;
}
/*
========== パンくずリスト ==========
*/
#siteNavi {
line-height: 1;
font-size: 12px;
margin: 0 -4% 10px -4%;
border-bottom: 1px solid #ccc;
padding: 0 10px 10px;
line-height: 1.5;
}
#siteNavi a {
color:  inherit;
text-decoration: none;
padding: 2px 0;
display: inline-block;
}
#siteNavi span:first-of-type a {
background: url(img/bg-ico-home.svg) left center no-repeat;
background-size: 16px auto;
padding-left: 20px;
}
/*
========== ヘッドバー ==========
*/
#headbar {
width: 100%;
background-color: #fff;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
position: absolute;
left: 0;
top: -100px;
z-index: 10;
-webkit-transition: all 0.5s ease-in;
transition: all 0.5s ease-in;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
padding: 0 10px;
height: 54px;
}
#headbar.is-fixed {
position: fixed;
top: 0;
background-color: rgba(255,255,255,.9);
border-bottom: 1px solid #ccc;
}
.hb-logo img {
width: 180px;
}
.hb-search {
margin: 0 10px 0 auto;
}
.hb-search img {
width: 24px;
}
.hb-menu a {
padding: 5px;
display: inline-block;
padding: 6px 6px 6px 6px;
border-radius: 4px;
background-color: #744E02;
color: #fff;
font-weight: 700;
text-decoration: none;
line-height: 1;
font-size: 14px;
}
/*#hb-menu::before {
content: " ";
    margin-top: -60px;
    height: 60px;
    display: block;
    visibility: hidden;
}*/
#hb-menu {
margin: 40px 0 20px 0;
}
#hb-menu span {
position: relative;
font-size: 1.2em;
font-weight: bold;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
#hb-menu span:before,
#hb-menu span:after {
content: '';
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
height: 3px;
background: #AA0002;
min-width: 10px;
}
#hb-menu span:before {
    margin-right: 0.5em;
}
#hb-menu span:after {
    margin-left: 0.5em;
}
#hb-menu em {
font-style: normal;
background-color: #744E02;
color: #fff;
padding: 0.3em 0.1em 0.3em 0.6em;
line-height: 1;
border-radius: 4px;
letter-spacing: 0.5em;
}
/*
==================================================
サイドバー
==================================================
*/
[class^="gad-side"] {
margin: 0 0 20px 0;
text-align: center;
}
[class^="gad-side"] a img {
vertical-align: middle;
}
[class^="gad-side"] a {
position: relative;
display: block;
}
.menubox ul {
margin: 0;
padding: 0;
}
.menubox li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
.menubox li::before {
display: none;
}
.menubox li img {
vertical-align: top;
}
/*
========== サイドバー展開版とメニュー見出し版の共存 ==========
*/
.cgybox,.menubox {
margin: 0 0 15px 0;
}
.cgybox h2 {
color: #111;
font-size: 20px;
line-height: 1.4;
}
#col_subarea h2,#col_subarea h4 {
color: #fff;
font-size: 20px;
padding: 12px 0 9px 0;
line-height: 1.4;
background-color: #744E02;
text-align: center;
}
.cgybox h2 a {
text-decoration: none;
color: #fff;
padding: 12px 0 9px 0;
display: block;
margin: -12px 0 -9px 0;
background-color: #744E02;
}
.cgybox h2 a:hover {
color: #FF0;
}
#col_subarea h4 {
margin-bottom: 15px;
}
#col_subarea #space4 h2 {
margin-bottom: 0;
}
.cgybox ul,.menubox ul {
margin: 0;
padding: 15px 12px 5px 12px;
background-color: #FFFDF8;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-left: 1px solid #ccc;
}
.cgybox li,.menubox li {
margin: 0 0 10px 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
.cgybox li a,.menubox li a {
display: inline-block;
position: relative;
padding: 2px 10px 3px 12px;
font-size: 15px;
line-height: 1.5;
text-decoration: none;
}
.cgybox li a::before,.menubox li a::before,
.cgybox .golist a::before,.cgybox p a::before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0.75em;
width: 0;
height: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
border-top: 6px solid #6FA041;
border-left: 6px solid transparent;
}
.cgybox li a:hover,.menubox li a:hover,
.cgybox li .cur,.menubox li .cur {
background: #744E02;
border-radius: 3px;
color: #fff;
}
.cgybox li a:hover::before,.menubox li a:hover::before {
border-top: 6px solid #744E02;
}
.cgybox .golist {
text-align: right;
margin-top: 12px;
}
.cgybox .golist a {
display: inline;
width: auto;
position: relative;
}
.cgybox .golist a::before {
top: 0.5em;
}
.cgybox p {
text-align: right;
margin-top: 10px;
}
.cgybox p a {
position: relative;
padding-left: 12px;
display: inline-block;
font-size: 18px;
line-height: 1;
text-decoration: none;
font-weight:bold;
}
.cgybox p a::before {
top: 0.35em;
}
/*
========== ピックアップメニュー ==========
*/
.nav-pickup {
margin: 20px 0;
}
#col_subarea .nav-pickup h2 {
background-color: #FAF7EE;
border: 1px solid #DCC291;
border-top: none;
padding: 15px 8px 10px 8px;
line-height: 1.3;
font-size: 22px;
margin: 0;
text-align: left;
color: #333;
text-align: center;
position: relative;
}
#col_subarea .nav-pickup h2:after {
content:"";
display: block;
height: 6px;
width: 100%;
background-color: #DB9B00;
border: 1px solid #996500;
position: absolute;
top: 0;
left: 0;
box-sizing: border-box;
}
.nav-pickup ul {
background-color: #FDEBD7;
margin: 0;
padding: 10px;
border: none;
}
.nav-pickup li {
margin: 0;
}
.nav-pickup li:first-child {
border-top: 1px solid #D3CDC1;
}
.nav-pickup li a {
padding: 12px 5px 12px 30px;
display: block;
font-size: 16px;
line-height: 1.5;
text-decoration: none;
border-right: 1px solid #D3CDC1;
border-bottom: 1px solid #D3CDC1;
border-left: 1px solid #D3CDC1;
position: relative;
background-color: #fff;
}
.nav-pickup li a:hover {
border-radius: 0;
}
.nav-pickup li a:after {
content: "";
    display: block;
    position: absolute;
    left: 14px;
    top: 50%;
    margin-top: -2px;
    width: 0;
    height: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    border-top: 4px solid #fff;
    border-left: 4px solid transparent;
    
border-right: none;
}
.nav-pickup li a:before {
content: "";
    display: block;
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -7px;
    width: 14px;
    height: 14px;
background-color: #5AA100;
border-radius: 50%;
}
.nav-pickup li a:hover::before {
border: none;
background-color: #fff;
}
.nav-pickup li a:hover::after {
border-top: 4px solid #5AA100;
}
/*
========== よく読まれている記事 ==========
*/
.nav-popular {
margin-bottom: 2em;
}
#col_mainarea .nav-popular {
margin: 2em 0;
}
#col_mainarea .nav-popular h2,#col_mainarea .nav-popular h3,
#col_subarea .nav-popular h2,#col_subarea .nav-popular h3 {
background: none;
border: none;
border-radius: 0;
text-shadow: none;
box-shadow: none;
margin: 0;
padding: 0;
text-align: left;
position: static;
}
#col_mainarea .nav-popular h2::before,#col_mainarea .nav-popular h3::before,
#col_subarea .nav-popular h2::before,#col_subarea .nav-popular h3::before,
#col_mainarea .nav-popular h2::after,#col_mainarea .nav-popular h3::after,
#col_subarea .nav-popular h2::after,#col_subarea .nav-popular h3::after {
display: inline;
content: normal;
margin: 0;
padding: 0;
text-align: left;
position: static;
left: auto;
top: auto;
width: auto;
height: auto;
background: none;
border: none;
border-radius: 0;
}
#col_mainarea .nav-popular h2,
#col_subarea .nav-popular h2 {
color: #fff;
margin: 0;
padding: 0 0 0.25em 0;
line-height: 1.3;
font-size: 1.5em;
font-weight: 700;
padding: 0.5em 0.5em 0.5em 0.5em;
text-align: center;
border-radius: 3px;
position: relative;
background-color: #744E02;
-webkit-background-size: 8px 8px;
-moz-background-size: 8px 8px;
background-size: 8px 8px;
background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, .1) 25%, transparent 25%,
transparent 50%, rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, .1) 75%,
transparent 75%, transparent);
background-image: linear-gradient(135deg, rgba(255, 255, 255, .1) 25%, transparent 25%,
transparent 50%, rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, .1) 75%,
transparent 75%, transparent);
}
#col_mainarea .nav-popular h2:before,
#col_subarea .nav-popular h2:before {
content: "";
border: solid transparent;
display: inline-block;
position: absolute;
border-width: 8px;
border-top-color: #744E02;
left: 50%;
bottom: -16px;
-webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
z-index: 2;
}
.mymenu-thumb-list ul {
margin: 0;
padding: 0;
border: 0;
}
.mymenu-thumb-list li,.mymenu-thumb-list li:last-child {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
border: 0;
}
.mymenu-thumb-list li::before,
.mymenu-thumb-list li::after {
display: none;
}
.mymenu-thumb-list li a {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
padding: 1em 0;
line-height: 1.6;
font-size: 16px;
color: #555;
text-decoration: none;
border-bottom: 1px solid #bbb;
background-color: #fff;
}
.mymenu-thumb-list li:not(:last-child) a{
border-bottom: 1px solid #bbb;
}
.mymenu-thumb-list li a:hover {
background-color: rgba(255,240,165,0.3);
color: #555;
}
.mymenu-thumb-list li .thumb {
min-width: 90px;
max-width: 90px;
margin-right: 0.6em;
}
.mymenu-thumb-list li .thumb img {
max-width: 100%;
vertical-align: top;
}
.mymenu-thumb-list li .txt {
}
#col_mainarea .nav-popular h3,
#col_subarea .nav-popular h3 {
font-size: 17px;
font-weight: 700;
line-height: 1.4;
}
#col_mainarea .nav-popular p,
#col_subarea .nav-popular p {
margin: 0.5em 0 0 0;
line-height: 1.6;
font-size: 15px;
}
.mymenu-thumb-list li a:before {
display: none;
}
@media screen and (min-width: 768px){
#col_mainarea .nav-popular h2 {
font-size: 1.6em !important;
/*border-top: 3px solid #32408f;
border-bottom: 3px solid #32408f;*/
}
#col_mainarea .mymenu-thumb-list li .thumb {
min-width: 120px;
max-width: 120px;
margin-right: 1em;
}
#col_mainarea .nav-popular h3 {
font-size: 1.2em;
}
}
/*ランキングバッジ*/
/*.mymenu-thumb-list ul {
  counter-reset: list-counter;
}
.mymenu-thumb-list li {
position: relative;
}
.mymenu-thumb-list li::after {
  counter-increment: list-counter;
  content: counter(list-counter);
  display: block;
  position: absolute;
  width: 1.5em;
  height: 1.5em;
  top: 1em;
  left: 0;
  background-color: #3F51B5;
  color: #FFF;
  line-height: 1.55em;
  text-align: center;
  font-weight: 700;
  z-index: 5;
}
.mymenu-thumb-list li:nth-child(1)::after {
  background-color: #AB8B00;
}
.mymenu-thumb-list li:nth-child(2)::after {
  background-color: #808980;
}
.mymenu-thumb-list li:nth-child(3)::after {
  background-color: #A25300;
}*/
/*
========== 検索 ==========
*/
#searchbox form {
margin:0;
padding:0;
}
#searchbox {
margin: 30px 0;
text-align: center;
}
#searchbox input {
vertical-align: middle;
}
.skwd {
border: 0;
/*background: #ffffff url(img/bg_ico_search.gif) 5px 50% no-repeat;*/
padding: 7px 5px 7px 5px;
/*width: 163px;*/
margin: 0 5px 0 0;
color: #333333;
border: 2px solid #744E02;
width: calc(100% - 100px);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 16px;
border-radius: 0;
}
/*#searchbox::before {
content: " ";
    margin-top: -60px;
    height: 60px;
    display: block;
    visibility: hidden;
}*/
/*
========== 更新履歴 ==========
*/
#sec_whatsnew2 {
padding: 13px 10px 10px 10px;
margin: 20px 0;
font-size: 12px;
border: 1px solid #ddd;
background-color: #fff;
}
#sec_whatsnew2 h2 {
font-size: 12px;
line-height: 1.5;
border: none;
padding: 0;
background: none;
filter: none;
font-weight: normal;
display: inline;
}
#sec_whatsnew2 ul {
margin: 0;
padding: 0;
display: inline;
}
#sec_whatsnew2 li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1.5;
display: inline;
}
#sec_whatsnew2 a {
display: block;
}
/*
==================================================
フッター
==================================================
*/
#footer {
background-color: #FAF7EE;
padding-top: 20px;
border-top: 1px solid #ddd;
}
.foot_inner {
}
.area-ft-logo {
padding: 0 0 20px 0;
}
.ft-logo {
text-align: center;
}
.ft-logo img {
width: 80%;
max-width: 320px;
}
.page-nav {
margin: 20px auto 0;
padding: 0 0.5em;
text-align: center;
font-size: 14px;
width: 90%;
}
.page-nav > li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 2;
  display: inline-block;
}
.page-nav li::before {
display: none;
}
.page-nav > li + li::before {
  content: '|';
  display: inline-block;
  margin: 0 0.5em 0 0.5em;
position: relative;
left: auto;
top: -0.1em;
width: auto;
height: auto;
background: none;
border-radius: 0;
color: #333;
}
.page-nav > li:nth-child(2) + li::before {
content: '';
margin: 0 0.5em 0 0;
}
.page-nav a {
text-decoration: none;
color: #333;
}
.page-nav a:hover {
text-decoration: none;
color: #E48322;
}
#copyright {
text-align: center;
font-size: 12px;
line-height: 1.5;
color: #fff;
background-color: #744E02;
padding: 15px 5px;
}
#utility-nav-foot {
margin: 0;
padding: 0;
}
#utility-nav-foot li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
#utility-nav-foot li::before {
display: none;
}
#utility-nav-foot {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
margin-top: 20px;
}
#utility-nav-foot li {
margin: 0 1em;
}
#utility-nav-foot li img {
width: 30px;
border-radius: 4px;
}
/*
==================================================
ライター情報
==================================================
*/
.area-writer {
padding: 1em;
margin: 40px 0;
border: 1px solid #DCC291;
background-color: #FFFDF8;
}
.area-writer dl,.area-writer dt,.area-writer dd {
margin: 0;
padding: 0;
}
.area-writer .general_layout_lt .gl_img {
margin: 0 1em 10px 0;
width: auto;
}
.area-writer .general_layout_lt .gl_txt {
overflow: visible;
}
.area-writer .general_layout_lt .gl_img img {
width: 80px;
height: auto;
}
.area-writer dt {
font-size: 18px;
font-weight: bold;
margin-bottom: 0.5em;
line-height: 1.5;
}
.area-writer dd {
line-height: 1.8;
}
.area-writer .pubdate {
text-align: right;
margin: 10px 0 0 0;
font-size: 13px;
}
/*
==================================================
SNS
==================================================
*/
.social-area-syncer {
background: #fff;
padding: 0 ;
margin: 40px 0;
}
ul.social-button-syncer {
text-align: center ;
margin: 0;
padding: 0 ;
border: none ;
list-style-type: none ;
}
ul.social-button-syncer li {
display: inline-block;
vertical-align: top;
margin: 8px 10px ;
padding: 0;
line-height: 1;
background: none;
}
ul.social-button-syncer li::before {
display: none;
}
.sc-tw {
}
.sc-tw svg {
width: 30px ;
height: 30px ;
 }
.sc-tw a {
margin: 0 auto ;
padding: 8px 10px ;
display: block ;
background: #1B95E0 ;
font-size: 12px ;
color: #fff ;
font-weight: 700 ;
text-decoration: none ;
letter-spacing: .5px ;
border-radius: 2px ;
}
.sc-tw a:hover {
color: #fff ;
background: #0c7abf ;
}
.sc-tw span:before {
white-space: pre ;
content: '\A' ;
}
.sc-li-img {
border: none ;
margin: 0 auto ;
padding:0 ;
}
/* デスクトップPCではLINEボタンを表示しない */
@media only screen and (min-width: 480px){
ul.social-button-syncer li.sc-li,
.area-sns dd:nth-child(6) {
display: none;
}
}
/*
========== SNS（記事上の小ボタンタイプ） ==========
*/
.area-sns {
margin: -5px 0 5px 0;
padding: 0;
text-align: center;
}
.area-sns dt {
display: none;
}
.area-sns dd {
margin: 5px 10px;
padding: 0;
display: inline-block;
vertical-align: top;
line-height: 1;
}
.area-sns .hatebu iframe {
/*width: 80px !important;*/
}
.area-sns .twitter iframe {
/* width: 68px !important; */
}
/*
==================================================
ランキング
==================================================
*/
[class^="rank"] {
font-size: 24px;
margin: 1em 0 0.8em 0;
padding: 0.5em 0 0.5em 60px;
position: relative;
line-height: 1.5;
font-weight: bold;
    border-bottom: dotted 2px #ccc;
}
[class^="rank"]:before {
content: "";
position: absolute;
left: 0;
top: 50%;
}
.text [class^="rank"] p {
margin-bottom: 0;
line-height: 1.5;
}
.rank1,.rank2,.rank3 {
padding-left: 66px;
}
.rank1:before,.rank2:before,.rank3:before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 60px;
height: 48px;
border-radius: 0;
margin-top: -28px;
}
.rank4:before,.rank5:before,.rank6:before,.rank7:before,.rank8:before,.rank9:before,.rank10:before {
content: "";
position: absolute;
width: 54px;
height: 48px;
margin-top: -20px;
}
.rank1:before {
background: url(img/bg-rank1.png) no-repeat;
background-size: 60px auto;
}
.rank2:before {
background: url(img/bg-rank2.png) no-repeat;
background-size: 60px auto;
}
.rank3:before {
background: url(img/bg-rank3.png) no-repeat;
background-size: 60px auto;
}
.rank4:before {
background: url(img/bg-rank4.png) no-repeat;
background-size: 50px auto;
}
.rank5:before {
background: url(img/bg-rank5.png) no-repeat;
background-size: 50px auto;
}
.rank6:before {
background: url(img/bg-rank6.png) no-repeat;
background-size: 50px auto;
}
.rank7:before {
background: url(img/bg-rank7.png) no-repeat;
background-size: 50px auto;
}
.rank8:before {
background: url(img/bg-rank8.png) no-repeat;
background-size: 50px auto;
}
.rank9:before {
background: url(img/bg-rank9.png) no-repeat;
background-size: 50px auto;
}
.rank10:before {
background: url(img/bg-rank10.png) no-repeat;
background-size: 50px auto;
}
/*
==================================================
ポイント
==================================================
*/
.point {
margin: 1.5em 0 1.5em 0;
padding: 0 0 0 4em;
position: relative;
line-height: 1.8;
}
.point:before {
content: "POINT";
position: absolute;
left: 0;
top: 50%;
font-size: 0.8em;
font-weight: bold;
background-color: #895B02;
color: #fff;
padding: 0.5em 0.5em 0.5em 0.5em;
border-radius: 0.25em;
margin-top: -1.4em;
z-index: 2;
}
.point:after {
content: "";
background-color: #895B02;
width: 2px;
height: 100%;
position: absolute;
left: 1.6em;
top: 0;
}
.text [class^="point"] p {
margin-bottom: 0;
line-height: 1.5;
}
.text .point p {
line-height: 1.8;
}
.point1,.point2,.point3,.point4,.point5,.point6,.point7,.point8,.point9,.point10 {
position: relative;
padding-left: 55px;
font-size: 20px;
margin: 1.25em 0 1.25em 0;
line-height: 1.5;
font-weight: bold;
}
.point1:before,.point2:before,.point3:before,.point4:before,.point5:before,.point6:before,.point7:before,.point8:before,.point9:before,.point10:before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 50px;
height: 50px;
margin-top: -25px;
}
.point1:before {
background: url(img/bg-point1.png) no-repeat;
background-size: 50px auto;
}
.point2:before {
background: url(img/bg-point2.png) no-repeat;
background-size: 50px auto;
}
.point3:before {
background: url(img/bg-point3.png) no-repeat;
background-size: 50px auto;
}
.point4:before {
background: url(img/bg-point4.png) no-repeat;
background-size: 50px auto;
}
.point5:before {
background: url(img/bg-point5.png) no-repeat;
background-size: 50px auto;
}
.point6:before {
background: url(img/bg-point6.png) no-repeat;
background-size: 50px auto;
}
.point7:before {
background: url(img/bg-point7.png) no-repeat;
background-size: 50px auto;
}
.point8:before {
background: url(img/bg-point8.png) no-repeat;
background-size: 50px auto;
}
.point9:before {
background: url(img/bg-point9.png) no-repeat;
background-size: 50px auto;
}
.point10:before {
background: url(img/bg-point10.png) no-repeat;
background-size: 50px auto;
}
/*
==================================================
インタビューコメント枠
==================================================
*/
.sec-comment {
margin: 40px 0;
}
.sec-comment .general_layout_lt .gl_img {
margin: 0 0 0 0;
width: 60px;
}
.sec-comment .general_layout_rt .gl_img {
margin: 0 0 0 0;
width: 60px;
}
.sec-comment .general_layout_lt,
.sec-comment .general_layout_rt {
margin: 0 0 30px 0;
}
.sec-comment .gl_txt {
padding: 0 10px;
}
.sec-comment [class*="mod-triangle-"] p {
    margin-bottom: 1em;
line-height: 1.8;
}
.sec-comment [class*="mod-triangle-"] :last-child {
margin-bottom: 0;
}
[class*="mod-triangle-"] {
position: relative;
background-color: #fff;
border: 1px solid #ccc;
padding: 1em 1em;
border-radius: 4px;
color: #555;
}
[class*="mod-triangle-"]:before,
[class*="mod-triangle-"]:after {
content: "";
border: solid transparent;
position: absolute;
}
.sc-blue {
border: 2px solid #A9D6ED;
}
.sc-pink {
border: 2px solid #F2B3C3;
}
.sc-grn {
border: 2px solid #A1DBC5;
}
/* triangle */
.mod-triangle-tp:before {
border-width: 8px;
border-bottom-color: #ccc;
margin-left: -8px;
left: 50%;
top: -16px;
}
.mod-triangle-rt:before {
border-width: 8px;
border-left-color: #ccc;
margin-top: -8px;
right: -18px;
top: 20%;
}
.mod-triangle-bm:before {
border-width: 8px;
border-top-color: #ccc;
margin-left: -8px;
left: 50%;
bottom: -16px;
}
.mod-triangle-lt:before {
border-width: 8px;
border-right-color: #ccc;
margin-top: -8px;
left: -18px;
top: 20%;
}
.mod-triangle-tp:after {
border-width: 8px;
border-bottom-color: #fff;
margin-left: -8px;
left: 50%;
top: -15px;
}
.mod-triangle-rt:after {
border-width: 8px;
border-left-color: #fff;
margin-top: -8px;
right: -15px;
top: 20%;
}
.mod-triangle-bm:after {
border-width: 8px;
border-top-color: #fff;
margin-left: -8px;
left: 50%;
bottom: -15px;
}
.mod-triangle-lt:after {
border-width: 8px;
border-right-color: #fff;
margin-top: -8px;
left: -15px;
top: 20%;
}
.mod-triangle-lt.sc-blue:before {
border-right-color: #A9D6ED;
}
.mod-triangle-rt.sc-blue:before {
border-left-color: #A9D6ED;
}
.mod-triangle-lt.sc-pink:before {
border-right-color: #F2B3C3;
}
.mod-triangle-rt.sc-pink:before {
border-left-color: #F2B3C3;
}
.mod-triangle-lt.sc-grn:before {
border-right-color: #A1DBC5;
}
.mod-triangle-rt.sc-grn:before {
border-left-color: #A1DBC5;
}
/*塗りの場合の吹き出しデザイン*/
/*
.sc-blue {
border: 1px solid transparent;
background-color: rgba(144, 215, 238, 0.3);
}
.sc-pink {
border: 1px solid transparent;
background-color: rgba(242, 179, 195, 0.3);
}
.sc-grn {
border: 1px solid transparent;
background-color: rgba(153, 204, 0, 0.3);
}
*/
/* triangle */
/*
.mod-triangle-tp:before {
border-width: 8px;
border-bottom-color: #ccc;
margin-left: -8px;
left: 50%;
top: -16px;
}
.mod-triangle-rt:before {
border-width: 8px;
border-left-color: #ccc;
margin-top: -8px;
right: -16px;
top: 20%;
}
.mod-triangle-bm:before {
border-width: 8px;
border-top-color: #ccc;
margin-left: -8px;
left: 50%;
bottom: -16px;
}
.mod-triangle-lt:before {
border-width: 8px;
border-right-color: #ccc;
margin-top: -8px;
left: -16px;
top: 20%;
}
.mod-triangle-tp:after {
border-width: 8px;
border-bottom-color: #fff;
margin-left: -8px;
left: 50%;
top: -15px;
}
.mod-triangle-rt:after {
border-width: 8px;
border-left-color: #fff;
margin-top: -8px;
right: -17px;
top: 20%;
}
.mod-triangle-bm:after {
border-width: 8px;
border-top-color: #fff;
margin-left: -8px;
left: 50%;
bottom: -15px;
}
.mod-triangle-lt:after {
border-width: 8px;
border-right-color: #fff;
margin-top: -8px;
left: -17px;
top: 20%;
}
.mod-triangle-lt.sc-blue:before {
border-right-color: transparent;
}
.mod-triangle-rt.sc-blue:before {
border-left-color: transparent;
}
.mod-triangle-lt.sc-blue:after {
border-right-color: rgba(144, 215, 238, 0.3);
}
.mod-triangle-rt.sc-blue:after {
border-left-color: rgba(144, 215, 238, 0.3);
}
.mod-triangle-lt.sc-pink:before {
border-right-color: transparent;
}
.mod-triangle-rt.sc-pink:before {
border-left-color: transparent;
}
.mod-triangle-lt.sc-pink:after {
border-right-color: rgba(242, 179, 195, 0.3);
}
.mod-triangle-rt.sc-pink:after {
border-left-color: rgba(242, 179, 195, 0.3);
}
.mod-triangle-lt.sc-grn:before {
border-right-color: transparent;
}
.mod-triangle-rt.sc-grn:before {
border-left-color: transparent;
}
.mod-triangle-lt.sc-grn:after {
border-right-color: rgba(153, 204, 0, 0.3);
}
.mod-triangle-rt.sc-grn:after {
border-left-color: rgba(153, 204, 0, 0.3);
}
*/
/*
========== 暮らしの達人グループサイト ==========
*/
#sec-gpsite {
margin: 30px 0 30px 0;
}
#sec-gpsite h2 {
background: none;
border: 0;
margin: 0 0 20px 0;
height: auto;
line-height: 1;
padding: 0;
clear: none;
/*初期化*/
position: relative;
font-size: 22px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
#sec-gpsite h2:before,
#sec-gpsite h2:after {
background: none;
border: 0;
height: auto;
width: auto;
position: static;
left: auto;
top: auto;
margin: 0;
padding: 0;
box-sizing: content-box;
/*初期化*/
content: '';
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
height: 3px;
background: #AA0002;
min-width: 10px;
}
#sec-gpsite h2:before {
    margin-right: 0.5em;
}
#sec-gpsite h2:after {
    margin-left: 0.5em;
}
#sec-gpsite ul {
margin: 0;
padding: 0;
}
#sec-gpsite li {
margin: 0 auto 15px auto;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
max-width: 320px;
}
/*hover処理*/
#sec-gpsite li a {
position: relative;
display: block;
}
#sec-gpsite li a::before {
-webkit-transition: 0.3s;
transition: 0.3s;
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
border: 0px solid #fff;
background-color: rgba(0,0,0,0);
box-sizing: border-box;
}
#sec-gpsite li a:hover:before {
border: 4px solid #C69E75;
width: 100%;
height: 100%;
background-color: rgba(255,255,0,0.2)
}
/*
==================================================
画面右下部に表示されるページトップ
==================================================
*/
#fixedTop {
text-decoration: none;
right: 10px;
bottom: 10px;
width: 40px;
height: 40px;
line-height: 40px;
color: #fff;
font-size: 20px;
text-align: center;
display: none;
background-color: rgba(121,77,0,0.8);
position: fixed;
z-index: 9999;
border-radius: 4px;
-webkit-transform: translateZ(0);
}
#fixedTop:hover {
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
opacity: 0.7;
}
#rmenu {
float: left;
}
#column3 #layoutbox {
float: right;
}
#column3 #main {
float: left;
}
/*#menu1, #menu2, #menu3, #menu4, #menu5, #menu6, #menu7, #menu8, #menu9, #menu10 {
margin: 0;
padding: 10px 0 10px 15px;
line-height: 1.8em;
_text-align: left;
}*/
/* カテゴリーリスト ここから */
.title {
border-left: 5px solid #499936;
margin: 15px -15px 5px -15px;
padding: 0 0 0 5px;
font-size: 16px;
line-height: 1.5;
clear: both;
_margin: 15px -15px 5px 0px;
}
/*
.body .more {
text-align: right;
}*/
/* エントリーリスト ここから */
/*
#entrylist {
margin: 30px 0 30px 0;
padding: 0;
}
#entrylist h4 {
margin: 0 0 5px 0;
padding: 0 0 0 8px;
}
#entrylist dt {
background: url(img/bg_bullet01.gif) left center no-repeat;
margin-left: 5px;
padding-left: 18px;
line-height: 1.6em;
}*/
/* サイトマップ ここから */
/*
#sitemaps {
margin: 0;
padding: 0;
}
#sitemaps ul, #sitemaps li {
margin: 0;
padding: 0;
}
#sitemaps li {
list-style-image: none;
list-style-type: none;
}
#sitemaps .l1 {
background: url(img/bg_bullet01.gif) left center no-repeat;
margin: 0 0 8px 10px;
padding: 0 0 0 5px;
line-height: 1.4em;
text-indent: 15px;
}
#sitemaps .l2 {
background: url(img/bg_bullet02.gif) left center no-repeat;
margin: 0 0 8px 40px;
padding: 0 0 0 18px;
font-size: 13px;
line-height: 1.4em
}
#sitemaps .l3 {
background: url(img/bg_bullet02.gif) left center no-repeat;
margin: 0 0 8px 60px;
padding: 0 0 0 18px;
font-size: 13px;
line-height: 1.4em
}*/
/* パンくずリスト ここから */
/*
#siteNavi {
margin: 0 0 10px 0;
padding: 0;
font-size: 12px;
_text-align: left;
}
#siteNavi a {
text-decoration: none;
color: #333333;
}
#siteNavi a:hover {
color: #ff6633;
}*/
/*
#wrapper{}
#topmenu{}
#threebox{}
#main{}
#menu{}
#rmenu{}
*/
/* common ここから */
/* 共通 */
/*.rank1,.rank2,.rank3,.rank4,.rank5,.point,.point1,.point2,.point3,.point4,.point5,.point6,.point7,.point8,.point9,.point10{
font-family: sans-serif;
font-weight:bold;
_zoom: 1;
overflow: hidden;
}*/
/*
h4{
clear:none;
}
h4,h5,h6,ul,ol{
_zoom: 1;
overflow: hidden;
}*/
.lbg{
line-height:140%;
}
/* ランキング */
/*.rank1,.rank2,.rank3,.rank4,.rank5 {
 background-repeat: no-repeat;
 height: 25px;
 font-size: 22px;
 color: #111;
 border-bottom: dotted 2px #ccc;
 clear: both;
padding: 10px 0 10px 55px;
margin: 30px 0 15px 0;
}
.rank1 p,.rank2 p,.rank3 p,.rank4 p,.rank5 p {
line-height: 1.4;
margin: 0;
}
.rank1{
background: url(img/rank1_a.gif) 0 center no-repeat;
background-size: 50px auto;
}
.rank2{
background: url(img/rank2_a.gif) 0 center no-repeat;
background-size: 50px auto;
}
.rank3{
background: url(img/rank3_a.gif) 0 center no-repeat;
background-size: 50px auto;
}
.rank4{
background: url(img/rank4_a.gif) 0 center no-repeat;
background-size: 50px auto;
}
.rank5{
background: url(img/rank5_a.gif) 0 center no-repeat;
background-size: 50px auto;
}*/
/* ポイント */
/*.point1,.point2,.point3,.point4,.point5 ,.point6 ,.point7 ,.point8 ,.point9 ,.point10 {
background-repeat: no-repeat;
margin: 20px 0;
height: 26px;
padding-left: 46px;
font-size: 16px;
margin-top: 10px;
padding-top: 14px;
margin-bottom: 10px;
border-bottom:dotted 2px #CCC;
color: #3F3F3F;
background-position: 4px top;
clear: both;
_height: 36px;
_line-height: 1.5em;
}*/
/*.point {
font-size: 15px;
color: #111;
background: url(img/point.png) no-repeat;
padding: 0 0 10px 60px;
margin: 20px 0;
line-height:1.8;
}
.point p,.point1 p,.point2 p,.point3 p,.point4 p,.point5 p,.point6 p,.point7 p,.point8 p,.point9 p,.point10 p {
line-height: 1.8;
margin: 0;
}
.point1,.point2,.point3,.point4,.point5,.point6,.point7,.point8,.point9,.point10 {
line-height: 1.8;
margin: 20px 0;
padding: 10px 0 10px 45px;
font-size: 18px;
border-bottom: dotted 2px #ccc;
}
.point1{
background: url(img/point1.gif) left center no-repeat;
}
.point2{
background: url(img/point2.gif) left center no-repeat;
}
.point3{
background: url(img/point3.gif) left center no-repeat;
}
.point4{
background: url(img/point4.gif) left center no-repeat;
}
.point5{
background: url(img/point5.gif) left center no-repeat;
}
.point6{
background: url(img/point6.gif) left center no-repeat;
}
.point7{
background: url(img/point7.gif) left center no-repeat;
}
.point8{
background: url(img/point8.gif) left center no-repeat;
}
.point9{
background: url(img/point9.gif) left center no-repeat;
}
.point10{
background: url(img/point10.gif) left center no-repeat;
}*/
/* 矢印 */
.arrow_blue {
height: 20px;
background-image: url(img/h6.jpg);
background-position: left center;
padding-left: 26px;
background-repeat: no-repeat;
line-height: 20px;
}
.arrow_orange {
height: 20px;
text-align: right;
font-size: 16px;
font-weight: bold;
}
.arrow_orange a {
background: url(img/h6.jpg) left center no-repeat;
padding: 5px 10px 5px 26px;
line-height: 1.5em;
}
.arrow_black {
height: 20px;
text-align: left;
font-size: 16px;
font-weight: bold;
}
.arrow_black a {
height: 20px;
background: url(img/h6.jpg) left center no-repeat;
padding: 5px 10px 5px 26px;
line-height: 1.5em;
}
.arrow_red {
width: 560px;
min-height: 26px;
background: url(img/bg_notes.gif) left center no-repeat;
padding: 0 0 0 40px;
margin: 30px auto;
font-size: 12px;
line-height: 1.8;
}
 .user1,.user2 {
font-size: 12px;
line-height: 130%;
padding-top: 12px;
padding-right: 12px;
padding-bottom: 12px;
padding-left: 70px;
margin-top: 10px;
margin-bottom: 10px;
background-repeat: no-repeat;
background-position: 12px 12px;
background-color: #EFF4FA;
border: 1px solid #C5D7ED;
min-height: 70px;
_height:70px;
_zoom: 1;
overflow: hidden;
}
 .user1{
background-image: url(img/user1.png);
_height:100px;
}
 .user2{
background-image: url(img/user2.png);
_height:100px;
}
.user2 p {
line-height: 1.8;
margin: 0;
}
.noimage{
padding-left:12px;
background-image: none;
min-height:15px;
}
.ylw{
background-color:#FFE566;
font-weight:bold;
padding:2px;
}
/* ボックス */
.nmlbox,.dottbox,.ylwbox,.graybg{
padding:15px;
margin-top: 20px;
margin-bottom: 20px;
clear:both;
}
 .graybg{
background-color:#f6f6f6;
}
.dottbox{
border:dotted 1px #666;
}
.nmlbox {
border: 2px solid #CCCCCC;
}
.ylwbox {
background-color: #FFEFEF;
border: 1px solid #CC0000;
line-height: 1.8;
}
.graybg p,.ylwbox p {
line-height: 1.8;
margin: 0;
}
/* 水平線 */
.border1,.border2,.border3,.borderdot,.borderdot2{
margin: 10px;
padding: 0px;
line-height: 1px;
height: 1px;
_zoom: 1;
overflow: hidden;
}
.border1 {
border-bottom:solid 1px #999;
}
.border2 {
border-bottom:solid 1px #990000;
}
.border3 {
border-bottom:solid 1px #003366;
}
.borderdot {
border-top:dotted 1px #999;
}
.borderdot2 {
border-top:dotted 2px #999;
}
.layout_l{
float:left;
}
.layout_r{
float:right;
}
.hd,.hd:hover,.hd:visited{
color:#111;
text-decoration:none;
}
/* 角丸 */
.rnd1{
padding: 15px;
margin: 15px auto 15px auto;
}
.rnd1{
position:relative;
z-index:1;
padding: 15px;
margin: 15px auto 15px auto;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
behavior: url(http://www.hikkoshigyousyascore.com/css/PIE.htc);
}
.rbox1 {
background-color: #f0f0f0;
border: 1px solid #d7d7d7;
}
.rbox2 {
background-color: #FFF;
border: 2px solid #FF843F;
}
.rbox3 {
background-color: #FFF;
}
.rbox4 {
background-color: #F5F5F5;
}
/* シャドウ */
.shadow1,.shadow2,.shadow3{
padding: 15px;
margin: 15px auto 15px auto;
}
.shadow1{
-moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
.shadow2{
-moz-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}
/* FAQ */
.question1 {
font-size: 17px;
font-weight: bold;
line-height: 130%;
margin: 15px auto 4px auto;
padding: 5px 0 6px 50px;
background-image: url(img/q1.png);
background-repeat: no-repeat;
background-position: 10px top;
}
.answer1 {
position:relative;
font-size: 13px;
line-height:140%;
border:solid 1px #CCC;
background-color:#F5F5F5;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
margin: 5px auto 35px auto;
padding: 20px 20px 20px 60px;
background-image: url(img/a1.png);
background-repeat: no-repeat;
background-position: 12px 18px;
behavior: url(http://www.hikkoshigyousyascore.com/css/PIE.htc);
}
.question2 {
background: url(img/bg_question.jpg) left center no-repeat;
margin: 20px 0 10px 0;
padding: 15px 0 15px 60px;
font-size: 18px;
color: #333333;
height: auto;
line-height: 1.5;
overflow: visible;
font-weight: bold;
}
.answer2 {
padding: 10px 0 0 60px;
background: url(img/bg_answer.jpg) left top no-repeat;
margin-bottom: 20px;
width: 600px;
min-height: 51px;
/*border-bottom: 1px solid #cccccc;*/
}
/* 吹き出し */
.bln{
font-size:13px;
line-height:130%;
_zoom: 1;
overflow: hidden;
padding:0;
margin: 0;
color: #333333;
}
.b_body{
margin:0;
width:auto;
padding:12px 19px;
_zoom: 1;
overflow: hidden;
}
.balloon1 .b_body{
background-color:#F5F5F5;
border:solid 1px #CCC;
}
.balloon2 .b_body{
background-color:#FFF;
border:solid 1px #CCC;
}
.balloon3 .b_body{
background-color:#EBEBEB;
}
.balloon4 .b_body{
background-color:#EAF1FF;
border:solid 1px #6AA3F9;
}
.balloon5 .b_body{
background-color:#FFEAEA;
border:solid 1px #F96565;
}
.balloon6 .b_body{
background-color:#FFF;
border:solid 2px #CC0000;
}
.balloon7 .b_body{
background-color:#FFF;
border:solid 2px #0080B8;
}
.balloon8 .b_body{
background-color:#FFF;
border:solid 2px #FF8201;
}
.balloon9 .b_body{
background-color:#FFF;
border:2px solid #739221;
}
.bln .img-l{
position:relative;
z-index:100;
background-image:url(img/balloon.png);
top: 18px;
left:1px;
float:left;
width: 28px;
height: 19px;
margin:0;
}
.bln .img-r{
position: relative;
z-index:100;
background-image:url(img/balloon.png);
top: 18px;
right:1px;
float:right;
width: 28px;
height: 19px;
margin:0;
}
.bln .img-t{
position: relative;
z-index:100;
background-image:url(img/balloon.png);
top:1px;
left: 30px;
width: 22px;
height: 22px;
float:none;
margin:0;
}
.bln .img-b{
position: relative;
z-index:100;
background-image:url(img/balloon.png);
bottom:1px;
left: 30px;
width: 22px;
height: 22px;
margin:0;
}
div.bln:after{height:0; visibility: hidden; content: ".";   display: block; clear: both;}
.balloon1 .img-b{ background-position: 0 0;} 
.balloon1 .img-l{ background-position: 0 -72px;} 
.balloon1 .img-r{ background-position: 0 -139px;} 
.balloon1 .img-t{ background-position: 0 -206px;} 
.balloon2 .img-b{ background-position: 0 -278px;} 
.balloon2 .img-l{ background-position: 0 -350px;} 
.balloon2 .img-r{ background-position: 0 -417px;} 
.balloon2 .img-t{ background-position: 0 -484px;} 
.balloon3 .img-b{ background-position: 0 -556px;} 
.balloon3 .img-l{ background-position: 0 -628px;} 
.balloon3 .img-r{ background-position: 0 -695px;} 
.balloon3 .img-t{ background-position: 0 -762px;} 
.balloon4 .img-b{ background-position: 0 -834px;} 
.balloon4 .img-l{ background-position: 0 -906px;} 
.balloon4 .img-r{ background-position: 0 -973px;} 
.balloon4 .img-t{ background-position: 0 -1040px;} 
.balloon5 .img-b{ background-position: 0 -1112px;} 
.balloon5 .img-l{ background-position: 0 -1184px;} 
.balloon5 .img-r{ background-position: 0 -1251px;} 
.balloon5 .img-t{ background-position: 0 -1318px;} 
.balloon6 .img-b{ background-position: 0 -1390px;bottom:2px;} 
.balloon6 .img-l{ background-position: 0 -1462px;left:2px;} 
.balloon6 .img-r{ background-position: 0 -1531px;right:2px;} 
.balloon6 .img-t{ background-position: 0 -1600px;top:2px;} 
.balloon7 .img-b{ background-position: 0 -1672px;bottom:2px;} 
.balloon7 .img-l{ background-position: 0 -1744px;left:2px;} 
.balloon7 .img-r{ background-position: 0 -1813px;right:2px;} 
.balloon7 .img-t{ background-position: 0 -1882px;top:2px;} 
.balloon8 .img-b{ background-position: -78px 0;bottom:2px;} 
.balloon8 .img-l{ background-position: -78px -72px;left:2px;}
.balloon8 .img-r{ background-position: -78px -141px;right:2px;}
.balloon8 .img-t{ background-position: -78px -210px;top:2px;}
.balloon9 .img-b{ background-position: -78px -282px;bottom:2px;} 
.balloon9 .img-l{ background-position: -78px -354px;left:2px;} 
.balloon9 .img-r{ background-position: -78px -423px;right:2px;} 
.balloon9 .img-t{ background-position: -78px -492px;top:2px;}
/* fixImageStyles */
.img-center{text-align:center;max-width:100%;height:auto;}
.img-center img{max-width:100%;height:auto;}
span.img-center{display:block;}
table.rank-table td .img-center{text-align:left !important;}
/*
========== QA ==========
*/
.question {
  background-color: #fff;
margin: 35px auto 20px;
padding: 24px 10px 24px 20px;
clear: both;
border: 3px solid #64A14D;
border-radius: 6px;
position: relative;
}
.question p {
font-size: 14px;
line-height: 24px;
margin-bottom: 24px;
}
.question:before {
    content: "";
    position: absolute;
    left: -10px;
    top: -25px;
width: 50px;
height: 48px;
background: url(img/bg-ques.png) no-repeat;
background-size: 50px auto;
}
.answer {
margin: 30px auto 30px auto;
padding: 24px 10px 15px 20px;
background-color: #FFFDF8;
border: 3px solid #F1753F;
position: relative;
border-radius: 6px;
}
.answer:after {
    content: "";
    position: absolute;
    left: -10px;
    top: -25px;
width: 50px;
height: 48px;
background: url(img/bg-ans.png) no-repeat;
background-size: 50px auto;
}
/*.answer:before {
    content: "";
    border: solid transparent;
    position: absolute;
    
    border-width: 16px;
    border-bottom-color: #895B02;
    left: 50%;
    top: -32px;
margin-left: -13px;
}*/
.question :last-child,.answer :last-child {
  margin-bottom: 0;
}
/*
==================================================
お問い合わせ
==================================================
*/
fieldset, form, label, legend, iframe {
margin: 0;
padding: 0;
border: 0;
}
#formframe { 
width: 100%;
}
#area-contact {
padding-bottom: 1px;
}
#area-contact h3 {
    border-bottom: 4px solid #895B02;
    margin: 0 0 18px 0;
    padding: 4px 0 2px 10px;
    line-height: 1.4;
    font-size: 19px;
    clear: both;
    position: relative;
    font-weight: bold;
}
#area-contact h3:before {
    content:"";
    display: block;
    position: absolute;
    left: 0;
    top: 14%;
    margin-top: 0;
    width: 5px;
    height: 80%;
    background-color: #895B02;
}
#area-contact p {
line-height: 1.8;
margin: 0 0 1em 0;
}
.area_btn {
text-align: center;
margin: 20px 0;
}
.area_btn input:first-child {
margin-bottom: 20px;
}
.area_btn input + input[type="submit"] {
margin-bottom: 20px;
}
.area_mailform {
margin: 0 0 20px 0;
}
.area_mailform legend {
display: none;
}
.area_mailform th em {
color: #cc0000;
margin-left: 5px;
font-style: normal;
}
.area_mailform th span {
color: #888888;
margin-left: 5px;
font-weight: normal;
}
.err_message {/* MicroEngine メールフォームのエラーメッセージ （サーバサイド）*/
display: block;
color: #cc0000;
}
/*
========== テーブルデザイン ==========
*/
.td0 {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
}
.td0 th {
border: 1px solid #cccccc;
background-color: #f7f7f7;
padding: 1em 1em 0.9em 1em;
line-height: 1.7;
width: 1%;
white-space: nowrap;
text-align: left;
}
.td0 td {
border: 1px solid #cccccc;
padding: 1em 1em 0.9em 1em;
line-height: 1.7;
background-color: #ffffff;
}
/* mobile first */
.td0 th,.area_mailform th,
.td0 td,.area_mailform td {
width: 100%;
float: left; /* for IE9 */
clear: both; /* for IE9 */
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.td0 colgroup,.area_mailform colgroup,
.td0 col,.area_mailform col {
display: none; /*for Firefox*/
}
.td0 tr:after,.area_mailform tr:after { /* clearfix */
content:'';
display: table;
}
/*
.td0,
.area_mailform table {
width: 100%;
border-collapse: separate;
border-spacing: 0;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.td0 th,
.area_mailform th {
border: none;
border-top: 1px solid #cccccc;
border-left: 1px solid #cccccc;
padding: 1em 1em 0.9em 1em;
background-color: #f7f7f7;
line-height: 1.7;
}
.td0 td,
.area_mailform td {
border: none;
border-top: 1px solid #cccccc;
border-left: 1px solid #cccccc;
padding: 1em 1em 0.9em 1em;
line-height: 1.7;
background-color: #ffffff;
}
*/
/* セル内の内容が少ない場合は上記3設定を消してこちらを使用する */
.td0 th,.td0 td {
border-bottom: none;
}
.td0 tr:last-of-type td {
border-bottom: 1px solid #cccccc;
}
@media only screen and (min-width: 769px){
/* テーブルデザイン */
.td0,.area_mailform table {
/*display: table;*/
display: block;/* safariで線がダブル対策 */
}
.td0 tbody,.area_mailform table tbody {
display: table-row-group;
}
.td0 tr,.area_mailform table tr {
display: table-row;
}
.td0 th,.area_mailform th,
.td0 td,.area_mailform td {
width: auto;
float: none;
clear: none;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.td0 colgroup,.area_mailform colgroup {
display: table-column-group;
}
.td0 col,.area_mailform col {
display: table-column;
}
.td0 tr:after,.area_mailform tr:after {
content: normal;
display: inline;
}
.td0,
.area_mailform table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.td0 th,
.area_mailform th {
border: 1px solid #cccccc;
background-color: #f7f7f7;
padding: 1em 1em 0.9em 1em;
line-height: 1.7;
width: 1%;
white-space: nowrap;
text-align: left;
}
.td0 td,
.area_mailform td {
border: 1px solid #cccccc;
padding: 1em 1em 0.9em 1em;
line-height: 1.7;
background-color: #ffffff;
}
}
/*
==================================================
フォーム
==================================================
*/
/*
========== テキストフィールド ==========
*/
/* MicroEngine メールフォームの確認画面で、入力項目のNAMEに対応したID名を持つ要素内に入力内容に置換される仕様のため、
IDの前にタグ（input/textarea）を付加してフィールドのデザインと区別し、反映させないようにする */
/* 入力フォーマット */
input#name,input#mail,input#subject,input#tel,textarea#comment,input#captcha {
border: 2px solid #dddddd;
background-color: #ffffff;
padding: 6px;
font-size: 115%;
}
input#name:focus,input#mail:focus,input#subject:focus,input#tel:focus,textarea#comment:focus,input#captcha:focus{
background-color: #ffffcc;
border: 2px solid #895B02;
}
/* 各種設定 */
input#name,input#mail,input#subject,input#tel,textarea#comment {
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
input#captcha {
width: 180px;
vertical-align: middle;
margin-right: 10px;
font-weight: bold;
font-family: Verdana,Arial,Helvetica,sans-serif;
}
/*
========== ボタンデザインA ==========
*/
.btn_dgna {
margin: 0 20px;
text-decoration: none;
display: inline-block;
text-align: center;
font-size: 129%;
font-weight: bold;
text-shadow: 1px 1px 0 #ffffff;
color: #444;
padding: 15px 30px 15px 30px;
border: 1px solid #cccccc;
border-radius: 4px;
cursor: pointer;
background: #eeeeee;
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeeeee));
background: -webkit-linear-gradient(top, #ffffff, #eeeeee);
background: -moz-linear-gradient(top, #ffffff, #eeeeee);
background: -ms-linear-gradient(top, #ffffff, #eeeeee);
background: -o-linear-gradient(top, #ffffff, #eeeeee);
background: linear-gradient(to bottom, #ffffff, #eeeeee);
box-shadow: inset 0 0 1px #cccccc;
}
.btn_dgna:hover {
background: #ffffff;
background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#ffffff));
background: -webkit-linear-gradient(top, #eeeeee, #ffffff);
background: -moz-linear-gradient(top, #eeeeee, #ffffff);
background: -ms-linear-gradient(top, #eeeeee, #ffffff);
background: -o-linear-gradient(top, #eeeeee, #ffffff);
background: linear-gradient(to bottom, #eeeeee, #ffffff);
box-shadow: inset 1px 1px 0 #ffffff;
}
/*
==================================================
汎用テーブル
==================================================
*/
/*行見出しパターン*/
.tbl-rowh {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
margin: 10px auto;
}
.tbl-rowh th {
border: 1px solid #7a5202;
background-color: #fbf1e1;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
/*width: 1%;
white-space: nowrap;*/
width: 90px;
text-align: left;
}
.tbl-rowh td {
border: 1px solid #7a5202;
background-color: #ffffff;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
word-wrap: break-word;
word-break: break-all;
}
/*列見出しパターン*/
.tbl-colh {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
margin: 10px auto;
table-layout: fixed;
/*table-layoutプロパティに「fixed」を指定する場合、必要に応じて各列（セル）の幅を指定するが、幅が指定されていない列には残りの幅が均等に割り当てられる。
また、最初の一行目を読み込んだ時点で各列の幅を固定して表示を開始するため、 表示が速くなるメリットがあり*/
}
.tbl-colh th {
border: 1px solid #7a5202;
background-color: #fbf1e1;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
text-align: center;
}
.tbl-colh td {
border: 1px solid #7a5202;
background-color: #ffffff;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
word-wrap: break-word;
word-break: break-all;
}
/*列見出しと行見出しパターン*/
.tbl-colhrowh {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
margin: 10px auto;
}
.tbl-colhrowh th {
border: 1px solid #7a5202;
background-color: #fbf1e1;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
text-align: center;
}
.tbl-colhrowh td {
border: 1px solid #7a5202;
padding: 0.5em 0.5em 0.4em 0.5em;
background-color: #ffffff;
line-height: 1.5;
word-wrap: break-word;
word-break: break-all;
}
/*事例1：虎の巻で使用したタイプ*/
.tbl-design1 {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
margin: 15px 0;
font-size: 14px;
}
.tbl-design1 th {
border: 1px solid #7a5202;
background-color: #fbf1e1;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
}
.tbl-design1 td {
border: 1px solid #7a5202;
background-color: #ffffff;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
word-wrap: break-word;
word-break: break-all;
}
.tbl-design1 tr:nth-of-type(1) th:nth-of-type(1) {
width: 5em;
text-align: center;
}
.tbl-design1 tr:nth-of-type(1) th:nth-of-type(2) {
width: 5em;
text-align: center;
}
.tbl-design1 tr:nth-of-type(1) th:nth-of-type(3) {
text-align: center;
}
/*事例2：こう選べで使用した変則タイプ（ベース設定からの追加分）*/
.tbl-rowh .td-row1 {
width: 90px;
}
/*
==================================================
汎用ボタン
==================================================
*/
.buttn {
position: relative;
display: inline-block;
padding: 5px 0;
font-size: 24px;
text-align: center;
text-shadow: 0 -1px rgba(0, 0, 0, 0.4);
background-clip: padding-box;
border: 1px solid;
border-radius: 2px;
cursor: pointer;
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 1px 2px rgba(0, 0, 0, 0.25);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 1px 2px rgba(0, 0, 0, 0.25);
margin: 10px;
font-weight: bold;
color: #fff;
}
.buttn:before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
pointer-events: none;
background-image: -webkit-radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
background-image: -moz-radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
background-image: -o-radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
background-image: radial-gradient(center top, farthest-corner, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
}
.buttn:hover:before {
background-image: -webkit-radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
background-image: -moz-radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
background-image: -o-radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
background-image: radial-gradient(farthest-corner, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03));
}
.buttn:active {
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}
.buttn:active:before {
content: none;
}
a.buttn {/* グローバルリンク設定の上書き */
color: #fff;
text-decoration: none;
}
.buttn-green {
border-color: #478228 #478228 #3c6f22;
background: #5ca934;
background-image: -webkit-gradient(linear, left top, left bottom, from(#69c03b), color-stop(0.66, #5ca934), to(#54992f));
background-image: -webkit-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: -moz-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: -ms-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: -o-linear-gradient(top, #69c03b, #5ca934 66%, #54992f);
background-image: linear-gradient(to bottom, #69c03b, #5ca934 66%, #54992f);
}
.buttn-green:active {
background: #5ca934;
border-color: #3c6f22 #478228 #478228;
}
[id^="space"] .area-capbtn,
.text .area-capbtn {
text-align: center;
margin: 15px auto 65px;
line-height: 1.4;
}
.area-capbtn .buttn {
padding: 10px 10px;
font-size: 24px;
border-radius: 5px;
margin: 0;
width: 80%;
}
/*合わせて読みたい記事*/
#post-relation {
margin: 3em 0 3em;
border: 2px solid #F1A155;
padding: 0 1em 0.5em 1em;
background-color: #FFFDF9;
border-radius: 4px;
text-align: center;
}
[id*="col"] #post-relation h3,
[id*="col"] #post-relation .pr-head {
background: none;
border: none;
border-radius: 0;
text-shadow: none;
box-shadow: none;
position: relative;
padding: 0.5em 0.8em 0.5em 1em;
margin: 0;
display: inline-block;
color: #4F594D;
font-size: 1.1em;
letter-spacing: 0.2em;
line-height: 1;
background-color: #F28800;
color: #fff;
top: -1em;
border-radius: 4px;
}
[id*="col"] #post-relation h3 span,
[id*="col"] #post-relation .pr-head span {
background: none;
border: none;
border-radius: 0;
text-shadow: none;
box-shadow: none;
margin: 0;
padding: 0;
}
[id*="col"] #post-relation h3::before,
[id*="col"] #post-relation h3::after,
[id*="col"] #post-relation .pr-head::before,
[id*="col"] #post-relation .pr-head::after {
background: none;
border: none;
border-radius: 0;
margin: 0;
padding: 0;
left: auto;
right: auto;
}
#post-relation ul {
margin: -0.5em 0 0 0;
padding: 0;
text-align: left;
}
#post-relation li {
list-style-image: none;
list-style-type: none;
background: none;
margin: 0;
padding: 0;
}
#post-relation li::before,#post-relation li::after {
display: none;
}
#post-relation li a {
    display: block;
position: relative;
padding: 0.6em 0 0.5em 1em;
font-size: 1em;
line-height: 1.7;
color: #0000ff;
text-decoration: underline;
}
#post-relation li a:hover {
    color: #F30;
}
#post-relation li:not(:last-child) a {
border-bottom: 1px dashed #EAAC3A;
}
#post-relation li a::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 1.15em;
    width: 0;
    height: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    border-top: 8px solid #F28800;
    border-left: 8px solid transparent;
}
/*参照記事*/
#post-quote {
margin: 3em 0 3em;
border: 2px solid #DCC291;
padding: 0 1em 0.5em 1em;
background-color: #FFFDF9;
border-radius: 4px;
text-align: center;
}
[id*="col"] #post-quote h3,
[id*="col"] #post-quote .pq-head {
background: none;
border: none;
border-radius: 0;
text-shadow: none;
box-shadow: none;
position: relative;
padding: 0.5em 0.5em 0.5em 1em;
margin: 0;
display: inline-block;
color: #fff;
font-size: 1.1em;
letter-spacing: 0.5em;
line-height: 1;
background-color: #895B02;
top: -1em;
border-radius: 4px;
}
[id*="col"] #post-quote h3 span,
[id*="col"] #post-quote .pq-head span {
background: none;
border: none;
border-radius: 0;
text-shadow: none;
box-shadow: none;
margin: 0;
padding: 0;
}
[id*="col"] #post-quote h3::before,
[id*="col"] #post-quote h3::after,
[id*="col"] #post-quote .pq-head::before,
[id*="col"] #post-quote .pq-head::after {
background: none;
border: none;
border-radius: 0;
margin: 0;
padding: 0;
left: auto;
right: auto;
}
#post-quote ul {
margin: -0.5em 0 0 0;
padding: 0;
text-align: left;
}
#post-quote li {
list-style-image: none;
list-style-type: none;
background: none;
margin: 0;
padding: 0;
}
#post-quote li::before,#post-quote li::after {
display: none;
}
#post-quote li a {
    display: block;
position: relative;
padding: 0.6em 0 0.5em 1em;
font-size: 1em;
line-height: 1.7;
color: #0000ff;
text-decoration: underline;
}
#post-quote li a:hover {
    color: #F30;
}
#post-quote li:not(:last-child) a {
border-bottom: 1px dashed #ccc;
}
#post-quote li a::after {
    content: "";
    display: block;
    position: absolute;
    left: 2px;
    top: 1.25em;
    width: 6px;
    height: 6px;
border-radius: 2px;
background-color: #895B02;
}
#post-relation p,
#post-quote p {
text-align: left;
}
#post-relation p:nth-of-type(1),
#post-quote p:nth-of-type(1) {
margin: 0 0 1em 0;
}
#post-relation p:nth-last-of-type(1),
#post-quote p:nth-last-of-type(1) {
margin-bottom: 0.5em;
}
/*
========== 口コミ枠 ==========
*/
.sec-kuchikomi {
margin: 40px 0;
border: 1px solid #DCC291;
}
[class^="kuchikomi-"] {
padding: 20px 20px;
border-bottom: 1px solid #DCC291;
}
[class^="kuchikomi-"] p:last-of-type {
margin-bottom: 0;
}
.sec-kuchikomi [class^="kuchikomi-"]:last-of-type {
border-bottom: none;
}
.kuchikomi-a {
background: rgba(221,239,151,.15);
}
.kuchikomi-b {
background-color: #FFFDF8;
}
#contents .sec-kuchikomi h5 {
background: none;
/*padding-left: 0;*/
padding: 3px 0px 0px 6px;
position: relative;
margin-bottom: 5px;
}
#contents .sec-kuchikomi h5:before {
content: "";
position: absolute;
/*left: -31px;*/
left: -21px;
top: 10px;
width: 21px;
height: 10px;
}
#contents .kuchikomi-a h5:before {
background: #63A24D;
}
#contents .kuchikomi-b h5:before {
background: #F69718;
}
/*
========== もくじデザイン ==========
*/
.mokuji ol,.mokuji dt,.mokuji dd,
#index_wrapper ul{
margin: 0;
padding: 0;
overflow: visible;/*再適用対策*/
}
/*#index_inner > ul:nth-of-type(1){
margin-top: -0.25em;
}*/
.mokuji li,
#index_wrapper li{
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
.mokuji,
#index_wrapper{
margin: 3em 1em 2.5em;
padding: 0.5em 1em 0.5em;
border: 2px solid #997653;
border-radius: 4px;
background: #FFFDF8;
}
.mokuji dt,
#index_wrapper .title{
font-size: 1.25em;
font-weight: bold;
background: #fff;
display: inline-block;
padding: 0.5em 1em;
position: relative;
top: -1.5em;
left: 50%;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
background: #997653;
color: #fff;
border-radius: 4px;
margin: 0;/*再適用対策*/
border: 0;
line-height: inherit;
}
.mokuji dd {
margin-top: -1.25em;
}
.mokuji ol,
#index_wrapper ul{
counter-reset: li;
}
.mokuji li,
#index_wrapper li{
counter-increment: li;
margin:  .5em 0 .5em 1em;
position: relative;
line-height: 1.5;
}
.mokuji li li:last-child,
#index_wrapper li li:last-child{
margin-bottom: 0;
}
.mokuji li:not(:last-child),
#index_wrapper li:not(:last-child){
border-bottom: 1px dashed #aaa;
padding-bottom: 0.5em;
}
.mokuji li li:not(:last-child),
#index_wrapper li li:not(:last-child){
border-bottom: none;
padding-bottom: 0;
}
.mokuji-desgin01 a,.mokuji-desgin01 span,
#index_wrapper ul a{
display: block;
position: relative;
padding: .25em .5em .25em .5em;
margin-left: .75em;
background: #FFFDF8;
text-decoration: none;
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out;
z-index: 3;
}
.mokuji-desgin01 a,
#index_wrapper ul a{
color: #004EFF;
}
.mokuji-desgin01 a:hover,
#index_wrapper ul a:hover{
color: #ff0000;
}
.mokuji-desgin01 li::before,
#index_wrapper ul li::before{
content: counters(li, "-");
background: #997653;
border-radius: 1.7em;
width: 1.7em;
height: 1.7em;
line-height: 1.75em;
text-align: center;
font-weight: bold;
color: #fff;
position: absolute;
left: -1em;
top: 0.1em;
font-family: 'Times New Roman',sans-serif;
z-index: 2;
}
.mokuji li li,
#index_wrapper li li{
margin-left: 1em;
}
.mokuji li li::before,
#index_wrapper li li::before{
margin-left: 0;
content: "";
padding: 0;
width: 100%;
height: 1px;
position: absolute;
left: -1.2em;
top: 50%;
}
.mokuji-desgin01 li::after{
}
.mokuji-desgin01 li li::after,
#index_wrapper ul li li::after{
content: "";
background: #997653;
width: 1px;
height: 128%;
position: absolute;
left: -1.2em;
top: -1em;
z-index: 1;
}
.mokuji-desgin01 li li:last-child::after,
#index_wrapper ul li li:last-child::after{
height: 100%;
}
/*第一階層が2行になった場合の縦線対策。しかし第2階層で子がひとつで2行の場合はブチ抜きになってしまうので、仕方なくコメントアウトにする*/
.mokuji-desgin01 li li:first-child::after,
#index_wrapper ul li li:first-child::after{
top: -2.2em;
height: 200%;
}
/*もくじ折りたたみ用の追加設定分*/
.nav-toggle_mj .toggle-cont_mj {
display: none;
}
.showmore {
display: block;
cursor: pointer;
}
.btn_mj {
margin: 0 0 0.5em 0;
letter-spacing: 0.5em;
text-decoration: none;
display: block;
text-align: center;
font-size: 1em;
font-weight: bold;
text-shadow: 1px 1px 0 #ffffff;
color: #444;
padding: 0.5em;
border: 1px solid #cccccc;
border-radius: 4px;
cursor: pointer;
background: -webkit-linear-gradient(top, #ffffff, #eeeeee);
background: linear-gradient(to bottom, #ffffff, #eeeeee);
box-shadow: inset 0 0 1px #cccccc;
position:  relative;
z-index: 2;
}
.btn_mj:hover {
background: -webkit-linear-gradient(top, #eeeeee, #ffffff);
background: linear-gradient(to bottom, #eeeeee, #ffffff);
box-shadow: inset 1px 1px 0 #ffffff;
}
.toggle-cont_mj ol {
counter-reset: lii 4;
}
.toggle-cont_mj li {
counter-increment: lii;
}
.toggle-cont_mj .mokuji-desgin01 li::before{
content: counters(lii, "-");
}
.nav-toggle_mj li {
border-bottom: 1px dashed #aaa;
padding-bottom: 0.5em;
}
.nav-toggle_mj li li,
.nav-toggle_mj .toggle-cont_mj li:last-child {
border-bottom: none;
padding-bottom: 0;
}
/* SIRIUS目次機能における表示・非表示の切り替え */
#index_inner {
position: relative;
}
#index_button {
position: absolute;
top: 1.5em;
left: 50%;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
z-index: 2;
cursor: pointer;
}
#index_inner ul,
#index_inner ol {
    opacity: 1;
}
#index_button>span::before {
    content: "非表示";
    color: #004EFF;
}
#index_button span span {
    display: none;
}
#index_button::before {
    content: "[";
    padding-right: 3px;
}
#index_button::after {
    content: "]";
    padding-left: 3px;
}
#index_panel:checked+#index_button>span::before {
    content: "表示";
}
#index_panel[type="checkbox"] {
    display: none;
}
#index_panel:checked~ul,
#index_panel:checked~ol {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0 !important;
    transition: 0.8s;
/*margin-top: -0.3em !important;*/
}
/*テーブル下の注釈用スタイル*/
.tablshita {
font-size:12px;
color:#676767;
margin-top: -3px;
padding-bottom: 10px;
}
.tablshita p {
line-height: 15px;
margin-bottom: 7px;
}
/*テーブル下の注釈用スタイルここまで*/
.text .reference {
display: inline-block;
background: url(img/h6.gif) left 0.2em no-repeat;
}
/*
==================================================
関連記事リスト
==================================================
*/
.area-relpost {
margin: 2em 0;
}
.sec-relpost {
margin-bottom: 1em;
}
.item-rel {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 1em;
border: 1px solid #ccc;
color: inherit;
text-decoration: none;
}
.item-rel:hover {
color: inherit;
background-color: #FFFCE9;
}
.item-image-rel {
width: 30%;
max-width: 150px;
margin: 0 1em 0 0;
}
.item-image-rel img {
width: 100%;
height: auto;
vertical-align: top;
}
.item-text-rel {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
    -ms-flex: 1;
flex: 1;/*flex-grow: 1;flex-shrink: 1;flex-basis: 0;のこと（初期値はflex: 0 1 auto）*/
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.itr-ttl {
margin: 0;
padding: 0;
font-size: 1.2em;
font-weight: 700;
line-height: 1.3;
}
.itr-ttl span {
padding: 0.2em 0.4em;
font-size: 0.7em;
color: #fff;
border-radius: 2px;
font-weight: 700;
margin: 0 0.4em 0.2em 0;
display: inline-block;
}
.itr-grn {
background-color: #558B2F;
}
.itr-blu {
background-color: #0277BD;
}
.itr-org {
background-color: #FB8C00;
}
.itr-pnk {
background-color: #F06292;
}
.itr-bwn {
background-color: #795548;
}
.itr-blk {
background-color: #2b2b2b;
}
.item-rel p {
line-height: 1.5;
margin: 0.8em 0 0 0;
}
@media screen and (min-width: 640px){
.item-image-rel {
width: 150px;
}
.itr-ttl span {
padding: 0.3em 0.5em;
font-size: 0.8em;
}
}
/*
========== SNSボタン ==========
*/
/*初期設定クリア*/
[class^="sns-button"] {
margin: 0;
padding: 0;
}
[class^="sns-button"] li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
[class^="sns-button"] li::before {
display: none;
}
/*SVGスプライト*/
.sns-icons {
display: none;
}
/*モバイルファースト：SNSボタン小からベース*/
[class^="sns-button"] {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 1em 0;
}
[class^="sns-button"] li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex: 1 0 33.333%;
/*初期値：flex: 0 1 auto;*/
/*flex-growに1を指定して、親要素の幅に余りがある場合、flexアイテムに等分に幅が追加*/
/*flex-shrinkに0を指定して、flexアイテムが%以下にならないように*/
/*flex-basisでベースの幅を300pxに指定*/
/*均等にしたい*/
/*width: calc(100% / 6);
-webkit-flex-basis: calc(100% / 6);
-ms-flex-preferred-size: calc(100% / 6);
flex-basis: calc(100% / 6);*/
}
[class^="sns-button"] a {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
line-height: 1;
text-decoration: none;
color: #fff;
margin: 0.2em;
padding: 0.1em 0.5em;
border-radius: 4px;
transition: all 0.3s ease;
/*グレーボタン用*/
text-shadow: 0 1px rgba(255, 255, 255, 0.7);
color: inherit;
border: 1px solid;
border-color: #bababa #b6b6b6 #a5a5a5;
background-image: -webkit-linear-gradient(top, white, #dedede);
background-image: linear-gradient(to bottom, white, #dedede);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.06);
}
/*グレーボタン用*/
[class^="sns-button"] a:hover {
background: #dedede;
border-color: #b4b4b4 #b4b4b4 #a5a5a5;
background-image: -webkit-linear-gradient(top, #e1e1e1, #f8f8f8);
background-image: linear-gradient(to bottom, #e1e1e1, #f8f8f8);
}
[class^="sns-button"] svg {
width: 28px;
height: 28px;
fill: #000;
}
[class^="sns-button"] span {
display: none;
}
.sb-facebook svg {
fill: #3B5998;
}
.sb-twitter svg {
fill: #1DA1F2;
}
.sb-hatebu svg {
fill: #00A4DE;
}
.sb-googleplus svg {
fill: #DC4E41;
}
.sb-pocket svg {
fill: #EF3F56;
}
.sb-line svg {
fill: #00C300;
}
/*SNSボタン大*/
.sns-button-large {
margin: 3em 0;
}
.sns-button-large svg {
width: 36px;
height: 36px;
}
@media screen and (min-width: 640px){
[class^="sns-button"] {
-ms-flex-wrap: nowrap;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
[class^="sns-button"] li {
flex: 0 1 100%;
}
[class^="sns-button"] a {
margin:  0 0.2em;
}
}
/*
========== グーグルアドセンス：レクタングル大 ==========
*/
.gad-rectgl-big {
margin: 2em 0;
}
.gad-rectgl-big div {
text-align: center;
margin-bottom: 1em;
}
@media screen and (min-width: 768px) {
.gad-rectgl-big {
margin: 2em 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
#cont_text .gad-rectgl-big {
margin: 2em -12px;/*サイトにより-12pxは要調整必要アリ*/
}
.gad-rectgl-big div {
text-align: left;
margin: 0 5px;
}
}
/*
========== アドセンスリンクユニット風ボタン ==========
*/
/*初期設定クリア*/
[class^="adlink-unit-btn"] {
margin: 0;
padding: 0;
}
[class^="adlink-unit-btn"] li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
[class^="adlink-unit-btn"] li::before {
display: none;
}
.area-adlink-unit-btn {
margin: 2em 0;
}
.adlink-unit-head {
font-size: 0.9em;
margin-bottom: 0.5em;
}
[class^="adlink-unit-btn"] li {
margin-bottom: 0.5em;
}
[class^="adlink-unit-btn"] a {
display: block;
line-height: 1;
padding: 0.5em 0.5em;
text-align: center;
border-radius: 2em;
text-decoration: none;
transition: all 0.3s ease;
box-shadow:0 2px 1px rgba(0,0,0,0.05), 0 2px 3px rgba(0,0,0,0.05), 0 4px 8px rgba(0,0,0,0.05);
}
[class^="adlink-unit-btn"] a:hover {
color: #fff;
box-shadow: inset 0 1px 0 rgba(256, 256, 256, 0.55), 1px 1px 3px rgba(0, 0, 0, .25);
}
[class^="adlink-unit-btn"] a:active {
box-shadow: inset 0 1px 3px rgba(0,0,0,0.2), 0 1px 0 #fff;
}
.adlink-unit-btn-blu a {
border: 1px solid #1976D2;
color: #0D47A1;
}
.adlink-unit-btn-blu a:hover {
background-color: #1976D2;
}
.adlink-unit-btn-grn a {
border: 1px solid #2E7D32;
color: #1B5E20;
}
.adlink-unit-btn-grn a:hover {
background-color: #2E7D32;
}
.adlink-unit-btn-bwn a {
border: 1px solid #744E02;
color: #4E342E;
}
.adlink-unit-btn-bwn a:hover {
background-color: #744E02;
}
@media screen and (min-width: 768px){
[class^="adlink-unit-btn"] {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -0.5em;
}
[class^="adlink-unit-btn"] li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
/*均等にしたい*/
width: calc(100% / 2 - 1em);
-webkit-flex-basis: calc(100% / 2 - 1em);
-ms-flex-preferred-size: calc(100% / 2 - 1em);
flex-basis: calc(100% / 2 - 1em);
margin: 0 0 0.5em 0.5em;
}
[class^="adlink-unit-btn"] a {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
}
/*
========== 新トップページ：スマホ版 ==========
*/
/*PC版のトップページhtmlテンプレート用のための追加設定*/
.toppage {
    box-sizing: border-box;
    word-wrap: break-word;
}
.toppage * , .toppage *::before, .toppage *::after {
    box-sizing: inherit;
    word-wrap: inherit;
}
body.toppage  {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: auto;
font-family: 'Roboto','Noto Sans JP',sans-serif;
    background: #fff;
    min-width: 0;
}
.toppage img {
vertical-align: middle;
max-width :100%;
height: auto;
}
#fixedTop {
text-decoration: none;
right: 10px;
bottom: 10px;
width: 40px;
height: 40px;
line-height: 40px;
color: #fff;
font-size: 16px;
text-align: center;
display: none;
background-color: rgba(121,77,0,0.8);
position: fixed;
z-index: 9999;
border-radius: 4px;
}
#fixedTop:hover {
transition: all 0.3s;
opacity: 0.7;
}
.header {
    border-top: 4px solid #000;
    background-color: #FAF7EE;
}
.header h1 {
    text-align: center;
    padding: 15px 0 15px;
}
.header h1 img {
    width: 70%;
    max-width: 320px;
}
.area-mv {
    text-align: center;
    background-color: #124530;
    border-bottom: 10px solid #744E02;
}
.area-mokuji {
    
}
.cgy-block {
    margin-bottom: 30px;
    position: relative;
    padding-top: 10px;
}
.cgy-block::after {
    content: "";
border: solid transparent;
position: absolute;
    border-width: 20px;
    margin-left: -20px;
left: 50%;
bottom: -40px;
}
.sec-check {
    /*border-top: 1px solid #E53935;*/
    border-bottom: 1px solid #E53935;
    background-color: #FFF2F2;
}
.sec-check::after {
border-top-color: #E53935;
}
.sec-inner {
    padding: 0 4%;
}
.sec-inner h2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    
    font-size: 20px;
    font-weight: 900;
    line-height: 1.3;
    letter-spacing: 0.2em;
    margin-bottom: 20px;
}
.sec-inner h2::before {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    
    content: "";
    display: block;
    margin: 0 10px -4px -5px;
}
.sec-check h2 {
    border-bottom: 4px solid #E53935;
}
.sec-check h2::before {
    width: 88px;
    height: 80px;
    background: url(img/bg-head-sec-check.png) no-repeat;
    background-size: 88px 80px;
}
.txt-red {
    color: #CD2024;
}
.txt-l1 {
font-size: 1.4em;
}
@media screen and (min-width: 375px){
.ml2em375 {
    margin-left: 2.45em;
}
}
@media screen and (min-width: 640px){
.ml2em375 {
    margin-left: 0;
}
.brsp {
    display: none;
}
}
[class^="item-list"] {
margin: 0;
padding: 0;
}
[class^="item-list"] li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
[class^="item-list"] li::before {
display: none;
}
.item-list1 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -4%;
}
.item-list1 li {
width: calc(100% / 2 - 4%);
-webkit-flex-basis: calc(100% / 2 - 4%);
-ms-flex-preferred-size: calc(100% / 2 - 4%);
flex-basis: calc(100% / 2 - 4%);
margin: 0 0 20px 4%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.item-list1 li a {
padding: 10px;
background-color: #fff;
box-shadow: 0 0 4px rgba(55,71,79,0.2);
    text-decoration: none;
    color: #000;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
    
    -webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
flex-direction: column;
webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
    
    transition: all 0.5s ease;
}
.item-img-il1 {
text-align: center;
    overflow: hidden;
}
.item-txt-il1 {
margin-top: 10px;
line-height: 1.5;
    font-size: 14px;
}
.item-list1 li a img {
transition: all 0.5s ease;
}
.item-list1 li a:hover {
    color: #fff;
}
.item-list1 li a:hover img {
    /*filter: blur(3px) brightness(1.1) grayscale(100);*/
    transform: scale(1.1);
}
.sec-check .item-list1 {
display: block;
margin-left: 0;
}
.sec-check .item-list1 li {
width: auto;
margin: 0 0 20px 0;
display: block;
}
.sec-check .item-list1 li a {
display: block;
}
.sec-check li a:hover {
    background-color: #E53935;
}
.sec-baikyaku {
    border-top: 1px solid #039BE5;
    border-bottom: 1px solid #039BE5;
    background-color: #F2FBFF;
}
.sec-baikyaku::after {
border-top-color: #039BE5;
}
.sec-baikyaku h2 {
    border-bottom: 4px solid #039BE5;
}
.sec-baikyaku h2::before {
    width: 111px;
    height: 80px;
    background: url(img/bg-head-sec-baikyaku.png) no-repeat;
    background-size: 111px 80px;
}
.brsp375 {
    display: none;
}
@media screen and (min-width: 375px){
.brsp375 {
    display: block;
}
}
@media screen and (min-width: 640px){
.brsp375 {
    display: none;
}
}
.sec-baikyaku li a:hover {
    background-color: #039BE5;
}
.sec-katsudo {
    border-top: 1px solid #FFCA28;
    border-bottom: 1px solid #FFCA28;
    background-color: #FFFCF2;
}
.sec-katsudo::after {
border-top-color: #FFCA28;
}
.sec-katsudo h2 {
    border-bottom: 4px solid #FFCA28;
}
.sec-katsudo h2::before {
    width: 111px;
    height: 80px;
    background: url(img/bg-head-sec-katsudo.png) no-repeat;
    background-size: 111px 80px;
}
.sec-katsudo li a:hover {
    background-color: #FFCA28;
}
.sec-urenai {
    border-top: 1px solid #00897B;
    border-bottom: 1px solid #00897B;
    background-color: #F2FFFE;
}
.sec-urenai::after {
border-top-color: #00897B;
}
.sec-urenai h2 {
    border-bottom: 4px solid #00897B;
}
.sec-urenai h2::before {
    width: 72px;
    height: 80px;
    background: url(img/bg-head-sec-urenai.png) no-repeat;
    background-size: 72px 80px;
}
.sec-urenai li a:hover {
    background-color: #00897B;
}
.sec-chuui {
    border-top: 1px solid #FB8C00;
    border-bottom: 1px solid #FB8C00;
    background-color: #FFF9F2;
}
.sec-chuui::after {
border-top-color: #FB8C00;
}
.sec-chuui h2 {
    border-bottom: 4px solid #FB8C00;
}
.sec-chuui h2::before {
    width: 108px;
    height: 80px;
    background: url(img/bg-head-sec-chuui.png) no-repeat;
    background-size: 108px 80px;
}
.sec-chuui li a:hover {
    background-color: #FB8C00;
}
.sec-senmon {
    border-top: 1px solid #8E24AA;
    border-bottom: 1px solid #8E24AA;
    background-color: #FCF2FF;
}
.sec-senmon::after {
border-top-color: #8E24AA;
}
.sec-senmon h2 {
    border-bottom: 4px solid #8E24AA;
}
.sec-senmon h2::before {
    width: 106px;
    height: 80px;
    background: url(img/bg-head-sec-senmon.png) no-repeat;
    background-size: 106px 80px;
}
.sec-senmon li a:hover {
    background-color: #8E24AA;
}
.sec-column {
    border-top: 1px solid #7CB342;
    border-bottom: 1px solid #7CB342;
    background-color: #F9FFF2;
}
.sec-column::after {
border-top-color: #7CB342;
}
.sec-column h2 {
    border-bottom: 4px solid #7CB342;
}
.sec-column h2::before {
    width: 130px;
    height: 80px;
    background: url(img/bg-head-sec-column.png) no-repeat;
    background-size: 130px 80px;
}
.sec-column li a:hover {
    background-color: #7CB342;
}
.sec-other {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background-color: #FAF7EE;
    padding-top: 10px;
}
[class^="sec-other-list"] {
margin-bottom: 20px;
}
[class^="sec-other-list"] h2 {
    border-bottom: 4px solid #595757;
    letter-spacing: 0.1em;
}
[class^="sec-other-list"] h2::before {
    margin: 0 10px 5px 0;
}
.sec-other-list-nayami h2::before {
    background: url(img/bg-head-sec-nayami.png) no-repeat;
    width: 59px;
    height: 60px;
    background-size: 59px 60px;
}
.sec-other-list-riyuu h2::before {
    background: url(img/bg-head-sec-riyuu.png) no-repeat;
    width: 77px;
    height: 60px;
    background-size: 77px 60px;
}
[class^="sec-other-list"] .item-list2 {
padding: 12px 15px 12px 15px;
background-color: #fff;
box-shadow: 0 0 4px rgba(55,71,79,0.2);
}
.item-list2 li a {
display: block;
padding: 10px 10px 10px 15px;
    text-decoration: none;
    color: #000;
line-height: 1.5;
font-size: 15px;
position: relative;
}
.item-list2 li:not(:last-child) a {
border-bottom: 1px solid #ddd;
}
.item-list2 li a::before {
content: "";
display: block;
position: absolute;
left: 0;
top: 50%;
margin-top: -4px;
width: 0;
height: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
border-top: 8px solid #cd2024;
border-left: 8px solid transparent;
}
.item-list2 li a:hover {
background-color: rgba(0,0,0,0.05)
}
/*トップページフッター*/
.foot-cont-wrap {
    background: url(img/bg-foot-cont-wrap-sp.jpg) no-repeat;
    background-size: contain;
    background-position: center bottom;
    padding-bottom: 10px;
}
.foot-cont1 {
    border-bottom: 1px solid #ccc;
    background-color: #f9f9f9;
margin-bottom: 30px;
}
.foot-cont1 div:not(:last-child) {
border-bottom: 1px solid #ccc;
}
.foot-cont1 div {
    padding: 20px 4%;
}
.foot-cont1 h2 {
    font-size: 18px;
    letter-spacing: 0.1em;
    font-weight: 700;
    margin-bottom: 10px;
}
.foot-cont1 .item-list2 {
    margin-left: 0.5em;
}
.foot-cont2 h2 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
font-size: 18px;
margin-bottom: 20px;
    font-weight: 700;
}
.foot-cont2 h2::before,.foot-cont2 h2::after {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex: 1;
    flex-grow: 1;
content: "";
border-top: 3px solid #CD2024;
}
.foot-cont2 h2::before {
    margin-right: 0.5em;
}
.foot-cont2 h2::after {
    margin-left: 0.5em;
}
.foot-cont2 ul {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -4%;
padding: 0 4%;
}
.foot-cont2 li {
width: calc(100% / 2 - 4%);
-webkit-flex-basis: calc(100% / 2 - 4%);
-ms-flex-preferred-size: calc(100% / 2 - 4%);
flex-basis: calc(100% / 2 - 4%);
margin: 0 0 20px 4%;
}
.foot-cont2 li a {
position: relative;
display: block;
}
.foot-cont2 li a::before {
-webkit-transition: 0.3s;
transition: 0.3s;
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
border: 0px solid #fff;
background-color: rgba(0,0,0,0);
}
.foot-cont2 li a:hover::before {
border: 3px solid #C69E75;
width: 100%;
height: 100%;
background-color: rgba(255,255,0,0.2)
}
.foot-utility-nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.foot-utility-nav li {
   display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    width: 50%;
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50;
    box-shadow: 0 0 0 1px #4D3300;
}
.foot-utility-nav a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
   -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    
    webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 1em;
    text-align: center;
    font-size: 13px;
    line-height: 1.4;
    text-decoration: none;
    color: #fff;
    background-color: #744E02;
}
.copyright {
color: #fff;
background-color: #000;
text-align: center;
font-size: 12px;
padding: 10px;
}
/*
========== 新トップページ：PC版 ==========
*/
@media screen and (min-width: 768px){
#fixedTop {
text-decoration: none;
right: 20px;
bottom: 20px;
width: 50px;
height: 50px;
line-height: 50px;
font-size: 20px;
}
.header {
    border-top: 5px solid #000;
}
.header h1 {
    padding: 25px 0 30px;
}
.header h1 img {
    width: auto;
    max-width: none;
}
.area-mv {
    border-bottom: 20px solid #744E02;
}
.cgy-block {
    margin-bottom: 100px;
    padding-top: 20px;
    padding-bottom: 10px;
}
.cgy-block::after {
    border-width: 70px;
    margin-left: -70px;
bottom: -140px;
}
.sec-inner {
    padding: 0;
    max-width: 960px;
width: 100%;/* コンテンツ内容が少ない場合でも拡がるように */
margin: 0 auto;
}
.sec-inner h2 {
    font-size: 40px;
    margin-bottom: 40px;
}
.sec-inner h2::before {
    margin: 0 20px -10px 0;
}
.sec-check h2 {
    border-bottom: 10px solid #E53935;
}
.sec-check h2::before {
    width: 154px;
    height: 140px;
    background-size: 154px 140px;
}
.item-list1 {
margin-left: -30px;
}
.item-list1 li {
width: calc(100% / 3 - 30px);
-webkit-flex-basis: calc(100% / 3 - 30px);
-ms-flex-preferred-size: calc(100% / 3 - 30px);
flex-basis: calc(100% / 3 - 30px);
margin: 0 0 30px 30px;
}
.item-list1 li a {
padding: 15px;
}
.item-txt-il1 {
    font-size: 18px;
    line-height: 1.6;
}
.sec-check .item-list1 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -40px;
}
.sec-check .item-list1 li {
width: calc(100% / 2 - 40px);
-webkit-flex-basis: calc(100% / 2 - 40px);
-ms-flex-preferred-size: calc(100% / 2 - 40px);
flex-basis: calc(100% / 2 - 40px);
margin: 0 0 30px 40px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.sec-check .item-list1 li a {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
    padding: 10px;
}
.sec-baikyaku h2 {
    border-bottom: 10px solid #039BE5;
}
.sec-baikyaku h2::before {
    width: 195px;
    height: 140px;
    background-size: 195px 140px;
}
.sec-katsudo h2 {
    border-bottom: 10px solid #FFCA28;
}
.sec-katsudo h2::before {
    width: 194px;
    height: 140px;
    background-size: 194px 140px;
}
.sec-urenai h2 {
    border-bottom: 10px solid #00897B;
}
.sec-urenai h2::before {
    width: 126px;
    height: 140px;
    background-size: 126px 140px;
}
.sec-chuui h2 {
    border-bottom: 10px solid #FB8C00;
}
.sec-chuui h2::before {
    width: 188px;
    height: 140px;
    background-size: 188px 140px;
}
.sec-senmon h2 {
    border-bottom: 10px solid #8E24AA;
}
.sec-senmon h2::before {
    width: 186px;
    height: 140px;
    background-size: 186px 140px;
}
.sec-column h2 {
    border-bottom: 10px solid #7CB342;
}
.sec-column h2::before {
    width: 227px;
    height: 140px;
    background-size: 227px 140px;
}
.sec-other {
padding-top: 20px;
}
.sec-other-list {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
    
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -40px;
    margin-bottom: 0;
}
.sec-other-list [class^="sec-other-list"] {
width: calc(100% / 2 - 40px);
-webkit-flex-basis: calc(100% / 2 - 40px);
-ms-flex-preferred-size: calc(100% / 2 - 40px);
flex-basis: calc(100% / 2 - 40px);
margin: 0 0 40px 40px;
}
[class^="sec-other-list"] h2 {
    border-bottom: 5px solid #595757;
    letter-spacing: 0.1em;
    font-size: 30px;
}
[class^="sec-other-list"] h2::before {
    margin: 0 10px 5px 0;
}
.sec-other-list-nayami h2::before {
    width: 78px;
    height: 80px;
    background-size: 100% auto;
    margin-top: 0;
}
.sec-other-list-riyuu h2::before {
    width: 102px;
    height: 80px;
    background-size: 100% auto;
}
[class^="sec-other-list"] .item-list2 {
padding: 20px 25px 20px 25px;
}
.item-list2 li a {
font-size: 16px;
}
/*トップページフッター*/
.foot-cont-wrap {
    backgroundimage: url(img/bg-foot-cont-wrap-pc.jpg);
    background-size: cover;
    padding-bottom: 80px;
}
.foot-cont-inner {
   max-width: 960px;
    width: 100%;
    margin: 0 auto;
}
.foot-cont1 {
    border-bottom: none;
    background-color: transparent;
margin-bottom: 100px;
    
    display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
    
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -40px;
}
.foot-cont1 div:not(:last-child) {
border-bottom: none;
}
.foot-cont1 div {
    padding: 40px 0 0;
    
    width: calc(100% / 2 - 40px);
-webkit-flex-basis: calc(100% / 2 - 40px);
-ms-flex-preferred-size: calc(100% / 2 - 40px);
flex-basis: calc(100% / 2 - 40px);
margin: 0 0 0 40px;
}
.foot-cont1 h2 {
    font-size: 20px;
    margin-bottom: 20px;
}
.foot-cont1 .item-list2 {
    margin-left: 1em;
}
.foot-cont2 h2 {
font-size: 28px;
margin-bottom: 30px;
}
.foot-cont2 h2::before,.foot-cont2 h2::after {
border-top: 4px solid #CD2024;
}
.foot-cont2 h2::before {
    margin-right: 0.5em;
}
.foot-cont2 h2::after {
    margin-left: 0.5em;
}
.foot-cont2 ul {
margin-left: -30px;
padding: 0;
}
.foot-cont2 li {
width: calc(100% / 3 - 30px);
-webkit-flex-basis: calc(100% / 3 - 30px);
-ms-flex-preferred-size: calc(100% / 3 - 30px);
flex-basis: calc(100% / 3 - 30px);
margin: 0 0 30px 30px;
}
.foot-utility-nav {
display: block;
    background-color: #744E02;
    padding: 30px 0;
    text-align: center;
}
.foot-utility-nav li {
    width: auto;
box-shadow: none;
    display: inline-block;
line-height: 2;
}
.foot-utility-nav li + li::before {
content: '|';
display: inline-block;
margin: 0 1em 0 1em;
    color: #fff;
}
.foot-utility-nav a {
display: inline;
padding: 0;
text-align: left;
font-size: 14px;
    background-color: transparent;
}
}
/*タイムスタンプここから*/
.pubtime,.text .pubtime {
text-align: right;
color: #888;
font-size: 14px;
margin: -1.6em 0 0 0
}
/*タイムスタンプここまで*/
/*カテゴリトップ用スタイル*/
.text #sec_categorylist h3{
    margin-top: 0;
}
/*カテゴリトップ用スタイルここまで*/
/*建ぺい率テーブル*/
.kenpei {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
margin: 10px auto;
}
.kenpei th {
border: 1px solid #7a5202;
background-color: #fbf1e1;
padding: 0.5em 0.5em 0.4em 0.5em;
line-height: 1.5;
text-align: center;
font-size: 12px;
}
.kenpei td {
border: 1px solid #7a5202;
padding: 0.5em 0.5em 0.4em 0.5em;
background-color: #ffffff;
line-height: 1.5;
word-wrap: break-word;
word-break: break-all;
text-align: center;
font-size: 12px;
}
/*建ぺい率テーブルここまで*/
/*レスポンシブ仕様*/
.nav-global {
display: none;
}
@media screen and (min-width: 769px){
#headbar.is-fixed,#hb-menu {
display: none;
}
#header {
border-top: 4px solid #624202;
border-bottom: 4px solid #624202;
}
#h-inner {
max-width: 1100px;
    margin: 0 auto;
}
#header #logo {
padding: 20px 10px;
text-align: left;
}
#header #logo img {
width: auto;
max-width: none;
}
/*
========== グローバルナビ ==========
*/
/*初期設定クリア*/
[class^="gnav"] {
margin: 0;
padding: 0;
}
[class^="gnav"] li {
margin: 0;
padding: 0;
list-style-image: none;
list-style-type: none;
background: none;
line-height: 1;
}
[class^="gnav"] li::before {
display: none;
}
/*モバイルファースト：SNSボタン小からベース*/
.nav-global {
    display: block;
    background-color: #744E02;
}
[class^="gnav"] {
display: flex;
    max-width: 1100px;
    margin: 0 auto;
    border-right: 1px solid #B2904E;
    border-left: 1px solid #624202;
    border-top: 1px solid #624202;
}
[class^="gnav"] li {
border-left: 1px solid #B2904E;
    border-right: 1px solid #624202;
}
[class^="gnav"] li {
flex: 0 1 100%;
}
[class^="gnav"] a {
display: flex;
justify-content: center;
align-items: center;
flex-grow: 1;
line-height: 1;
text-decoration: none;
color: #fff;
padding: 0.8em 0.5em;
transition: all 0.3s ease;
background-image: linear-gradient(to bottom, #895B02, #744E02);
}
[class^="gnav"] a:hover {
background: #FAF7EE;
    color: #111;
}
body {
    background-image: url(img/bg-body.gif);
}
.lyt-pc {
display: flex;
justify-content: space-between;
}
#contents {
max-width: 1100px;
padding: 20px 15px 1px 15px;
margin: 0 auto;
}
#col_mainarea {
margin-right: 15px;
width: 700px;
}
#col_subarea {
     min-width: 300px;
     max-width: 340px;
}
.text {
margin-left: 30px;
}
h1 {
    font-size: 24px !important;
}
h2,h3,h4,.h3other {
    font-size: 22px !important;
}
.text h2,.text h3,.text h4,.text .h3other {
    margin-left: -30px !important;
}
#siteNavi {
    margin: 0;
    border-bottom: none;
    padding: 0 0 15px;
}
.nav-popular {
margin: 2em 0;
}
[id^="space"] > br:first-child {
display: none;
}
#sec_categorylist h2 a {
color: #333;
    text-decoration: none;
}
/*マンション売却の達人用*/
.text #sec_categorylist {
margin-left: -30px;
}
.text #sec_categorylist h2,
.text #sec_categorylist h3 {
margin-left: 0 !important;
}
/*暮らしの達人グループサイト*/
#sec-gpsite {
margin: 30px auto;
max-width: 800px;
}
#sec-gpsite ul {
margin: 0 -20px 0 0;
padding: 0;
overflow: hidden;
}
#sec-gpsite li {
max-width: none;
margin: 0 20px 20px 0;
padding: 0;
line-height: 1;
float: left;
width: calc(50% - 20px);
}
}
@media screen and (min-width: 480px){
.page-nav > li:nth-child(2) + li::before {
content: '|';
margin: 0 0.5em;
}
}
@media screen and (max-width: 768px){
#sec_categorylist .gl_txt .more {
    display: none;
}
}
/*メディア系レスポンシブ対応*/
[class^="media-responsive"] {
position: relative;
height: 0;
overflow: hidden;
margin: 0 0 1.5em 0;
}
[class^="media-responsive"] iframe,
[class^="media-responsive"] object,
[class^="media-responsive"] embed,
[class^="media-responsive"] video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.media-responsive-169 {
padding-top: 56.25%;
}
.media-responsive-43 {
padding-top: 75%;
}
#area-map {
    padding-top: 43.86%;
border: 1px solid #ddd;
}
iframe[src*="youtube.com"] {
max-width: 100%;
}
.img-youtube-thumb {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
}
/*メディア系レスポンシブ対応ここまで*/
/*レスポンシブ用口コミスタイルここから*/
.uservoice {
margin: 0 0 3em 0;
}
.uservoice p {
margin-bottom: 1em;
    line-height: 1.8;
}
.uservoice p:last-child {
margin-bottom: 0;
}
.uservoice-list {
margin: 70px 0 0 0;
    border-radius: 4px;
    padding: 60px 1em 1em;
    position: relative;
}
.uservoice-list::before {
content: "";
    width: 100px;
    height: 100px;
    border-radius: 4px;
    position: absolute;
    left: calc(50% - 1px);
    top: -1px;
    transform: translate(-50%, -50%);
    background-size: 100px auto;
}
.uv-good::before {
    background-color: #43A047;
    background-image: url("img/bg-uv-good.png");
}
.uv-normal::before {
    background-color: #039BE5;
    background-image: url("img/bg-uv-normal.png");
}
.uv-bad::before {
    background-color: #F06292;
    background-image: url("img/bg-uv-bad.png");
}
.uv-good {
border: 2px solid #43A047;
    background-color: #F8FCFA;
}
.uv-normal {
border: 2px solid #039BE5;
    background-color: #F9FDFD;
}
.uv-bad {
border: 2px solid #F06292;
    background-color: #FFFAFB;
}
@media screen and (min-width: 769px){
.uservoice {
margin: 3em 0 3em 0;
}
.uservoice-list {
margin: 0 0 2em 50px;
    padding: 1.5em 1.5em 1.5em 60px;
    position: relative;
    min-height: 120px;
}
.uservoice-list::before {
    top: 50%;
    left: -1px;
}
}
/*レスポンシブ用口コミスタイルここまで*/