@charset "UTF-8";

/*-------------------------
__style
-------------------------*/

.voice_list{ margin-bottom: 30px;}
.voice_list ul li{ border: 2px solid #00349f; box-sizing: border-box;}
.voice_list ul li{
    background-color: #fff;
	float:left;
	margin-right:20px;
    margin-top: 20px;
	width: 25%;
	width: calc((100% - 60px) / 4);
	width: -webkit-calc((100% - 60px) / 4);
	width: -moz-calc((100% - 60px) / 4);
	box-sizing:border-box;
	border-radius: 5px;
	/*-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;*/}
.voice_list ul li:hover{ filter:alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7;}
@media screen and (min-width: 768px) {
.voice_list ul li:nth-child(4n){ margin-right: 0;}
}
.voice_list ul li .v_name{ font-size: 2em; color: #00349f; font-weight: 700; padding: 13px 10px 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width:100%;}
.voice_list ul li .v_photo{ background-color:#e6ebf6; padding:10px; box-sizing:border-box;}
.voice_list ul li .v_photo .inner{ width: 100%; height: 170px; overflow: hidden; position: relative;}
.voice_list ul li .v_photo .inner img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: auto; height: 100%;}
.voice_list ul li .v_text{ padding: 10px; margin-bottom: 10px; font-size: 1.3em; line-height: 1.5em; height: 65px; overflow: hidden; box-sizing: border-box;}
.voice_list ul li .v_btn{ text-align: center; padding: 0 10px 10px;}
.voice_list ul li .v_btn a{ display: block; background-color: #373332; color: #fff; text-decoration: none; font-size: 1.3em; padding: 12px 10px 10px;}

@media screen and (max-width: 767px) {

.voice_list{ margin-bottom: 15px;}
.voice_list ul li{
    background-color: #fff;
	float:left;
	margin-right:10px;
    margin-top: 10px;
	width: 33.33333%;
	width: calc((100% - 20px) / 3);
	width: -webkit-calc((100% - 20px) / 3);
	width: -moz-calc((100% - 20px) / 3);
	box-sizing:border-box;
	border-radius: 5px;}
.voice_list ul li:nth-child(3n){ margin-right: 0;}
.voice_list ul li .v_name{ font-size: 1.4em; padding: 8px;}
.voice_list ul li .v_photo{ padding:5px;}
.voice_list ul li .v_photo .inner{ width: 100%; height: 80px; overflow: hidden; position: relative;}
.voice_list ul li .v_text{ padding: 5px; margin-bottom: 10px; font-size: 1.1em; line-height: 1.3em; height: 46px; overflow: hidden; box-sizing: border-box;}
.voice_list ul li .v_btn{ text-align: center; padding: 0 5px 5px;}
.voice_list ul li .v_btn a{ display: block; background-color: #373332; color: #fff; text-decoration: none; font-size: 1.2em; padding: 8px;}

}

.pdf_list{}
.pdf_list ul li{
	float:left;
	margin-right:20px;
    margin-top: 20px;
	width: 25%;
	width: calc((100% - 80px) / 5);
	width: -webkit-calc((100% - 80px) / 5);
	width: -moz-calc((100% - 80px) / 5);
	box-sizing:border-box;
	position: relative;
	border-bottom: 2px solid #ccc;}
@media screen and (min-width: 768px) {
.pdf_list ul li:nth-child(5n){ margin-right: 0;}
}
.pdf_list ul li a{ display: block; background-color:#eee; text-decoration: none; color: #373332; border-left: 10px solid #1785e8; font-size: 1.3em; padding: 15px 12px 12px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
.pdf_list ul li a span.new{ background-color: red; color: #fff; padding: 5px 7px 2px; border-radius: 5px; display: block; position: absolute; top: 10px; right: 10px;}
.pdf_list ul li a:hover{ background-color: #1785e8; color: #fff;}
.pdf_list ul li a img{ width: 1px; height: auto; /*display: none;*/}


@media screen and (max-width: 767px) {

.pdf_list ul li{
	float:left;
	margin-right:10px;
    margin-top: 10px;
	width: 50%;
	width: calc((100% - 10px) / 2);
	width: -webkit-calc((100% - 10px) / 2);
	width: -moz-calc((100% - 10px) / 2);
	box-sizing:border-box;
	position: relative;
	border-bottom: 2px solid #ccc;}
.pdf_list ul li:nth-child(2n){ margin-right: 0;}
.pdf_list ul li a{ font-size: 1.2em; padding: 10px 8px 8px; border-left: 5px solid #1785e8;}
.pdf_list ul li a span.new{ background-color: red; color: #fff; padding: 4px 7px 3px; border-radius: 5px; display: block; position: absolute; top: 6px; right: 6px;}
.pdf_list ul li a:hover{ background-color: #1785e8; color: #fff;}

}


/*-----------------詳細PDF_CSS-----------------*/

.voice_pdf_box{
    width: 700px;
    margin: 20px auto;
    border: 5px solid #ddd;
    text-align: center;
    padding: 20px;
    box-sizing: border-box;}

.voice_pdf_box h1{ color: #fff; background-color: #00349f; font-size: 1.9em; line-height: 1.2em; padding: 17px 15px 15px; margin: 0 0 15px 0;}
.voice_pdf_box input[type="button"]{background-color: transparent; cursor: pointer; outline: none; appearance: none; cursor: pointer;
  position: relative;
    font-size: 1.3em;
  display: inline-block;
  padding: 8px 10px 5px;
  text-decoration: none;
  color: #FFF;
  background: #777;/*色*/
  border: solid 1px #666;/*線色*/
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
  text-shadow: 0 1px 0 rgba(0,0,0,0.2);}


#example_morephoto{ padding-top: 60px;}
.survey_btn{ width: 300px; margin: 0 auto 20px; text-align: center;}
.survey_btn a{ display: block; background-color: #00349f; color: #fff; font-size: 18px; font-weight: 700; text-decoration: none; padding: 20px 15px 15px; border-radius: 30px;
-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
.survey_btn a:hover{filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;}

@media screen and (max-width: 767px) {

#example_morephoto{ padding-top: 0px;}
.survey_btn{ width: 100%;}
.survey_btn a{ font-size: 18px;  padding: 15px 0px 12px;}

}

@media screen and (max-width: 374px) {
.voice_list ul li .v_name{font-size: 1.1em;}
}