/* = home
-------------------------------------------------------------- */

#voice{
	padding-top:85px;
}

.keyVisual{
	position:relative;
	z-index:0;
	background-color:#F7F5F5;
	padding:20px 0;
}

.slideTopVoice{
	opacity:0;
}

.contentWrap{
	padding-top:80px;
	padding-bottom:160px;
}

.dotted {
	width:100% !important;
	height:20px;
}

.dotted line{
	fill: none;
	stroke: #058DBF;
	stroke-width: 5;
	stroke-linecap: round;
         /* 線の端の部分を丸く、四角はsquare*/
	stroke-dasharray: 0.5, 10;
}

.homeVoice{
	padding-top:72px;
	padding-bottom:72px;
}
.titleVoice{
	text-align:center;
}
.titleVoice img{
	width:581.53px;
}
.textVoice{
	font-size:16px;
	line-height:1.875em;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:center;
	margin-top:35px;
}

.slideTopVoice .slideItem a{
	position:relative;
	width:100%;
	height:100%;
	display:block;
}
.slideTopVoice .slideItem a{
	position:relative;
	padding:7px;
}
.voiceTextWrap{
	width:70%;
	min-width:200px;
	margin:8px auto;
}
.voiceTitle{
	font-size:16px;
	line-height:1.7777em;
	letter-spacing:.01em;
	font-weight:bold;
	text-align:center;
	color:#222222;
}
.voicePosition{
	font-size:12px;
	line-height:12px;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:center;
	color:#222222;
	margin-bottom:8px;
}

.voiceName{
	font-size:16px;
	line-height:21px;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:center;
	color:#222222;
}
.voiceName span{
	font-size:13px;
}
.voiceNameBig{
	font-size:20px !important;
	letter-spacing:.2em;
	font-weight:300 !important;
}

.voiceCatchWrap{
	background-color:#ffffff;
	padding:36px 0;
	padding-top:44px;
}
.titleVoice{
	width:484.84px;
	margin:0 auto;
}
.titleVoice img{
	width:100%;
}
.textVoice{
	font-size:16px;
	line-height:1.875em;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:center;
	color:#222222;
}
.voiceGrid{
	width:100%;
	display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
            flex-wrap:wrap;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    }
.voiceGrid li{
	width:518.5px;
	height:350px;
	background-color:#ffffff;
	border-radius:5px;
	border:solid 1px #D0D0D0;
	margin-bottom:50px;
}
.voiceGrid li:hover{
	background-color:#E95E1C;
}
.voiceGrid li a{
	display:block;
	width:100%;
	height:100%;
	padding:28px;
	position:relative;
}
.voiceGrid .thum{
	width:162px;
	float:left;
}
.voiceGrid .thum svg{
	width:100%;
	height:auto;
}
.voiceGrid .textWrap{
	width:280px;
	float:right;
}
.gridTitle{
	font-size:22px;
	line-height:1.5em;
	letter-spacing:.05em;
	font-weight:bold;
	text-align:left;
}
.voiceGrid li:hover .gridTitle{
	color:#ffffff;
}
.gridPosition{
	font-size:16px;
	line-height:1em;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:left;
	margin-top:20px;
}
.voiceGrid li:hover .gridPosition{
	color:#ffffff;
}
.gridName{
	font-size:22px;
	line-height:1.4em;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:left;
	margin-top:16px;
}
.gridNameBig{
	font-size:26px !important;
	letter-spacing:.2em;
	font-weight:300 !important;
}
.voiceGrid li:hover .gridName{
	color:#ffffff;
}
.gridName span{
	font-size:16px;
}
.textWrap .btn{
	position:absolute;
	bottom:30px;
	left:210px;
	display:block;
	width:257px;
	font-size:12px;
	line-height:60px;
	letter-spacing:.01em;
	font-weight:normal;
	text-align:center;
	border:solid 1px #707070;
	margin-top:36px;
	background-color:#ffffff;
}
.voiceGrid li:hover .textWrap .btn{
	color:#E95E1C;
	border:solid 1px #E95E1C;
}
.textWrap .btn::after{
	position:absolute;
	content:"";
	width:6px;
	height:11px;
	right:16px;
	top:24px;
	background-image:url(/share/imgs/cp/images/arrow@2x.png);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center;
}
.voiceGrid li:hover .textWrap .btn::after{
	background-image:url(/share/imgs/cp/images/arrowRed@2x.png);
}


/* = Media (Responsive Setting)
-------------------------------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 1079px) {

#voice{
	padding-top:58px;
}
.keyVisual{
	padding:14px 0;
}
.contentWrap{
	padding-top:56px;
	padding-bottom:112px;
}
.homeVoice{
	padding-top:50.4px;
	padding-bottom:50.4px;
}
.titleVoice img{
	width:407.071px;
}
.textVoice{
	font-size:11.2px;
	margin-top:24.5px;
}
.voiceTextWrap{
	min-width:160px;
	margin:5.6px auto;
}
.voiceTitle{
	font-size:13px;
}
.voicePosition{
	font-size:10px;
	line-height:12px;
	margin-bottom:5.6px;
}
.voiceName{
	font-size:11.2px;
	line-height:14.7px;
}
.voiceName span{
	font-size:10px;
}
.voiceNameBig{
	font-size:15px !important;
}
.voiceCatchWrap{
	background-color:#ffffff;
	padding:36px 0;
	padding-top:44px;
}
.titleVoice{
	width:339.388px;
}
.titleVoice img{
	width:100%;
}
.textVoice{
	font-size:13px;
}
.voiceGrid{

}
.voiceGrid li{
	width:362.95px;
	margin-bottom:35px;
	height:240px;
}
.voiceGrid li a{
	padding:22px;
}
.voiceGrid .thum{
	width:129.6px;
}
.voiceGrid .textWrap{
	width:174px;
}
.gridTitle{
	font-size:14px;
	letter-spacing:.025em;
}
.gridPosition{
	font-size:11.2px;
	margin-top:14px;
}
.gridName{
	font-size:15.4px;
	margin-top:11.2px;
}
.gridName span{
	font-size:11.2px;
}
.gridNameBig{
	font-size:18px !important;
}
.textWrap .btn{
	width:160px;
	left: 166px;
	bottom:20px;
	font-size:13px;
	line-height:42px;
	margin-top:25.2px;
}
.textWrap .btn::after{
	width:4.2px;
	height:7.7px;
	right:11.2px;
	top:16.8px;
}

} /*Query End*/
@media only screen and (max-width: 767px) {

#voice{
	padding-top:48px;
}
.keyVisual{
	padding:14px 0;
}
.contentWrap{
	padding-top:28px;
	padding-bottom:56px;
}
.homeVoice{
	padding-top:25.2px;
	padding-bottom:25.2px;
}
.titleVoice img{
	width:407.071px;
}
.textVoice{
	font-size:11.2px;
	margin-top:24.5px;
}
.slideTopVoice{
	margin-top:-12px;
}
.voiceTextWrap{
	min-width:160px;
	margin:5.6px auto;
	margin-top:-8px;
}
.voiceTitle{
	font-size:13px;
}
.voicePosition{
	font-size:10px;
	line-height:12px;
	margin-bottom:5.6px;
}
.voiceName{
	font-size:11.2px;
	line-height:14.7px;
}
.voiceName span{
	font-size:10px;
}
.voiceNameBig{
	font-size:15px !important;
}
.voiceCatchWrap{
	background-color:#ffffff;
	padding:36px 0;
	padding-top:44px;
}
.titleVoice{
	width:305.55px;
}
.titleVoice img{
	width:100%;
}
.textVoice{
	font-size:13px;
}

.voiceGrid li{
	width:100%;
	height:auto;
	margin-bottom:17.5px;
}
.voiceGrid li a{
	padding:14.4px;
}
.voiceGrid .thum{
	width:103.68px;
}
.voiceGrid .textWrap{
	width:174px;
}
.gridTitle{
	font-size:14px;
	letter-spacing:.025em;
}
.gridPosition{
	font-size:11.2px;
	margin-top:14px;
}
.gridName{
	font-size:15.4px;
	margin-top:11.2px;
}
.gridNameBig{
	font-size:18px !important;
}
.gridName span{
	font-size:11.2px;
}
.textWrap .btn{
	position:relative;
	bottom:auto;
	left:auto;
	width:160px;
	font-size:13px;
	line-height:42px;
	margin-top:25.2px;
}
.textWrap .btn::after{
	width:4.2px;
	height:7.7px;
	right:11.2px;
	top:16.8px;
}

} /*Query End*/
@media only screen and (min-width: 768px) {

.slideTopVoice li a:hover svg{
	-webkit-transform: scale(1.04);
	transform: scale(1.04);
	-webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    transform-origin:center center;

}
.slideTopVoice li a:hover .voiceTitle{
	color:#058DBF !important;
}
.slideTopVoice li a:hover .voicePosition{
	color:#058DBF !important;
}
.slideTopVoice li a:hover .voiceName{
	color:#058DBF !important;
}

} /*Query End*/