@charset "UTF-8";

/*=====================================================
 
アンケートページ

=====================================================*/

.il1040-500,
.il990-768,
.il960-768,
.il920-768,
.il420-360,
.il990,
.il790,
.il768,
.il767,
.il680,
.il640,
.il620,
.il540,
.il451,
.il421,
.il411,
.il420,
.il380,
.il375{ display: none; }

@media print, screen and (max-width: 1040px) and (min-width: 500px){ .il1040-500{ display: inline;} }
@media print, screen and (max-width: 990px) and (min-width: 768px) { .il990-768{ display: inline; } }
@media print, screen and (max-width: 960px) and (min-width: 768px) { .il960-768{ display: inline; } }
@media print, screen and (max-width: 920px) and (min-width: 768px) { .il920-768{ display: inline; } }
@media print, screen and (min-width: 790px) { .il790{ display: inline; } }
@media print, screen and (min-width: 768px) { .il768{ display: inline; } }
@media print, screen and (max-width: 420px) and (min-width: 360px) { .il420-360{ display: inline; } }
@media print, screen and (min-width: 451px) { .il451{ display: inline; } }
@media print, screen and (min-width: 421px) { .il421{ display: inline; } }
@media print, screen and (min-width: 411px) { .il411{ display: inline; } }
@media print, screen and (min-width: 380px) { .il380{ display: inline; } }
@media print, screen and (min-width: 375px) { .il375{ display: inline; } }

@media print, screen and (max-width: 990px) { .il990{ display: inline; } }
@media print, screen and (max-width: 767px) { .il767{ display: inline; } }
@media print, screen and (max-width: 680px) { .il680{ display: inline; } }
@media print, screen and (max-width: 640px) { .il640{ display: inline; } }
@media print, screen and (max-width: 620px) { .il620{ display: inline; } }
@media print, screen and (max-width: 540px) { .il540{ display: inline; } }
@media print, screen and (max-width: 420px) { .il420{ display: inline; } }
@media print, screen and (max-width: 374px) { .il374{ display: inline; } }

.pl10-991-768,
.pl10-350 { padding-left: 1em; }

@media print, screen and (max-width: 990px) and (min-width: 768px) { .pl10-991-768{ padding-left: 0; } }
@media print, screen and (max-width: 351px) { .pl10-350{ padding-left: 0; } }

.flex{
	-js-display: flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	
}

.reco-header{ width: 100%; }
.reco-header > div.reco-header-txt{
	background-size: 32px 32px;
	background-position: 50% 50%;
	background-image:
	repeating-linear-gradient(
	90deg,
	#ccc ,
	#ccc 1px,
	transparent 1px,
	transparent 32px
	),
	repeating-linear-gradient(
	0deg,
	#ccc ,
	#ccc 1px,
	#fff 1px,
	#fff 32px
	);
}
.reco-header > div.reco-header-img{ min-height: 0%; }
.reco-header > div.reco-header-img > img{ height: auto;}
@media print, screen and (min-width: 768px) {
	.reco-header > div.reco-header-txt{
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 0;
		order: 0;
		padding: 30px;
	}
	.reco-header > div.reco-header-img{
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
	}
}
@media print, screen and (max-width: 767px) {
	.reco-header{
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.reco-header > div.reco-header-txt {
		padding: 10px;
		text-align: center;
	}
}

/*=====================================================
 
見出し

=====================================================*/

p.reco-balloon01{
	background: #dedede;
	font-size: 140%;
	line-height: 1.4;
	position: relative;
	padding: 20px 10px;
}
@media print, screen and (min-width: 768px) {
	p.reco-balloon01{ max-width: 450px; }
}
@media print, screen and (max-width: 767px) {
	p.reco-balloon01{ margin: 0 auto 4rem; }
}

p.reco-balloon01:before{
	content: '';
	position: absolute;
	display: block;
	top: 100%;
	left: calc( 50% - 20px );
	border: 20px solid transparent;
	border-top: 20px solid #dedede;
}

p.reco-balloon01 > i{ padding-left: 5px; }

@media print, screen and (min-width: 768px) {
	.reco-heading .header-chart{ width: 40%; }
	.reco-heading .header-chart.hcleft{ margin-right: 20px; }
	.reco-heading .header-chart.hcright{ margin-left: 20px; }
	.reco-heading .header-part{ width: calc( 60% - 20px ); }
}
@media print, screen and (max-width: 767px) {
	.reco-heading .header-chart{
		margin: 0 auto 3rem;
		max-width: 500px;
		width: 100%;
	}
	.reco-heading .header-part > div:first-of-type{
		text-align: center;
	}
}

@media print, screen and (min-width: 768px) {
	.reco-heading .header-part-txt {
		background: rgba(255,255,255,0.7);
		padding: 10px;
	}
	.reco-heading .header-part-txt.htpleft{ margin-right: -10%; }
	.reco-heading .header-part-txt.htpright{ margin-left: -10%; }
}

@media print, screen and (max-width: 767px) {
	.reco-heading .header-part-img{
		margin: 0 auto 2rem;
		max-width: 240px;
		width: 100%;
	}
}

/*=====================================================
 
パートナー一覧

=====================================================*/
.partner-introduction > ul > li{ font-size: 0; }
@media print, screen and (min-width: 768px) {
	.partner-introduction > ul{ font-size: 0; }
	.partner-introduction > ul > li{
		display: inline-block;
		margin-top: 30px;
		vertical-align: top;
		width: calc( ( 100% - 20px ) / 2 - 0.1px );
	}
	.partner-introduction > ul > li:nth-of-type(odd){ margin-right: 20px; }
	.partner-introduction > ul > li:first-of-type,
	.partner-introduction > ul > li:nth-of-type(2){ margin-top: 0; }

}
@media print, screen and (max-width: 767px) {
	.partner-introduction > ul > li{
		margin-top: 3rem;
		width: 100%;
	}
	.partner-introduction > ul > li:first-of-type{ margin-top: 0; }
}

.partner-introduction > ul > li > div{
	font-size: 1.6rem;
	display: inline-block;
	vertical-align: top;
}
.partner-introduction > ul > li > div.part-intro-img{
	margin-right: 10px;
	max-width: 140px;
	width: 30%;
}
.partner-introduction > ul > li > div.part-intro-txt{ width: calc( 70% - 10px - 0.1px ); }

/*=====================================================
 
その他、コメント

=====================================================*/

.reco-comment-other .reco-comment-header{
	margin-right: auto;
	margin-left: auto;
	max-width: 560px;
	width: 100%;
}
#reco-partner03 .reco-comment-other .reco-comment-header{ max-width: 300px; }
#reco-partner04 .reco-comment-other .reco-comment-header{ max-width: 600px; }


.reco-comment-other .reco-comment li{
	font-size: 0;
	margin-top: 20px;
}
.reco-comment-other .reco-comment li:first-of-type{ margin-top: 0; }

.reco-comment-other .reco-comment li > div{
	display: inline-block;
	font-size: 1.6rem;
	vertical-align: middle;
}

.reco-comment-other .reco-comment li > div.reco-comment-img{ width: 80px; }

.reco-comment-other .reco-comment li > div.reco-comment-txt-left,
.reco-comment-other .reco-comment li > div.reco-comment-txt-right{ width: calc( 100% - 80px - 40px ); }

.reco-comment-other .reco-comment li > div.reco-comment-txt-left{ margin-right: 40px; }
.reco-comment-other .reco-comment li > div.reco-comment-txt-right{ margin-left: 40px; }

.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p,
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p{
	border: 1px solid #d3d3d3;
	padding: 20px;
	position: relative;
	width: 100%;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p:before,
.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p:after,
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p:before,
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p:after{
	content: '';
	position: absolute;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p:before,
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p:before{
	border: 18px solid transparent;
	top: calc( 50% - 18px );
	z-index: 2;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p:after,
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p:after{
	border: 20px solid transparent;
	top: calc( 50% - 20px );
	z-index: 1;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p:before{
	border-left: 18px solid #FFF;
	right: -36px;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-left > p:after{
	border-left: 20px solid #d3d3d3;
	right: -40px;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p:before{
	border-right: 18px solid #FFF;
	left: -36px;
}
.reco-comment-other .reco-comment li > div.reco-comment-txt-right > p:after{
	border-right: 20px solid #d3d3d3;
	left: -40px;
}