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

html {height: 100%; overflow-y: scroll;}
body {height: 100%;}

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

マージン

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

.mrg0 {margin: 0 !important;}
.mrgt0 {margin-top: 0 !important;}
.mrgt5 {margin-top: 5px !important;}
.mrgt10 {margin-top: 10px !important;}
.mrgt15 {margin-top: 15px !important;}
.mrgt20 {margin-top: 20px !important;}
.mrgt25 {margin-top: 25px !important;}
.mrgt30 {margin-top: 30px !important;}
.mrgt40 {margin-top: 40px !important;}
.mrgt50 {margin-top: 50px !important;}
.mrgt60 {margin-top: 60px !important;}
.mrgt70 {margin-top: 70px !important;}
.mrgl10 {margin-left: 10px !important;}
.mrgl15 {margin-left: 15px !important;}
.mrgl20 {margin-left: 20px !important;}
.mrgl25 {margin-left: 25px !important;}
.mrgl30 {margin-left: 30px !important;}
.mrgr10 {margin-right: 10px !important;}
.mrgr15 {margin-right: 15px !important;}
.mrgr20 {margin-right: 20px !important;}
.mrgb10 {margin-bottom: 10px !important;}
.mrgb50 {margin-bottom: 50px !important;}



.pdgt10 {padding-top: 10px !important;}
.pdgt15 {padding-top: 15px !important;}
.pdgt20 {padding-top: 20px !important;}
.pdgt25 {padding-top: 25px !important;}
.pdgt30 {padding-top: 30px !important;}
.pdgt40 {padding-top: 40px !important;}




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

フロート

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

.fl{
float:left;
}

.fr{
float:right;
}

.clear{
clear:both;
}


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

text 装飾

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

.black {
color:#333;

}

.red2 {
color:#f31616;
}

span.blue2 {
color:#3366CC;

}

.blue3 {
color:#009;

}
.bold, .b {
font-weight:bold;

}

.underline {
text-decoration:underline;

}

.highlight {
background-color:#FFFF00;

}

.level1 {
font-size:120%;
}



.level2 {
font-size:140%;

}

.level3 {
font-size:160%;

}

.level4 {
font-size:170%;

}

.smallfont {
font-size:90% !important;
line-height:1.8;
}

.smallfont a{
font-size:100% !important;
line-height:2;
}


.smallfont2 {
font-size:80%;
line-height:1.5;
}

.smallfont3 {
font-size:65%;
line-height:1.5;
}

span.star{
color:#F7BE0E;
}


li.star:before {
content: '\f006';
    font-family: FontAwesome;
    margin: 0 5px 0 -20px;
    font-size: 0.9em;
	color:#333;
}

li.star {
	list-style:none;
}

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

その他

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

.dspnone {
display:none;

}

.dspblck {
display:block;

}

/*--------------------------------------------------------
テーブル背景色
--------------------------------------------------------*/

.post-content .table {
  margin-bottom: 48px !important;
}

.post-content .spec {
  margin-bottom: 0px;
  width:100%;
}

.post-content .spec th {
  background:#C9DAF8;
  color: #333;
  width: 15%;
}

.post-content .spec td{
  width: 35%;
}

.post-content .spec50 {
  margin-bottom: 0px;
  width:100%;
}

.post-content .spec50 th {
  background:#eee;
  color: #333;
  width: 50%;
}

.post-content .spec50 td{
  width: 50%;
}


.post-content .spec-etc th {
  background:#fff2cc;
}

.post-content .spec-etc th.deep{
	background:#ffe599;
}

.post-content .spec-etc td {
  background:#ffffff;
}



/*.post-content .data{
  margin-bottom: 48px;
}*/

.post-content .data th{
  background:#cfe2f3;
}

.post-content .data th.deep,
.post-content .data td.deep
{
  background:#9fc5e8;
}


.post-content .data tr.nt1 td{
  background:#d9ead3;
}

.post-content .data tr.nt1 th{
  background:#fff2cc;
}

.post-content th.thb,
.post-content td.thb{
  background:#cfe2f3;
}

.post-content th.thr,
.post-content td.thr{
  background:#ead1dc;
}

.post-content th.thp,
.post-content td.thp{
  background:#d9d2e9;
}

.post-content th.thg,
.post-content td.thg{
  background:#d9ead3;
}

.post-content th.thy,
.post-content td.thy{
  background:#fff2cc;
}


.post-content th.tha,
.post-content td.tha{
  background:#f4cccc;
}

.post-content th.tho,
.post-content td.tho{
  background:#fce5cd;
}

.post-content th.ths,
.post-content td.ths{
  background:#c9daf8;
}

.post-content th.thn,
.post-content td.thn{
  background:#eeeeee;
}


.post-content th.black,
.post-content td.black {
background:#444;
color:#fff;
}

.post-content table.border-none,
.post-content table.border-none tr,
.post-content table.border-none th,
.post-content table.border-none td{
	border:none;
}


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

font変更 15/05/19

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

/*h1,#banner,.ba,.content,.content p,.content h2,.content h3,.content p.posted,.sidebar h2,.sidebar li,.link-note,#powered,
.top_cnt_ranking h3,.top_cnt_ranking h3 span, #iframe_cnt h3 span,#iframe_cnt h3 span*/

/* * {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Verdana, Geneva, Arial, Helvetica !important;
font-size:11pt !important;
} */
#rank_top table{
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Verdana, Geneva, Arial, Helvetica !important;
}

/* TOPページ */
dl.rank1 dd,
dl.rank2 dd,
dl.rank3 dd,
.smallfont {
font-size: 11pt !important;
}
.content h2{font-size:1.4em !important;}

/* TOPページ 下部ナビ */
.content h3 {
font-size: 14px !important;
}
.index_news_cnt h3 {
font-size: 18px !important;
}

/* サイド */
.sidebody1_side, .sidebody1_side a {
font-size: small !important;
font-family: none !important;
}

/* フッター */
#footer1 font,#footer1 font a {
font-size: 10px !important;
color: #000000;
}
#footer1 .smallfont3,#footer1 .smallfont3 a {
font-size: 10px !important;
}

/* h1 */
#banner h1 {
font-size: small !important;
}

/* h2 h3 */
.etc_news h3 {
font-size: 18px !important;
}
.kobetutitle2 h2 {
line-height: 1.6;
}

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

追加style 15/07～

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

/* 見出し
------------------------------------------------*/
/*.hd {
position: relative;
margin: 50px 0 25px;
background-color: #6661a2;
font-size: 20px !important;
font-weight: bold;
line-height: 1.6;
padding: 5px 10px;
}

.hd::after{
position: absolute;
top: 100%;
left: 30px;
content: '';
width: 0;
height: 0;
border: 10px solid transparent;
border-top: 15px solid #6661a2;
}*/



/*---------------------
.hd:before {
content: "■";
color: #090;
padding: 0 4px 0 0;
}
---------------------*/


/* 記事用style
------------------------------------------------*/
/*.ttl {border-left:8px #3bbee8 solid!important; margin: 2.5em 0 1.25em!important; padding-left:10px!important;font-size: 13pt !important; color: #000!important; font-weight: bold!important;}*/
.ttlbg {border:none; margin:0 0 15px; padding:0; font-size: 20px; font-weight: bold; background: #ccf0b1; color:#000;}
/*.hd {font-size: 20px !important; color: #ffffff;}*/
h5 { font-weight:bold;}
h5:before {content: "●"; color:#11b7c6;}
caption.top { caption-side:top;font-weight:bold;}
caption.top:before{content:"▼"; color:orange;}
caption.bottom {caption-side:bottom; font-size:0.8em!important;}
caption.right {text-align:right; display:table-caption;}
caption.left{text-align:left; display:table-caption;}
caption.center{text-align:center; display:table-caption;}
.post-content p.caption {margin-bottom:0; font-weight:bold;}
.content p {margin-bottom: 1.5em;line-height: 1.8;}
.bd-bg-grn {border:1px solid #333; background:#F8FFF5; padding: 0.5em; margin-bottom: 1.5em;}
.list-conts {list-style-position: inside; padding: 0 0.5em 1.5em;}
.ls-disc li {list-style-type: disc !important;}
.ls-decimel li {list-style-type: decimal !important;}
.ls-non { list-style: none!important;}
.ls-non li { margin-bottom: .5em;}
.overlayAdd__list ul li {list-style:none!important;}
.cta_bn { margin-bottom: 30px;}
#hyou { margin-bottom: 30px;}
.highlightb { background: linear-gradient(transparent 60%,#fff089 0%); font-weight: bold;color: #000;}
.highlightb2 { background: #dcc7e1; font-weight: bold;color: #000;}
.highlightb3 { background: #9fd9f6; font-weight: bold;color: #000;}
.bd-arw-fing {border:1px solid; margin:15px 0 15px 0; padding:5px;}
.bd-arw-fing img {vertical-align: text-top;}
.bd-arw-fing p{ margin-bottom: 0;}
.content a:link, .content a:visited, .content a:active { color: #000000;}

.bg_orange {
color: #fff;
    background-color: #7f8fde;
    padding: 1.5px 2px;
    margin: 0.5em 0.3em 0.5em 0em;
    border-radius: 2px;
    font-size: 0.8em;
    letter-spacing: 0.05em;
}



.ill { text-align:center; margin-bottom:1.6em;}
.ill img/*,.ill img.w100*/ { width: 340px; }
img.size-large { width:80%;}
img.size-middle { width:250px;}
img.cv-card {
	height:160px; 
	width:auto;    
	position: relative;
    z-index: 2;
}
img.cv-card-parts{
	width:240px;
}
img.cv-etccard{ width:100%;height:auto;}
.only-btn img.cv-card, 
.only-btn img.cv-etccard, 
.only-btn img.etc-card, 
.only-btn img.minions-copyright {display:none;}

.cta img.cv-card {
	margin: 0 0 10px;
}
a img.cv-card,
a img.cv-card-parts,
a img.etc-card{
    filter: drop-shadow(0px 3px 2px rgba(0,0,0,0.3));
}

.cta-left img.cv-card{
height: auto;
width: 240px;
position: relative;
z-index: 2;
}


.cta-left{
width: 280px;
text-align: center;
float: left;
}

.cta-right{
width: calc(100% - 280px);
}

.cta-left img.etc-card {
width: 130px;
margin: 0 0 -150px -110px;
}

@media screen and (max-width: 480px) {
	.cta-left img.cv-card{
		width:70%;
	}
	.cta-left{
		width:100%;
		float:none;
		margin-bottom: 15px;
	}
	.cta-right{
		width:100%;
	}
}
 /*=== 画像の表示エリア ================================= */
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 250px;
  height     : 170px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #fff;
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 8s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 4s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   5% { opacity: 1 }
  50% { opacity: 1 }
  60% { opacity: 0 }
 100% { opacity: 0 }
}

table.rowcta {
	border:none!important;
	width:100%;
}
.post-content table.rowcta th,
.post-content table.rowcta td{
	background:none;
	border:none!important;
	width:50%;
}
table.rowcta img {
	width:280px;
}

table.rowcta td img.cv-card {
	width:100%;
	height:auto;
}

.small,.small a { 
   	font-size: 70%;
    line-height: 1.2;
    display: inline-block;
    text-align: left;	
	/*font-size: 95% !important; font-weight: normal !important;*/
}
.cta-border .small,.small a {
	margin-top: 5px;
}
.cta { margin: 2em 0; text-align: center; letter-spacing:0;}
.ico-arrow-finger { position: relative;}
.ico-arrow-finger:before {content: " "; background: url(https://www.etc-navi.net/img/illu/handsign.png) no-repeat scroll 0 -4px; width:1em; padding: 0 0 0 2em;}
.ico-check1:before {content:"\2611";}
.ico-check2:before {content:"\2714";}
.ico-phone:before {content:"\260e"; font-size:20px;}
div.point {padding-top: 25px;}
div.point h4{font-weight:bold;padding-left: 3.3em; text-indent: -3.7em; min-height:40pt;}
div.point h4:before{content:" "; background:url(https://www.etc-navi.net/img2/point_finger.png) no-repeat 0 55px; padding:74px 33px;}
div.point-toku h4{font-weight:bold;margin:1em 0;}
div.point-toku h4:before{content:" "; background:url(https://www.etc-navi.net/img2/point_toku.png) no-repeat 0 47px;   background-size: 60px; padding:74px 33px;}
div.video h4{font-weight:bold;margin:0;text-align: left;}
div.video h4:before{content:" "; background:url(https://www.etc-navi.net/img2/icon_movie.png) no-repeat 0 70px; padding:74px 20px;}
ul.check li:before {  font-family: FontAwesome; content: "\2714"; position: absolute; margin-left:-16px; color: #000; }
ul.check li {list-style:none;}

/*.link-arrow {background:url(https://www.etc-navi.net/img/icon.png)no-repeat; background-position: 1px; padding-left:17px;}*/

.link-arrow:before {
	content:'\f0a9';
	font-family:FontAwesome;
	position:absolute;
	margin-left:-16px;
   color:#4e5b65;
}
.link-arrow{
	margin-left:20px;
}

li.link-arrow {
	list-style:none;
}

.cta .link-arrow:before {
	margin-top:4px;
}

/*挿入用ランキング*/
h3.ranking-h3 {
    clear: both;
    padding: 0px!important;
    line-height: 1.4;
    border-left: none!important; 
    margin: 0px!important;
    font-size: 1.4em!important;
    color: #000;
    font-weight: bold;
}
td.ranking-card {
	border:none!important;
	padding:0px!important;
	width:60%;
}
td.ranking-card img {
	width:100%;
}
th.brand-th {
	border:none!important; 
	padding:0px!important;
}
td.brand-td {
	text-align:center;
}
td.brand-td img {
	height:30px;
}
@media only screen and (max-width: 420px){
	td.brand-td img {height:30px;}
}
.ranking-crown {
	width:50px; 
	float:left; 
	padding-right:10px;
}
table.ranking-table{
	border:none!important; 
	padding:0px!important; 
	width:100%; 
	margin-bottom: 
		20px!important;
}
table.ranking-table .ranking-btn {
	border:none!important; 
	padding:10px 0 0!important; 
	text-align:center;
}
table.ranking-spec{
	width:100%;
	margin-bottom:10px!important;
	font-size:0.8em;
}
table.ranking-spec th,table.ranking-spec td{
	font-size:1.0em;
	line-height: 16px;
  padding:3px!important;
	text-align:center;
}
@media only screen and (max-width: 420px){
	table.ranking-spec{
		font-size:0.7em!important;
	}
}
table.ranking-spec th{
	width:15%; 
	background:#ececec!important;
}
table.ranking-spec td{
	width:25%;
}
.ranking-detail {
	padding: 5px;/*8px*/ 
	margin-bottom: 10px; 
/*	background-color: #fff0c1;*/
	text-align: left;
	 font-size: 0.85em;
    line-height: 1.3;
}
.ranking-detail ul li {
	 text-indent: -1.5em;
    margin-left: 1.5em;
}


@media only screen and (max-width: 420px){
	.ranking-detail {
		font-size:0.8em;
	}
}
.ranking-detail p:last-child{
	margin:0;
}
.ranking-detail ul {
	margin:0!important; 
	padding:0!important;
}
.ranking-detail li{ 
	list-style: none;
}
.ranking-detail li:before {
	content:"●"; 
	color:green;  
	padding-right: 7px;
}

/*挿入用ミニランキング*/
table.ranking-short {
	border-top: 5px solid #ccc!important; 
	border-bottom: 5px solid #ccc!important;
}
table.ranking-short td{
	border-left:none!important;
	border-right:none!important; 
	padding:5px;
}
table.ranking-short td a{
	font-size:1.1em;
	font-weight:bold;
	color:#2581c4;
}
table.ranking-short td.ranking-short-detail1 a{	
	 background-image: url(https://www.etc-navi.net/img/sp/icCrown1.png);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: 1% 36%;
    padding: 0 0 0 33px !important;
}
table.ranking-short td.ranking-short-detail2 a{	
	 background-image: url(https://www.etc-navi.net/img/sp/icCrown2.png);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: 1% 36%;
    padding: 0 0 0 33px !important;
}
table.ranking-short td.ranking-short-detail3 a{	
	 background-image: url(https://www.etc-navi.net/img/sp/icCrown3.png);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: 1% 36%;
    padding: 0 0 0 33px !important;
}
table.ranking-short td.ranking-short-attention a{	
    background-image: url(https://www.etc-navi.net/img/sp/icAttention.png);
    background-repeat: no-repeat;
    background-size: 40px;
    background-position: -4px -1px;;
    padding: 0 0 0 37px !important;
}
@media only screen and (max-width: 420px){
table.ranking-short td.ranking-short-attention a{
    background-size: 34px;
    background-position: -2px 0px;
    padding: 0 0 0 32px !important;}
}
table.ranking-short td span.service_box {
    text-align: center;
    font-size: 0.5em;
    border: 1px solid #1abb9a;
    color: #1abb9a;
    margin: 0 5px 0 0;
    padding: 2px;
}
td.ranking-short-card {
	width:100px;
}
@media only screen and (max-width: 420px){
td.ranking-short-card {width:30%;}
}
td.vertical-btn {width:120px;}
@media only screen and (max-width: 420px){
td.vertical-btn {width:30%;}
}
td.vertical-btn .cta {
	margin-top: -15px;
}


.ico-point-finger { float: left;
margin-right: 1em;
margin-bottom: 0.5em;}

.ofbt { width: 160px !important; }/*180331サイズ要検討*/
.content a {text-decoration: underline;}
.gide a {text-decoration: none;}


img.etc-card {
    width: 180px;
    margin: 130px 0 0 -110px;
/*	filter: drop-shadow(3px 3px 2px rgba(0,0,0,0.3));*/
}

@media only screen and (max-width: 478px) {
img.etc-card,
.cta-left img.etc-card{
width: 100px;
    margin: 70px 0 0 -40px;
}
}


img.etc-card{display:none;}

/* 161021 吹き出し--------------------------------*/
.fd{
text-align:center;
font-size: 1.5em !important;
color:#384e2e !important;
font-weight: bold !important;
margin:.5em 1.5em .5em 1.5em !important;
}
div#fukidashi{
background: #fff;
display: inline-block;
position: relative;
width: auto;
min-width: 115px;
height: auto;
margin-left: 5px;
margin-right: 15px;
line-height: 34px;
border: 3px solid #d3f2c5;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
div#fukidashi:before {
content: "";
display: inline-block;
border: 10px solid transparent;
border-left-color: #d3f2c5;
position: absolute;
right: -20px;
top: 50%;
margin-top: -9px;
}
div#fukidashi:after {
content: "";
display: inline-block;
border: 9px solid transparent;
border-left-color: #fff;
position: absolute;
right: -15px;
top: 50%;
margin-top: -8px;
}

/* 161021 吹き出し--------------------------------*/


#icon{vertical-align: middle; width: 15px;}
#icon + a{ color:blue;}
.ico-ans { position: relative;}
.ico-ans:before {content: " "; background: url(https://www.etc-navi.net/img/illu/ans.gif) no-repeat scroll 0; width:1em; padding:1.5em;}
.ico-ques { position: relative;}
.ico-ques:before {content: " "; background: url(https://www.etc-navi.net/img/illu/ques.gif) no-repeat scroll 0; width:1em; padding: 1.5em;}

/* medal */
#medal{vertical-align: middle; width: 15px;}

/* card */
#card{vertical-align: middle;}

/* linkcard */
#linkcard{vertical-align: middle; margin-right:20px;}

/* movie */
#movie{vertical-align: middle; width: 30px;}

/* times */
#times{vertical-align: middle; width: 15px!important; margin-right:5px;}

/* map */
#map{vertical-align: middle;}

/* value */
#value{vertical-align: middle; width: 25px;}

/* crown */
#crown{vertical-align: text-bottom; width:50px;}

/* yajirushi_kanren */
#yajirushi_kanren{vertical-align: middle; width: 20px; margin-right:2px;}

/*yajirushi_down*/
#yajirushi_down{width:25px; display: block; margin-left: auto; margin-right: auto;}

/*sankaku_down*/
#sankaku_down {width:16px; display: block; margin-left: auto; margin-right: auto;}

/* table */
.table {	width: 100%;max-width: 100%;margin-bottom: 20px;border-spacing: 0;border-collapse: collapse;background-color: transparent;text-align: left;}
.table-bordered { border: 1px solid #111;}
.table th, .table td {border: 1px solid #111;	padding: 5px;	font-weight: normal;}
.table.thb th, .table.tdb td{ font-weight: bold;}
.table.tdc td { text-align:center;}

.table ul {margin:0;}

/* 旧：border囲み */
.borderWrap {margin-bottom: 1.5em; padding: 10px; border: 1px #000 solid;}
.borderWrap p:last-child { margin-bottom: 0;}

.borderWrap2 {margin-bottom: 1.5em; padding: 10px; border: 3px #aaa solid;}
.borderWrap2 p:last-child { margin-bottom: 0;}

.borderWrap3 {margin-bottom: 1.5em; padding: 10px; border: 3px #4f7d3a dotted;}
.borderWrap3 p:last-child { margin-bottom: 0;}

.borderWrap4 {margin-bottom: 1.5em; padding: 10px; border: 3px #82f528 dotted;}
.borderWrap4 p:last-child { margin-bottom: 0;}

.borderWrap5 {margin-bottom: 1.5em; padding: 10px; border: 3px #BACCFF solid;}
.borderWrap5 p:last-child { margin-bottom: 0;}

.borderWrap6 {margin-bottom: 1.5em; padding: 10px; border: 3px #cccccc solid;}
.borderWrap6 p:last-child { margin-bottom: 0;}

.borderWrap7 {margin-bottom: 1.5em; padding: 10px; border: 3px #FFCC00 solid;}
.borderWrap7 p:last-child { margin-bottom: 0;}

.borderWrap8 {margin-bottom: 1.5em; padding: 10px; border: 3px #94252a solid;}
.borderWrap8 p:last-child { margin-bottom: 0;}

.borderWrap9 {margin-bottom: 1.5em; padding: 10px; border: 3px #b0a7d1 solid;}
.borderWrap9 p:last-child { margin-bottom: 0;}

.borderWrap10 {margin-bottom: 1.5em; padding: 10px; border: 3px #f6ad3c solid;}
.borderWrap10 p:last-child { margin-bottom: 0;}

.borderWrap11 {margin-bottom: 1.5em; padding: 10px; border: 3px #00afcd solid;}
.borderWrap11 p:last-child { margin-bottom: 0;}

.borderWrap12 {margin-bottom: 1.5em; padding: 10px; border: 2px #f08300 dotted;}
.borderWrap12 p:last-child { margin-bottom: 0;}

.borderWrap13 {margin-bottom: 1.5em; padding: 10px; border: 3px #c9c7c5 dotted;}
.borderWrap13 p:last-child { margin-bottom: 0;}

.borderWrap14 {margin-bottom: 1.5em; padding: 10px; border: 3px #ca3a1c solid;}
.borderWrap14 p:last-child { margin-bottom: 0;}

.borderWrap15 {margin-bottom: 1.5em; padding: 10px; border: 3px #1d20f9 solid;}
.borderWrap15 p:last-child { margin-bottom: 0;}

.borderWrap16 {margin-bottom: 1.5em; padding: 10px; border: 3px #b9afd3 solid;}
.borderWrap16 p:last-child { margin-bottom: 0;}

.borderWrap17 {margin-bottom: 1.5em; padding: 10px; border: 1px #f7ab00 solid;}
.borderWrap17 p:last-child { margin-bottom: 0;}

.borderWrap18 {margin-bottom: 1.5em; padding: 10px; border: 1px #e5e4e2 solid;}
.borderWrap18 p:last-child { margin-bottom: 0;}

.borderWrap19 {margin-bottom: 1.5em; padding: 10px; border: 3px #6bc8f2 dotted;}
.borderWrap19 p:last-child { margin-bottom: 0;}

.borderWrap20 {margin-bottom: 1.5em; padding: 10px; border: 1px #1d20f9 solid;}
.borderWrap20 p:last-child { margin-bottom: 0;}

.borderWrap21 {margin-bottom: 1.5em; padding: 10px; border: 1px #9fd9f6 solid;}
.borderWrap21 p:last-child { margin-bottom: 0;}

/*--------------------------------*/
/*新・border囲み*/
div.frame {
margin-top: 0px;
margin-bottom: 20px;
padding: 10px;
}

div.frame ul:last-child {
	margin-bottom:0;
}

div.black1 {
    padding: 0.5em 1em;
   	margin: 0 0 2em 0;
    border-radius: 5px;
    background: #d6ecff;
}

div.frame.yellow {
background:#fff2cc;
}

@media screen and (max-width: 470px ) {
div.black1 {
    font-size: 0.75em;
}
}

div.black2 {
border-width:3px;
border-style: solid;
border-color:#333;
background:#fff;
}

div.gray1 {
border-width:1px;
border-style: solid;
border-color:#aaa;
background:#fff;
}

div.gray2 {
border-width:3px;
border-style: solid;
border-color:#aaa;
background:#fff;
}

div.green1 {
border-width:1px;
border-style: solid;
border-color: #6aa84f;
}

div.green2 {
border-width:3px;
border-style: solid;
border-color: #6aa84f;
}

div.lightgreen1 {
border-width:1px;
border-style: solid;
border-color: #82f528;
}

div.lightgreen2 {
border-width:3px;
border-style: solid;
border-color: #82f528;
}

div.yellow1 {
border-width:1px;
border-style: solid;
border-color: #ffd966;
}

div.yellow2 {
border-width:3px;
border-style: solid;
border-color: #ffd966;
}

div.orange1 {
border-width:1px;
border-style: solid;
border-color: #f6ad3c;
}

div.orange2 {
border-width:3px;
border-style: solid;
border-color: #f6ad3c;
}

div.blue1 {
border-width:1px;
border-style: solid;
border-color: #1d20f9;
}

div.blue2 {
border-width:3px;
border-style: solid;
border-color: #1d20f9;
}

div.aqua1 {
border-width:1px;
border-style: solid;
border-color: #a4c2f4;
}

div.aqua2 {
border-width:3px;
border-style: solid;
border-color: #a4c2f4;
}

div.dot {
border-style: dotted;
}

.frame p:last-child { margin-bottom: 0;}

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

div.flow{
    text-align: center;
}

div.flow h4{
    padding: 0.6em;
    border: 1px solid #333;
    background-color: #FF9900;
	 margin-top:0px;
}



.borderWrap p:last-child { margin-bottom: 0;}

/* Googleマップ */
.googleMaps {
position: relative;
padding-bottom: 75%;
height: 0;
overflow: hidden;
}
.googleMaps iframe {
position: absolute;
top: 0;
left: 12px;
width: 95% !important;
height: 95% !important;
}


/* 180118 インタビュー--------------------------------*/

.bubble-talk{
overflow: hidden;
margin-left: 70px;
}

.people{
display: block;
width: 60px;
height: auto;
vertical-align:middle;
}

/* 180125 リンクカード--------------------------------*/

.borderRoundcorner{
margin-bottom: 1.5em;
padding: 10px;
border: 1px #888888 solid;
border-radius: 10px;
max-width: 670px;
max-height:155px;
word-break: break-all;
white-space: normal;
overflow: hidden;
}

.borderRoundcorner p{
	margin:0 !important;
}

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


.times {
color: #00afec;
font-weight: bold;
}

.linkcard{
max-width: 670px;
}

.linkcard-title {
color: #0c0096;
font-size: 16px;
line-height: 24px;
font-weight: bold;
overflow: hidden;
word-break: break-all;
text-overflow: ellipsis;
white-space: nowrap;
}

.linkcard-img{
max-width: 100px;
max-height: 108px;
padding: 0;
margin: 0 6px 4px 4px;
float: left;
}

.linkcard-text{
color: #333333;
font-size: 15px;
line-height: 18px;
padding: 0;
margin: 0;
overflow: hidden;
}


.blog-card{
 background:#ffffff;
 border:1px solid #999;
 word-wrap:break-word;
 max-width:100%;
 border-radius:10px;
 margin-bottom: 30px;
 font-size :1.2em;
 box-shadow: 4px 4px 0px #666;
 transition:0.1s ease;
 position:relative;
}
.blog-card:hover{
 box-shadow: 0px 0px 0px #666;
}
 
.blog-card a {
 color: #333;
 background: #fff;
 display: block;
 -webkit-transition: 0.3s ease-in-out;
 -moz-transition: 0.3s ease-in-out;
 -o-transition: 0.3s ease-in-out;
 transition: 0.3s ease-in-out;
 text-decoration:none;
 font-weight: bold;
 border-radius: 10px;
 padding: 0px;
}
 
.blog-card-thumbnail{
 float:left;
 padding:10px;
}
 
.blog-card-thumbnail img {
 display: block;
 padding: 0;
 -webkit-transition: 0.3s ease-in-out;
 -moz-transition: 0.3s ease-in-out;
 -o-transition: 0.3s ease-in-out;
 transition: 0.3s ease-in-out;
 margin-top: 0!important;
}
 
.blog-card-content{
 line-height:120%;
}
.blog-card-title{
 padding: 13px 10px 10px 0;
 font-size: 90%;
}
 
.blog-card-title::before {
 content: '>続きを読む';
 font-size: 0.7em;
 font-weight: bold;
 color: #fff;
 background: #111;
 width: 7em;
 display: inline-block;
 padding: 0.2em;
 position: absolute;
 text-align: center;
 margin-right: 1em;
 -webkit-border-radius: 2px;
 -moz-border-radius: 2px;
 border-radius: 3px;
 bottom: 10px;
 right: 0px;
}
 
.blog-card-date{
 color:#333;
 font-size: 90%;
 margin-right:10px;
 font-family: GillSans;
}

.margin-clear {
	margin: 0;
}
 
.relation-head {
    display: inline-block;
    padding: 2px 7px 3px;
    margin-bottom: 0;
    font-size: 12px;
	background-color: #5987e0;
	color: #fff;
	border-radius: 4px 4px 0 0;
}
 
.relation-link {
	display: block;
	height: auto;
	color: #1464b3;
	border:1px solid #c5c5c5;
	border-radius: 0 4px 4px 4px;
	padding: 10px 50px 10px 15px;
	margin: 0 auto 20px;
	font-size: 16px;
	 background: url(https://www.etc-navi.net/wp/wp-content/uploads/2018/06/icon-blogcard.png) no-repeat #ffffff;
    background-size: 70px;
    background-position: 98%;
}
a.relation-link {
	padding-left: 2.4em;
    text-indent: -0.8em;
}

.relation-link a {
	text-decoration:none!important;
    margin-left: 1.6em;
    text-indent: -0.8em;
    display: inline-block;
}

a.relation-link:before {
	content: "\f0a9";
	padding-right: 10px;
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	animation: horizontal 3s ease infinite;
	-webkit-animation: horizontal 3s ease infinite;
}

span.relation-link a:before {
	content: "\f0a9";
	padding-right: 10px;
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	animation: horizontal 3s ease infinite;
	-webkit-animation: horizontal 3s ease infinite;
}

@media only screen and (max-width: 460px){
.relation-link {
	font-size:15px;
	}
}


/*-----------------------------------
スマホのサイズ調整
------------------------------------*/
@media only screen and (max-width: 600px){
.blog-card-title {
    font-size: 70%;
}
.blog-card-title::before {
    font-size: 0.7em;
}
 
.blog-card-thumbnail img {
    max-width: 100%;
    margin-left: 0px!important;
    margin-bottom: 0!important;
}
}









/* 点線 */
.hr1{border:1px dashed #F08300;}
.hr2{border:1px dashed #e2e2e2;}



/* パンクズ */
.breadcrumbs { padding: 4px 0 0;}
.breadcrumbs, .breadcrumbs a,.breadcrumbs span { font-size: 13px !important; line-height: 1.5;}
.breadcrumbs span:after { content:" > ";position: relative;top: -1px;} .breadcrumbs a span:after { display:none;}
.breadcrumbs span:nth-child(3) a { color: #000000;}
.breadcrumbs span:nth-child(3):after { display: none;}

/* additional
------------------------------------------------*/
/*.bold { font-weight: bold !important;}*/
.al-c { text-align: center !important;}

/* fontsize */
.f16 { font-size: 16px !important;}
.f18 { font-size: 18px !important;}
/* font color */
.col_org { color: #F60 !important;}
.col_grn { color: #090 !important;}
/* other */
.bd_red { border-bottom: 2px solid #f00;}

/* link animation */
a:hover { filter:alpha(opacity=70); -ms-filter: "alpha( opacity=70 )"; 
	/*opacity:0.7;*/
	 }

/* FB */
#fb-like-box iframe { height: 160px !important;}


.icon-up-open:before {
content: "↑"
}

/* PageScroll
------------------------------------------------*/
a#gototop {
color: #ffffff;
background-color: #6dc872;
-webkit-box-shadow: 0 0 0 1px #6dc872;
-moz-box-shadow: 0 0 0 1px #6dc872;
-o-box-shadow: 0 0 0 1px #6dc872;
box-shadow: 0 0 0 1px #6dc872;
}
a#gototop {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%
}
a#gototop {
-webkit-opacity: .7;
-khtml-opacity: .7;
-moz-opacity: .7;
-o-opacity: .7;
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
opacity: .7
}
a#gototop:hover {
-webkit-opacity: 1;
-khtml-opacity: 1;
-moz-opacity: 1;
-o-opacity: 1;
filter: alpha(opacity=100);
-ms-filter: "alpha(opacity=100)";
opacity: 1
}
a#gototop,a#gototop:before {
width: 36px;
height: 36px;
line-height: 36px;
text-align: center
}
a#gototop {
position: fixed;
right: 10px;
bottom: 10px;
font-size: 22px !important;
z-index: 100;
border: 2px solid
}

a#gototop:before {
top: 0
}
a#gototop span {
display: none;
}


/* テスト用 */

#testwrapper {
width: 200px;
background-color: #EAEAEA;
margin-right: auto;
margin-left: auto;
margin-top: 10px;
height: 255px;
border: 1px solid #999;
padding-bottom: -2px;
}
#testheader {
background-color: #CCC;
height: 35px;
width: 175px;
margin-top: 10px;
margin-left: 10px;
text-align: right;
float: left;
line-height: 35px;
padding-right: 5px;
}
#testwrapper.ul{
margin: 0px;
list-style-type: none;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
#testwrapper.li {
float: left;
height: 40px;
width: 50px;
background-color: #CCC;
margin-top: 10px;
margin-right: 5px;
text-align: center;
line-height: 40px;
margin-left: 10px;
}
#testwrapper.last0{
margin-left: 75px;
}

/*------------------------------------------------
180330
旧サイト/css/sp/add.cssから抜粋
------------------------------------------------*/
.rank01 a dt,
.rank02 a dt {
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    color: #000;
    font-size: 120%;
    font-weight: 700;
}

.rank01 a dt p,
.rank02 a dt p {
    margin-right: 15px;
    float: left;
}

.rank02 a dt {
    border: none;
    color: #000;
}

.rank02 a dt img {
    float: left;
    padding-right: 10px;
}

.ic-crown1:before,
.ic-crown2:before,
.ic-crown3:before {
    content: " ";
    width: 1em;
    padding: 0 0 0 1.5em;
}

.ic-crown1:before {
    background: url(https://www.etc-navi.net/img/sp/icCrown1.png) 0 1px no-repeat;
}

.ic-crown2:before {
    background: url(https://www.etc-navi.net/img/sp/icCrown2.png) 0 1px no-repeat;
}

.ic-crown3:before {
    background: url(https://www.etc-navi.net/img/sp/icCrown3.png) 0 1px no-repeat;
}

#sd #catchimg {
    background: url(https://www.etc-navi.net/img/sp/catch.png) no-repeat;
    height: 110px;
}

.ttlRank,.ttlRecommend {
    background: url(https://www.etc-navi.net/img/sp/sp_img_sprite.png) center -474px no-repeat;
    height: 44px;
}

.ttlRank span {
    background: url(https://www.etc-navi.net/img/sp/sp_img_sprite.png) 0 -190px/320px 1250px no-repeat;
    display: block;
    height: 44px;
}

.ttlRecommend span {
    background: url(https://www.etc-navi.net/img/sp/sp_img_sprite.png) 0 -750px/320px 1250px no-repeat;
    display: block;
    height: 44px;
}

ul#icoEtcill {
	padding:0!important;
}


ul#icoEtcill li{
	list-style:none;
}

#icoEtcill li::before {
	content:"";
    background: url(https://www.etc-navi.net/img/sp/sp_img_sprite.png) 0 -707px/320px 1250px no-repeat;
    display: inline-block;
	 vertical-align: middle;
    height: 32px;
    width: 50px;
}

#icoEtcill li a {
    display: /*block*/inline;
    padding: 10px 0 0 10px;
}

.cardlist img.w100 {
    width: 70%!important;
}

.osusume dt img {
    vertical-align: baseline;
}

.icStar {
    width: 19px;
    height: 23px;
    background-image: url(https://www.etc-navi.net/img/sp/icStar.png);
    float: left;
    display: block;
}

#sd #catchimg,.ttlRank span,.ttlRecommend span {
    width: 320px;
    margin: 0 auto;
}

.icStar.full {
    background-position: 0 0;
}

.icStar.half {
    background-position: -42px 0;
}

.icStar.empty {
    background-position: -21px 0;
}
.icStar,.link_cnt dt {
    background-repeat: no-repeat
}

.extended2 {
    font-size: 90%;
}

.link_cnt dt {
    background-image: url(https://www.etc-navi.net/archives/img/bg_linkitem_dt.png);
    font-size: 14px;
    font-weight: bolder;
    padding-left: 30px;
    padding-top: 2px;
    padding-right: 20px;
}

.childIframe p{
	 display: block;
    -webkit-margin-before: 0px;
    -webkit-margin-after: 0px;
}

.movie{
width:100%;
height:auto;
position: relative;
text-align:center;
}

iframe.youtube{
	width: 560px;
   height: 315px;
	border:none;
}

@media screen and (max-width: 767px) {	
  /* phone */
.ofbt{
	width:120px !important;}

	/* phone end*/
}

@media screen and (max-width:480px){
		
.linkcard-text {
    overflow: hidden;
    margin-left: 50px;
    font-size:11px !important;
    line-height: 15px;
}

.linkcard-img {
  width:70px;
}

.linkcard-img img {
  width:70px !important;
}

.linkcard-title {
    font-size: 0.8em !important;
    line-height: 16px;
	 white-space:normal;
}

.movie{
width:100%;
padding-bottom: 56.25%;
height:0px;
position: relative;
}

iframe.youtube{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.ill img.w100 {
    width: 100%;
}
img.size-large { width:100%;}
img.size-middle { width:50%;}
img.cv-card{width:70%; height:auto;}
.slide img.cv-card{
width:100%;
}
}