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

.vol01 #column01 {
	width: 430px;
}

.vol01 #column01 p.sentence,
.vol01 #column02 p.sentence {
	width: 273px;
}

.vol01 #column01 .spImg img {
	width: 30%;
}

.vol01 .section .img {
	width: 35%;
	padding: 0 10px;
}

.vol01 .section .img > img {
	width: 100%;
}

.vol01 #column02 p.sentence {
	width: 350px;
	font-weight: normal;
}

.vol01 #column02 .ex_img {
	width: 329px;
}

.vol01 #column02 .ex_img .ex_left {
	width: 135px;
}

.vol01 #column02 .ex_img .ex_right {
	width: 173px;
}

.vol01 .section.cf > .flL {
	width: 30%;
	padding: 0 15px;
}

.vol01 .section.cf > .flL img {
	width: 100%;
}

@media screen and (max-width: 767px) {
	.vol01 .section .img {
		width: 60%;
		float: none !important;
		padding: 0;
		margin: 0 auto;
	}
	.vol01 #column01 .spImg img,
	.vol01 #column01 {
		width: 100%;
	}
	.vol01 #column01 p.sentence,
	.vol01 #column02 p.sentence {
		width: 100%;
		margin-left: 0;
	}
	.vol01 #column01 p.spImg {
		width: 40%;
		margin: 0 auto;
		transform: rotate(-90deg);
	}
	.vol01 #column01 p.spImg > img {
		float: none !important;
	}
	.vol01 #column02 .ex_img,
	.vol01 #column02 .ex_img .ex_left,
	.vol01 #column02 .ex_img .ex_right {
		width: 100%;
	}
	.vol01 #column02 .ex_img ul {
		margin-bottom: 20px;
	}
	.vol01 #column02 .ex_img ul li {
		margin-bottom: 20px;
	}
	.vol01 #column02 .ex_img ul li:last-child {
		margin-bottom: 0;
	}
	.vol01 #column02 .ex_img .ex_left,
	.vol01 #column02 .ex_img .ex_right {
		display: table;
	}
	.vol01 #column02 .ex_img .ex_left p,
	.vol01 #column02 .ex_img .ex_right p {
		display: table-cell;
		vertical-align: middle;
	}
	.vol01 #column02 .ex_img .ex_left p:first-child,
	.vol01 #column02 .ex_img .ex_right p:first-child {
		width: 27%;
		padding-right: 10%;
	}
	.vol01 #column02 .ex_img .ex_left p:last-child,
	.vol01 #column02 .ex_img .ex_right p:last-child {
		position: relative;
		padding: 3%;
		background-color: #e7f7ff;
		border-radius: 6px;
		font-size: 115%;
	}
	.vol01 #column02 .ex_img .ex_left p:last-child:before,
	.vol01 #column02 .ex_img .ex_right p:last-child:before {
		content: '';
		position: absolute;
		left: 0;
		top: 30%;
		width: 0;
		height: 0;
		border: 8px solid transparent;
		border-right-color: #e7f7ff;
		border-left: 0;
		margin-top: -8px;
		margin-left: -8px;
	}
	.vol01 .sentence > span {
		display: block;
		margin-bottom: 4%;
	}
	.vol01 .section.cf > .flL {
		float: none !important;
		width: 55%;
		margin: 0 auto 20px;
		padding: 0;
	}
}

/*
r_comonn.cssの内容
---------------------------------*/

/*
side Nav
-----------------------------*/

.mb30Pc{
	margin-bottom: 30px;
}
#side .sideTtl{
	margin-bottom: 20px;
}
#side .sideCont{
	margin-bottom: 30px;
}

@media screen and (max-width: 767px){
	.mb30Pc{
		margin-bottom: 4%;
	}
	#side{
		display: block;
	}
	#side .sideCont{
		margin-bottom: 35px;
	}
	#side .sideTtl {
		font-weight: bold;
		margin: 5% 10px 4% 10px;
		padding-bottom: 5px;
		font-size: 116%;
		text-align: left;
		color: #006bb8;
		background: url(/img/common/ttl_boder.png) no-repeat bottom center;
		background-size: contain;
	}
	#side .sideCont dd{
		margin: 0 10px;
	}
}
/*---SrchBox---*/
.clmnSrchBox form{
	display: table;
	width: 100%;
	border: 1px solid #bebfbf;
	border-radius: 4px;
	overflow: hidden;
	box-sizing: border-box;
}
.clmnSrchBox input[type=text]{
	padding: 5px 10px;
	box-sizing: border-box;
	border: 0;
	font-size: 14px;
	width: 100%;
	display: table-cell;
}
.clmnSrchBox label{
	width: 20%;
	display: table-cell;
	vertical-align: middle;
	color: #fff;
  background-image: linear-gradient( to top, #036cb9 0%, #4893cd 100%);
	text-align: center;
	cursor: pointer;
}
@media screen and (max-width: 767px){
	.clmnSrchBox input[type=text]{
		padding: 10px;
	}
}
/*---side_rank---*/
#side_rank .sideTtl{
	margin-bottom: 5px;
}
#side_rank .rankArticle{
	padding: 15px 0 10px;
	border-bottom: 1px dashed #eee;
	position: relative;
}
#side_rank .rankArticle a{
	display: block;
}
/*---imgBox---*/
#side_rank .rankArticle .imgBox{
	float: left;
	width: 86px;
	height: 57px;
	overflow: hidden;
	border: 1px solid #e8e8e8;
	position: relative;
	box-sizing: border-box;
}
#side_rank .rankArticle .imgBox img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	height: 100%;
	width: auto;
	max-height: 100%;
	max-width: 200%;
}
#side_rank .rankArticle .articleTtl{
	float: right;
	width: 125px;
	font-size: 14px;
	line-height: 1.3;
}
/*main*/
#side_rank .rankArticle.main .imgBox{
	float: none;
	width: 220px;
	height: 140px;
}
#side_rank .rankArticle.main .articleTtl{
	float: none;
	width: 100%;
	margin-top: 5px;
}

/*rank*/
#side_rank .rankArticle:before{
	width: 20px;
	height: 20px;
	line-height: 21px;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	background-color: #bbb;
	color: #fff;
	position: absolute;
	top: 10px;
	left: 0;
	z-index: 2;
}
#side_rank .rankArticle.main:before{
	content: "1";
	width: 24px;
	height: 24px;
	line-height: 25px;
	font-size: 14px;
}
#side_rank .rankArticle:nth-child(-n+3):before{background-color: #feb300;}
#side_rank .rankArticle:nth-child(2):before{content: "2";}
#side_rank .rankArticle:nth-child(3):before{content: "3";}
#side_rank .rankArticle:nth-child(4):before{content: "4";}
#side_rank .rankArticle:nth-child(5):before{content: "5";}
#side_rank .rankArticle:nth-child(6):before{content: "6";}
#side_rank .rankArticle:nth-child(7):before{content: "7";}
#side_rank .rankArticle:nth-child(8):before{content: "8";}
#side_rank .rankArticle:nth-child(9):before{content: "9";}
#side_rank .rankArticle:nth-child(10):before{content: "10";}

@media screen and (max-width: 767px){
	#side_rank .sideTtl{
		margin-bottom: 0;
	}
	#side_rank .rankArea{
		display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	#side_rank .rankArticle{
		width: 48%;
	}
	/*---imgBox---*/
	#side_rank .rankArticle .imgBox,
	#side_rank .rankArticle.main .imgBox{
		float: none;
		width: 100%;
		height: 29vw;
	}
	#side_rank .rankArticle .articleTtl,
	#side_rank .rankArticle.main .articleTtl{
		float: none;
		width: 100%;
		margin-top: 5px;
	}
	/*rank*/
	#side_rank .rankArticle.main:before{
		width: 20px;
		height: 20px;
		line-height: 21px;
		font-size: 12px;
	}
}
/*---side_tag---*/
#side_tag .sideTtl{
	margin-bottom: 15px;
}
#side_tag{
	margin-bottom: 25px;
}
.tagList li{
    display: inline-block;
    margin: 5px 10px 0 0;
}
.tagList a{
	border: 1px solid #5f9cd4;
	color: #006bb8;
	border-radius: 4px;
	display: block;
	padding: 8px 10px;
	font-size: 13px;
	font-weight: bold;
	line-height: 1.2;
	background-color: #fff;
}
@media screen and (max-width: 767px){
	#side_tag .sideTtl{
		margin-bottom: 3%;
	}
	.tagList li{
		margin: 5px 5px 0 0;
	}
	.tagList a{
		padding: 10px 6px;
	}
}
/*---side_bn---*/
#side_bn{
	margin-bottom: 30px;
}
#side_bn .info{
	display: none;
}