
/**********************************************************************
*
*縲縲 笆�縺雁ｽｹ遶九■諠��ｱ/tips/
*
**********************************************************************/
#breadcrumb span [property="name"] {font-size: 12px;vertical-align: middle;display: inline-block;line-height: normal;}
#breadcrumb span.first {margin-right: 5px;}
#breadcrumb span a {color: #2c97d5;}
#maincontents_cont #tips_cont {margin-bottom: 100px;}
#maincontents_cont #tips_cont .tips_list ul {display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;flex-wrap: wrap;}
#maincontents_cont #tips_cont .tips_list ul::after{content:"";display: block;width:267px;}
#maincontents_cont #tips_cont .tips_list li {width: 267px;margin-bottom: 60px;position: relative;padding-left: 6px;}
#maincontents_cont #tips_cont .tips_list li .new {position:absolute;top: -10px; left: 0;}
#maincontents_cont #tips_cont .tips_list li .ribbon {display: inline-block;position: relative;height: 30px;/*鬮倥＆*/line-height: 30px;padding: 0 40px 0 20px;font-size: 13px;background: url(../img/ribbon_bg.png) no-repeat center left;color: #2e2e2e;box-sizing: border-box;z-index: 10;font-weight: bold;}
#maincontents_cont #tips_cont .tips_list li .ribbon:after {position: absolute;content: '';width: 0px;height: 0px;z-index: 1;}
#maincontents_cont #tips_cont .tips_list li .ribbon:after {top: 0;right: 0;border-width: 13px 10px 13px 0px;
border-color: transparent transparent transparent transparent;border-style: solid;}
#maincontents_cont #tips_cont .tips_list li .ribbon:before {position: absolute;content: '';top: 100%;left: 0;
border: none;border-bottom: solid 6px transparent;border-right: solid 7px rgb(183, 189, 8);/*謚倥ｊ霑斐＠驛ｨ蛻�*/}
#maincontents_cont #tips_cont .tips_list li a{display: block;color: #2e2e2e;}
#maincontents_cont #tips_cont .tips_list li img {width: 100%;height: auto;}
#maincontents_cont #tips_cont .tips_list li .note {display: flex;display:-webkit-box;display:-ms-flexbox;display: -webkit-flex;justify-content: space-between;align-items: center;margin: 10px 0 15px;}
#maincontents_cont #tips_cont .tips_list li .note .date {font-size: 13px;}
#maincontents_cont #tips_cont .tips_list li .txt {font-weight: bold;line-height: 1.4;}
#maincontents_cont #tips_cont .tips_list li .grade {padding: 5px 20px;color: #fff;font-weight: bold;border-radius: 11px;}
#maincontents_cont #tips_cont .tips_list li .grade.el {background: #0ab080;}
#maincontents_cont #tips_cont .tips_list li .grade.jr {background: #f26683;}
#maincontents_cont #tips_cont .tips_list li .grade.hi {background: #2d97d3;}
#maincontents_cont #tips_cont .tips_list li .grade.all {background: #ff8c00;}

#maincontents_cont #tips_cont .tips_list li .grade2 {padding: 5px;color: #fff;font-weight: bold;background:#ff8c00; display:inline-block; margin:0 5px 0 0;}
#maincontents_cont #tips_cont .tips_list li .grade2 a{color:#fff;}


/* pagination */
#maincontents_cont #tips_cont .pagination {text-align: center;}
#maincontents_cont #tips_cont .pagination li {display: inline-block;border: 1px solid #aad3e9;border-radius: 5px;}
#maincontents_cont #tips_cont .pagination li a {color: #2d97d3;font-weight: bold;display: block;padding: 18px 20px;}
#maincontents_cont #tips_cont .pagination li.crnt {background: #2d97d3;}
#maincontents_cont #tips_cont .pagination li.crnt a {color: #fff;}
#maincontents_cont #tips_cont .pagination li.prev {border: 1px solid #dddddd;}
#maincontents_cont #tips_cont .pagination li.prev a {color: #bdbdbd;}
#maincontents_cont #tips_cont .pagination li.prev a span {position: relative;display: inline-block;padding-left: 15px;}
#maincontents_cont #tips_cont .pagination li.prev a span:before {content: '';width: 0;height: 0;border: solid 4px transparent;border-right: solid 6px #a7a7a7;position: absolute;top: 50%;left: 0;margin-top: -4px;}
#maincontents_cont #tips_cont .pagination li.next {border: 1px solid #2d97d3;background: #2d97d3;}
#maincontents_cont #tips_cont .pagination li.next a {color: #fff;}
#maincontents_cont #tips_cont .pagination li.next a span {position: relative;display: inline-block;padding-right: 15px;}
#maincontents_cont #tips_cont .pagination li.next a span:after {content: '';width: 0;height: 0;border: solid 4px transparent;border-left: solid 6px #ffffff;position: absolute;top: 50%;right: 0;margin-top: -4px;}

/* 縺昴�莉悶せ繧ｿ繝ｳ繝繝ｼ繝画ュ蝣ｱ */
#other_info .info_list {display: flex;display:-webkit-box;display:-ms-flexbox;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
#other_info .info_list li {width: 267px;padding: 25px;border: 1px solid #dddddd;margin-bottom: 30px;}
#other_info .info_list li a {display: block;color: #2e2e2e;}
#other_info .info_list li a .category {color: #fff;padding: 5px 10px;display: inline-block;margin: 10px 0;}
#other_info .info_list li a .category.more {background: #50abc5;}
#other_info .info_list li a .category.service {background: #ff9024;}

#other_info .info_list li a p {line-height: 1.6;}

/* --SP-- */
@media screen and (max-width: 750px) {
#maincontents_cont #tips_cont .tips_list {padding: 0 2.5%;}
#maincontents_cont #tips_cont .tips_list li{width: 100%;}
#maincontents_cont #tips_cont .tips_list li .note {justify-content:start;}
#maincontents_cont #tips_cont .tips_list li .grade {font-size: .8rem;padding: 5px 10px;}
#maincontents_cont #tips_cont .tips_list li .note .date {margin-left: 10px;}
#maincontents_cont #tips_cont .pagination ul {display: flex;justify-content: space-between;width: 100%;padding: 0 4%;}
#maincontents_cont #tips_cont .pagination ul li {display: flex;align-items: center;}
#maincontents_cont #tips_cont .pagination ul li {padding: 10px 15px;}
#other_info .info_list {padding: 0 2.5%;}
#other_info .info_list li {width: 49%;padding: 4%;margin-bottom: 10px;}
#other_info .info_list li a p {font-size: .8rem;}

}

/**********************************************************************
*
*縲縲 笆�縺雁ｽｹ遶九■諠��ｱ縲隧ｳ邏ｰ/tips/tips_article.html
*
**********************************************************************/
#maincontents_cont #tips_cont .tips_article {padding: 0 20px;}
#maincontents_cont #tips_cont .tips_article .tips_tit {font-size: 32px;padding-bottom: 20px;margin-bottom: 20px;border-bottom: 2px solid #2d97d3;font-weight: bold;line-height: 1.3;}
#maincontents_cont #tips_cont .tips_article .note {margin: 10px 0 15px;}
#maincontents_cont #tips_cont .tips_article .note .date {font-size: 13px;margin-left: 10px;}
#maincontents_cont #tips_cont .tips_article .txt {font-weight: bold;}
#maincontents_cont #tips_cont .tips_article .grade {padding: 5px 20px;color: #fff;font-weight: bold;border-radius: 11px;display: inline-block;}
#maincontents_cont #tips_cont .tips_article .grade.el {background: #0ab080;}
#maincontents_cont #tips_cont .tips_article .grade.jr {background: #f26683;}
#maincontents_cont #tips_cont .tips_article .grade.hi {background: #2d97d3;}
#maincontents_cont #tips_cont .tips_article .grade.all {background: #ff8c00;}
#maincontents_cont #tips_cont .tips_article .post-categories {margin:0 5px 15px 0;}
#maincontents_cont #tips_cont .tips_article .post-categories li {padding: 5px;color: #fff;font-weight: bold;background:#ff8c00; display:inline-block;margin:0 5px 5px 0;}
#maincontents_cont #tips_cont .tips_article .post-categories li a{color:#fff;}



/*險倅ｺ九ヶ繝ｭ繝�け*/
#maincontents_cont #tips_cont .tips_article .block {margin-bottom: 130px;}
#maincontents_cont #tips_cont .tips_article .block p {margin: 45px 0;font-size: 16px;line-height: 1.8;}
#maincontents_cont #tips_cont .tips_article .block p strong {font-weight: bold;}
#maincontents_cont #tips_cont .tips_article .block p span {color: #e63a50;font-weight: bold;font-size: 16px;line-height: 1.8;}
#maincontents_cont #tips_cont .tips_article .block .mid_tit {text-align: center;line-height: 1.3;margin-bottom: 50px;}
#maincontents_cont #tips_cont .tips_article .block .mid_tit span {font-size: 28px;font-weight: bold;background: linear-gradient(transparent 60%, #ffea00 60%);line-height: 1.8;}
#maincontents_cont #tips_cont .tips_article .block .small_tit {font-size: 20px;padding: 15px;background: #d4e6ff;font-weight: bold;color: #2d97d3;margin-top: 45px;}
#maincontents_cont #tips_cont .writerbox {background: url(/img/top/promotion_bn_bg.gif);padding: 45px;}
#maincontents_cont #tips_cont .writerbox .writertxt .name {font-size: 21px;border-bottom: 4px solid #f56684;padding-bottom: 10px;margin: 0 0 20px;line-height: 1.3;}
#maincontents_cont #tips_cont .writerbox .writertxt .name span {font-size: 15px;}
#maincontents_cont #tips_cont .writerbox .writertxt .txt {line-height: 1.7;}

/* --PC-- */
@media screen and (min-width: 751px) {
#maincontents_cont #tips_cont .tips_article .mainImg {width: 800px;height: auto;}
#maincontents_cont #tips_cont .tips_article .mainImg img {width: 100%;height: auto;}
#maincontents_cont #tips_cont .tips_article .block div {/*width: 565px;*/ height: auto;margin: 0 auto;}
#maincontents_cont #tips_cont .tips_article .block div img {width: 100%;}
#maincontents_cont #tips_cont .writerbox {display: flex;display:-webkit-box;display:-ms-flexbox;display: -webkit-flex;}
#maincontents_cont #tips_cont .writerbox .writerimg {width: 240px;}
#maincontents_cont #tips_cont .writerbox .writerimg img {width: 100%;height: auto;}
#maincontents_cont #tips_cont .writerbox .writertxt {margin-left: 35px;flex: 1;}
}

/* --SP-- */
@media screen and (max-width: 750px) {
#maincontents_cont #tips_cont .tips_article .tips_tit {font-size: 1.2rem;}
#maincontents_cont #tips_cont .tips_article .block {margin-bottom: 50px;}
#maincontents_cont #tips_cont .tips_article .block p {margin: 10px 0;font-size: 1rem;}
#maincontents_cont #tips_cont .tips_article .block .mid_tit {margin-bottom: 20px;}
#maincontents_cont #tips_cont .tips_article .block .mid_tit span {font-size: 1.2rem;}
#maincontents_cont #tips_cont .tips_article .block .small_tit {padding: 4%;font-size: 1rem;}
#maincontents_cont #tips_cont .writerbox {padding: 4%;overflow: hidden;}
#maincontents_cont #tips_cont .writerbox .writerimg {float: left;width: 40%;margin: 0 5% 5% 0;}
#maincontents_cont #tips_cont .writerbox  .writertxt {width: 100%;}
#maincontents_cont #tips_cont .writerbox .writertxt .name {font-size: 1rem;display: inline-block;width: 50%;margin-top: 5px;}
}


/**********************************************************************
*
*縲縲 笆�pagenation
*
**********************************************************************/


/*wp-pagenavi base*/
.wp-pagenavi {clear: both;text-align:center; line-height:3;}
.wp-pagenavi a, .wp-pagenavi span {color: #999;background-color: #FFF;border: solid 1px #e0e0d2;padding: 18px 20px;margin: 0 2px;white-space: nowrap;-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out;-o-transition: 0.2s ease-in-out;transition: 0.2s ease-in-out;text-align: center;text-decoration:none;}
.wp-pagenavi a:hover{color:#FFF; background-color:#999; border-color:#999;}
.wp-pagenavi span.current{color: #FFF;background-color: #2d97d3;border-color: #2d97d3;font-weight: bold;
}
/* --PC-- */
@media screen and (min-width: 751px) {
	.wp-pagenavi {line-height:4;}
}

/* --SP-- */
@media screen and (max-width: 750px) {
.wp-pagenavi a, .wp-pagenavi span {padding: 2% 3%;}
}

/*-------------------------------------------------*/

.search_box{
	width:100%;
	margin:0 0 50px 0;
}
.search_box h2{
	background:#c5e9fa;
	text-align:center;
	padding:20px 0;
	font-size:24px;
	font-weight:bold;
	border-bottom:3px solid #168ed2;
}

.search_inner{
	padding:10px 60px 20px 60px;
	background:#fff;
	border:1px solid #c5e9fa;
}
.search{
	padding:20px;
}
.search h3{
	font-size:18px;
	display: inline-block;
	margin:0 50px 0 0;
}
.search label{
	margin:0 25px 0 0;
	line-height:18px;
}
.search label input[type='checkbox']{
	height:18px;
	width:18px;
	margin:0 5px 0 0;
}
.search2{
	border-top:1px solid #bfbfbf;
}
.search_btn{
	width:520px;
	margin:10px auto;
	text-align:center;
	position:relative;
}
.search_btn input[type='submit']{
	width:100%;
	background:#168ed2;
	color:#FFF;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	border:none;
	height:50px;
	line-height:50px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:5px;
}
.search_btn input[type='submit']:hover{
	background-color:rgba(22,142,210,0.8);
}
.search_btn:after{
	content:'';
	position:absolute;
	left:200px;
	top:8px;
	width:30px;
	height:30px;
	background:url(../tips/img/search_icon.png);
	background-size:100% auto;
}

.relation_posts {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  margin: 0 0px 100px;
}
.relation_posts img {
  max-width: 100%;
  height: auto;
}
.relation_posts > div {
overflow:hidden;
width: 267px;
padding: 25px;
border: 1px solid #dddddd;
position: relative;
}
.relation_posts .text {
  padding: 1em 0.5em;
  line-height: 1.5;
  height: 6.6em;
  overflow: hidden;
  font-size: 16px;
}
.relation_tip a {
  display: block;
  color: #000;
}
.relation_posts .text:after {
  position: absolute;
  content: "続きを読む";
  color: #168ed2;
  font-weight: bold;
  padding-left: 0.5em;
  right: 0.5em;
  bottom: 1em;
  display: inline-block;
}
.relation_posts img {
  vertical-align: top;
}

.prev_after {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.prev_post,.next_post {
  width: 40%;
  padding: 1em 1.5em;
}
.back_posts {
  width: 20%;
  text-align: center;
}
.prev_post {
  padding-right: 0;
}
.next_post {
  padding-left: 0;
}
.prev_post a,.next_post a {
  display: flex;
  align-items: center;
  position: relative;
}
.prev_after .title {
  padding: 0 1em;
  line-height: 1.5;
  width: 70%;
}
.back_posts a {
  display: inline-block;
  background: #168ed2;
  color: #fff;
  padding: 1em;
}
.next_post a {
  flex-direction: row-reverse;
}
.next_post {
  flex-direction: row-reverse;
  text-align: right;
}
.prev_after .image {
  width: 30%;
}
.prev_after img{
  width:100%;
  height: auto;
}
.prev_post a:before,
.next_post a:before {
  content: "";
  display: block;
  width: 0.7em;
  height: 0.7em;
  position: absolute;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
  top: 50%;
}
.prev_post a:before{
  left: -1em;
  transform: translate(0%,-50%) rotate(-45deg);
}
.next_post a:before{
  right: -1em;
  transform: translate(0%,-50%) rotate(135deg);
}

.side_newpost {
  width: 320px;
  float: right;
  padding-bottom: 40px;
  position: relative;
}

.newpost_list .image {
  width: 30%;
}
.newpost_list img {
  max-width: 100%;
  height: auto;
}
.newpost_list a {
  display: flex;
  color: #000;
  align-items: center;
  border-bottom: 1px solid #ffa604;
  padding: 1em;
}
.newpost_list .text {
  width: 70%;
  padding-left: 1em;
  line-height: 1.3;
  font-size: 14px;
}
.side_newpost h3 {
  font-size: 1.1em;
  text-align: left;
  color: #fff;
  background: #ffa604;
  padding: 1em;
  font-weight: bold;
}
.side_newpost_in {
  width: 300px;
  margin: 0 auto;
  border: 1px solid #ffa604;
}
.newpost_list a:last-child {
  margin-bottom: 0;
}
.side_newpost_in.side_ranking {
  margin-bottom: 2em;
  border: 1px solid #2d97d3;
}
.side_newpost_in.side_ranking h3 {
  background: #2d97d3;
}
.side_newpost_in.side_ranking a {
  border-bottom: 1px solid #2d97d3;
}

.newpost_list.rank_list .image::before {
  content: "1";
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
  background: #2d97d3;
  width: 1.5em;
  line-height: 1;
  height: 1.5em;
  text-align: center;
  line-height: 1.5em;
  color: #fff;
  font-weight: bold;
}
.newpost_list.rank_list .image {
  position: relative;
}
.newpost_list.rank_list a:nth-child(2) .image::before {
  content:"2"
}
.newpost_list.rank_list a:nth-child(3) .image::before {
  content:"3"
}
.newpost_list.rank_list a:nth-child(4) .image::before {
  content:"4"
}
.newpost_list.rank_list a:nth-child(5) .image::before {
  content:"5"
}
@media screen and (max-width: 750px) {
	.search_box{
		width:95%;
		margin:0 2.5% 30px 2.5%;
	}
	.search_box h2{
		padding:10px 0;
		font-size:18px;
	}

	.search_inner{
		padding:10px;
		background:#eeeeee;
	}
	.search{
		padding:10px;
	}
	.search h3{
		font-size:16px;
		display:block;
		margin:0;
		font-weight:bold;
	}
	.search label{
		display:inline-block;
		margin:0 5px 0 0;
		line-height:18px;
		padding:5px 0;
	}
	.search label input[type='checkbox']{
		height:18px;
		width:18px;
		margin:0 5px 0 0;
	}
	.search_btn{
		width:90%;
		margin:10px auto;
	}
	.search_btn input[type='submit']{
		height:40px;
		line-height:40px;
		font-size:16px;
		font-weight:bold;
		letter-spacing:5px;
		padding:0 0 0 20px;
	}
	.search_btn:after{
		content:'';
		position:absolute;
		left:32%;
		top:4px;
		width:30px;
		height:30px;
		background:url(../tips/img/search_icon.png);
		background-size:100% auto;
	}
	.relation_posts {
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-wrap: wrap;
    justify-content: space-between;
		margin: 0 6%;
	}
	.relation_posts > div {
    width: 49%;
    padding: 4%;
    margin-bottom: 10px;
	}
	.relation_tip a {
    display: block;
    color: #2e2e2e;
	}
	.relation_posts .image {
    margin: 0;
    padding: 0;
    border-width: 0px;
    border-style: none;
    border-color: #ffffff;
    color: #ffffff;
    background: transparent;
    -webkit-transition: opacity 1.4s ease;
    -moz-transition: opacity 1.4s ease;
    transition: opacity 1.4s ease;
    backface-visibility: hidden;
	}
	.relation_posts .text {
    font-size: 0.9rem;
		padding-bottom: 1.5em;
		height: auto;
		padding-top: 0.8em;
	}
	.relation_posts .text:after {
		bottom: 0.6em;
		line-height: 1;
		right: 1em;
	}
	.prev_after .image {
    width:auto;
    margin: 0 1em 0.5em;
    height: 6em;
    overflow: hidden;
    position: relative;
	}
	.prev_after .title {
		width: 100%;
		font-size: 0.8rem;
	}
	.back_posts {
		position: absolute;
		width: 88%;
		bottom: 0;
		left: 6%;
		transform: translate(0,100%);
	}
	.prev_post, .next_post {
		width: 48%;
	}
	.back_posts a {
		display: block;
	}
	.side_newpost {
		width: auto;
		float: none;
		margin: 0 20px;
	}
	.side_newpost_in {
		width: 100%;
	}
	.prev_post a, .next_post a {
	    display: block;
	}
	.prev_after {
	    align-items: start;
	}
	.prev_after .image img {
	    position: absolute;
	    left: 0;
	    top: 50%;
	    transform: translate(0,-50%);
	}
}
