@charset "utf-8";
/* CSS Document */
/**共通CSSに移動？**/
.l-backhead {
  opacity: 0;
}

/****/
.mainAreaWrap {}
.mainAreaWrap h1 {
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    padding: 5px 10px;
    border-bottom: 5px solid #137dc7;
}
.mainAreaWrap .mainMv { 
	position: relative;
}
	.mainAreaWrap .mv_badge {
			position: absolute;
			top: 8%;
			width: 21%;
			left: 0;
			right: 0;
			margin: auto;
			}
.mainAreaWrap .mv_badge02 {
			position: absolute;
			top: 3.3%;
			width: 6.5%;
			left: 26%;
			right: 0;
			margin: auto;
			}
.mainAreaWrap .mainMv .img {}
.mainAreaWrap .mainMv .img img {}
.mainAreaWrap .mainMv .img img {}

			
#voice-condselected {
	padding-top: 70px;
    margin-top: -30px;
}
#result {
	padding-top: 70px;
        margin-top: -30px !important;
}


.graphAreaWrap {
    padding: 15px 0 35px;
    background: url("../../images/voice/graph_bg.png")no-repeat;
    background-size: cover;
}
.graphAreaWrap .txt01 {
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    margin-bottom: 10px;
}
.graphAreaWrap .txt01 .__num {
    font-size: 46px;
}
.graphAreaWrap .txt01 .s_f {}
.graphAreaWrap .txt01 sup {}
.graphAreaWrap .graphImg {
    max-width: 536px;
    margin: auto;
}
.graphAreaWrap .graphImg .img {
    position: relative;
}
.graphAreaWrap .graphImg .img img {}
.graphAreaWrap .graphImg .img .__num {
    font-size: 48px;
    color: #af9038;
    font-weight: bold;
    position: absolute;
    top: 117px;
    left: 66px;
}
.graphAreaWrap .graphImg .c-remark {
    color: #fff;
}

.movieAreaWrap {
    margin: 50px auto;
}
.movieAreaWrap .movie {
    text-align: center;
    max-width: 700px;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: auto;
}
.movieAreaWrap .movie iframe {
    width: 100%;
    height: 100%;
}
.movieAreaWrap .txt {
    text-align: center;
    font-size: 22px;
    margin: 30px 0;
    font-weight: 500;
}

.pageLinkWrap {}

.pageLinkWrap .pageLink {
    margin-bottom: 40px;
}

.logoSliderWrap {
    margin: 40px 0;
}
.logoSliderWrap .logo_slider {}
.logoSliderWrap .logo_slider .slick-track {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;  
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;  
}
.logoSliderWrap .logo_slider li {}
.logoSliderWrap .logo_slider li img {
    max-width: 100%;
    width: auto;
}



.voiceBlockWrap {
    margin: 40px 0 0;
}
.voiceBlockWrap .c-heading-seco {
    margin-bottom: 30px;
}
.voiceBlockWrap .topBox {
    background-color: #e6f7ff;
    padding: 30px;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 40px;
}
.voiceBlockWrap .topBox .imgArea {
    max-width: 100px;
    margin-right: 30px;
}
.voiceBlockWrap .topBox .imgArea img {}
.voiceBlockWrap .topBox .txtArea {
    flex: 1;
}
.voiceBlockWrap .topBox .txtArea .txt {
    font-size: 16px;
}
.voiceBlockWrap .voiceBox {
    background-color: #f3f3f3;
    padding: 60px 0;
}
.voiceBlockWrap .voiceBox .voiceList {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.voiceBlockWrap .voiceBox .voiceList .img {
  margin: 10px 0;
}
.voiceBlockWrap .voiceBox .voiceList .img img {}
.voiceBlockWrap .voiceBox .voiceList .box {
  background-color: #fff;
  padding: 20px;
  flex-basis: 50%;
  flex-basis: calc(50% - 20px);
  margin: 10px 0;
}
.voiceBlockWrap .voiceBox .voiceList .box a {
  color: #333;
}
.voiceBlockWrap .voiceBox .voiceList .box a:hover {
    filter: alpha(opacity=80);
    -ms-filter: "alpha(opacity=80)";
    opacity: 0.8;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .imgArea {
  -ms-flex: 0 0 22.73%;
  flex: 0 0 22.73%;
  max-width: 140px;
  margin-right: 15px;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .imgArea img {}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea {}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea .ttl {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea .age {
  background-color: #137dc7;
  display: inline-block;
  color: #fff;
  padding: 3px 7px;
  vertical-align: top;
  width: 15%;
  margin-right: 2%;
  margin-top: 5px;
  text-align: center
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea .name {
  display: inline-block;
  vertical-align: top;
  font-size: 16px;
  width: 80%;
}
.voiceBlockWrap .voiceBox .voiceList .box .tag {
  margin-top: 15px;
}
.voiceBlockWrap .voiceBox .voiceList .box .tag li {
  background-color: #e6f7ff;
  display: inline-block;
  margin-right: 10px;
  padding: 3px 5px;
}
.voiceBlockWrap .voiceBox .caution {
  font-size: 1.2rem;
  color: #666666;
}

.voiceBlockWrap .voiceBox .voiceList .box .nameBox .imgArea figure {
    position: relative;
    padding-bottom: 100%;
    height: 0;
    overflow: hidden;
}

.voiceBlockWrap .voiceBox .voiceList .box .nameBox .imgArea figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}



/**SP**/
@media (max-width: 767px) {
.mainAreaWrap {}
.mainAreaWrap h1 {
    font-size: 4.2vmin;
    padding: 1vmin;
}
.mainAreaWrap .mainMv {}
.mainAreaWrap .mainMv .img {}
.mainAreaWrap .mainMv .img img {}
.mainAreaWrap .mainMv .img img {}

.graphAreaWrap {
    padding: 2vmin 0 4vmin;
}
.graphAreaWrap .txt01 {
    font-size: 5vmin;
    line-height: 1.2;
}
.graphAreaWrap .txt01 .__num {
    font-size: 8vmin;
}
.graphAreaWrap .txt01 .s_f {
    font-size: 4vmin;
}
.graphAreaWrap .txt01 sup {}  
.graphAreaWrap .graphImg {}
.graphAreaWrap .graphImg .img {}
.graphAreaWrap .graphImg .img img {}
.graphAreaWrap .graphImg .img .__num {}  
.graphAreaWrap .graphImg .c-remark {
    font-size: 2vmin;
}  
#voice-condselected {
    padding-top: 38vmin;
    margin-top: -33vmin;
}
	#result {
    padding-top: 25vmin;
    margin-top: -15vmin !important;
}

.movieAreaWrap {
    margin: 8vmin auto 0;
}
.movieAreaWrap .movie {}
.movieAreaWrap .movie iframe {}
.movieAreaWrap .txt {
    margin: 0 0 6vmin;
    font-size: 3.6vmin;
    text-align: left;
}
  
.pageLinkWrap {
    margin-top: 0;
}

.pageLinkWrap .pageLink {
    margin-bottom: 6vmin;
}
  
.logoSliderWrap {}
.logoSliderWrap .logo_slider {}
.logoSliderWrap .logo_slider li {}
.logoSliderWrap .logo_slider li img {}  

 
.voiceBlockWrap {
    margin: 8vmin 0 0;
}
.voiceBlockWrap .c-heading-seco {}
.voiceBlockWrap .topBox {
    padding: 4vmin;
    -webkit-box-align: normal;
    -ms-flex-align: normal;
    align-items: normal;
    margin-bottom: 7vmin;
}
.voiceBlockWrap .topBox .imgArea {
    width: 25.37%;
    max-width: none;
    margin-right: 3vmin;
}
.voiceBlockWrap .topBox .imgArea img {}
.voiceBlockWrap .topBox .txtArea {}
.voiceBlockWrap .topBox .txtArea .txt {
    font-size: 3.4vmin;
}  

.voiceBlockWrap .voiceBox {
    padding: 4vmin 0;
}
#area03.voiceBlockWrap .voiceBox,
#area05.voiceBlockWrap .voiceBox {
  padding-bottom: 10vmin;
}   
.voiceBlockWrap .voiceBox .voiceList {}
.voiceBlockWrap .voiceBox .voiceList .img {}
.voiceBlockWrap .voiceBox .voiceList .img img {}
.voiceBlockWrap .voiceBox .voiceList .box {
flex-basis: 100%;
flex-basis: auto;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox {}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .imgArea {
    -ms-flex: 0 0 20.9%;
    flex: 0 0 20.9%;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .imgArea img {}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea {}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea .ttl {font-size: 3.6vmin;}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea .age {
font-size: 2.8vmin;
width: 20%;
margin-top: 1vmin;
}
.voiceBlockWrap .voiceBox .voiceList .box .nameBox .txtArea .name {
width: 75%;
font-size: 2.8vmin;
}
.voiceBlockWrap .voiceBox .voiceList .box .tag {}
.voiceBlockWrap .voiceBox .voiceList .box .tag li {
font-size: 2.8vmin;
margin-right: 1.5%;
margin-bottom: 1%;
}
}
/**s_SP**/
@media (max-width: 590px) {
.graphAreaWrap .graphImg .img .__num {
    font-size: 8vmin;
    top: 20vmin;
    left: 11vmin;
}    
}




/**-----------------------------------------
CTA
-----------------------------------------**/
.dotList {
    list-style: disc;
    margin-left: 20px;
}
.dotList li {
    font-size: 16px;
}
.dotList li::marker {
  color: #004896;
}
.ctaBlockWrap {
    margin-top: 100px;
}  
.ctaBlockWrap .ttlArea {
  background: url("../../images/cta/cta_ttl_bg.png")no-repeat;
  border-top: 10px solid #1d4691;
  background-size: cover;
  background-position: center;
  height: 300px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 40px;
  text-align: center;
  }  
.ctaBlockWrap .ttlArea .ttlIn {}  
.ctaBlockWrap .ttlArea h2.__ttl {
    color: #fff;
    font-size: 50px;
    font-family: 'Noto Serif JP', serif;
    margin-bottom: 20px;
}  
.ctaBlockWrap .ttlArea .__txt {
    color: #fff;
    font-family: 'Noto Serif JP', serif;
    font-size: 18px;
}  
.ctaBlockWrap .ctaBlock {}  
.ctaBlockWrap .ctaBlock .ctaBox {
    border: 1px solid #dcdcdc;
    padding: 40px 55px;
    margin: 30px 0;
} 
.ctaBlockWrap .ctaBlock .ctaBox .__ttl {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 30px;
}
.ctaBlockWrap .ctaBlock .ctaBox .__ttl .small {
    font-size: 16px;
}  
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 20px;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .imgArea {
    width: 100%;
    max-width: 120px;
    margin-right: 40px;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .imgArea img {} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .txtArea {
    width: 53%;
    flex: 1;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .txtArea .checkList {
    margin-bottom: 30px;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .txtArea .checkList li {
    margin: 0 0 20px;
} 
.ctaBlockWrap .ctaBlock .ctaBox .txt_b {font-size: 16px; margin-bottom: 15px;}
.ctaBlockWrap .ctaBlock .ctaBox .btn {
    text-align: center;
    margin-top: 5px;
} 
.ctaBlockWrap .ctaBlock .ctaBox .btn a {
    display: inline-block;
    width: 100%;
    padding: 10px 10px 10px;
    font-size: 18px;
    background-color: #f6e746;
    color: #001625;
    font-weight: bold;
    position: relative;
} 
.ctaBlockWrap .ctaBlock .ctaBox .btn a:hover {
	    background-color: #FFF590;
}
.ctaBlockWrap .ctaBlock .ctaBox .btn a:hover:before {

}
.ctaBlockWrap .ctaBlock .ctaBox .btn a::before {
  content: "";
  width: 10px;
  height: 10px;
  border-top: solid 2px #333333;
  border-right: solid 2px #333333;
  position: absolute;
  left: 15px;
  top: 49%;
  transform: rotate(45deg);
  display: block;
  -webkit-transform: rotate(45deg) translateY(-50%) translateX(0%);
  transform: rotate(45deg) translateY(-50%) translateX(0%);
}  
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t02 a {
    background-color: #1d4691;
    color: #fff;
}  
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t02 a::before {
    border-top: solid 2px;
    border-right: solid 2px;
}
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t03 a {
    background-color: transparent;
    border: 1px solid #1d7fc8;
    color: #1d7fc8;
}  
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t03 a::before {
    border-top: solid 2px;
    border-right: solid 2px;
}
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t03 a:hover {
    background-color: #1d7fc8;
    color: #fff;
}   
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t03 a::before:hover {}  
.ctaBlockWrap .ctaBlock .ctaBox .btnTxt {
    max-width: 340px;
    margin: auto;
    margin-top: 15px;
    width: 100%;
    font-size: 18px;  
  }
.ctaBlockWrap .ctaBlock .ctaBox .btnTxt a {
display: block;
    text-decoration: underline;  
  }

.morePageLinkWrap {
    background-color: #e6f7ff;
    padding: 40px 0 50px;
    margin-top: 60px;
}
.morePageLinkWrap .txt01 {
    text-align: center;
    font-size: 22px;
    margin-bottom: 25px;
    font-weight: 500;
}
.morePageLinkWrap .c-button-container {
    gap: 20px;
}
.morePageLinkWrap .c-button-container .c-button {}
@media (min-width: 768px) {
.ctaBlockWrap .ctaBlock {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.ctaBlockWrap .ctaBlock .ctaBox {
    width: 100%;
    max-width: 700px;
    margin: auto;
}
.ctaBlockWrap .ctaBlock .ctaBox.flBox {
    width: 48%;
    padding-bottom: 50px;
}
.ctaBlockWrap .ctaBlock .ctaBox.flBox .ctaBoxIn {
    display: block;
}
.ctaBlockWrap .ctaBlock .ctaBox.flBox .ctaBoxIn .imgArea {
    width: 100%;
    margin: auto;
    text-align: center;
    min-height: 250px;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.ctaBlockWrap .ctaBlock .ctaBox.flBox .ctaBoxIn .imgArea img {
    max-width: 300px;
    max-height: 250px;
    margin: auto;
}  
.ctaBlockWrap .ctaBlock .ctaBox.flBox .ctaBoxIn .txtArea {
    width: 100%;
}
  
  }  
@media (max-width: 767px) {
.dotList {}
.dotList li {
    font-size: 3.4vmin;
}  
.dotList li::marker {
  font-size: 3vmin;
}  
.ctaBlockWrap {
    margin-top: 14vmin;
}  
.ctaBlockWrap .ttlArea {
    height: 50vw;
}  
.ctaBlockWrap .ttlArea h2.__ttl {
    font-size: 6vmin;
    margin-bottom: 4vmin;
}  
.ctaBlockWrap .ttlArea .__txt {
    font-size: 3vmin;
}  
.ctaBlockWrap .ctaBlock {}  
.ctaBlockWrap .ctaBlock .ctaBox {
    padding: 4vmin;
} 
.ctaBlockWrap .ctaBlock .ctaBox .__ttl {
    font-size: 4.3vmin;
    margin-bottom: 5vmin;
} 
.ctaBlockWrap .ctaBlock .ctaBox .__ttl .small {
  font-size: 3vmin;
}  
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn {
    margin-bottom: 3vmin;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .imgArea {
    max-width: 26.87%;
    margin-right: 4vmin;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .imgArea img {} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .txtArea {
    width: 62%;
    margin-top: 0;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .txtArea .checkList {
    margin-bottom: 4vmin;
} 
.ctaBlockWrap .ctaBlock .ctaBox .ctaBoxIn .txtArea .checkList li {
    background-size: 4vmin;
    padding-left: 5vmin;
    margin-bottom: 3vmin;
    font-size: 2.8vmin;
}
.ctaBlockWrap .ctaBlock .ctaBox .txt_b {
    font-size: 3.8vmin;
}  
.ctaBlockWrap .ctaBlock .ctaBox .btn {} 
.ctaBlockWrap .ctaBlock .ctaBox .btn a {
    font-size: 4.3vmin;
    padding: 4vmin 2vmin;
} 
.ctaBlockWrap .ctaBlock .ctaBox .btn a::before {
    width: 8px;
    height: 8px;
}
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t02 a {}  
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t02 a::before {}
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t03 a {}  
.ctaBlockWrap .ctaBlock .ctaBox .btn.btn_t03 a::before {}   
.ctaBlockWrap .ctaBlock .ctaBox .btnTxt {
    font-size: 3vmin;
    margin-top: 2vmin;
}
.ctaBlockWrap .ctaBlock .ctaBox .btnTxt a {}  
  
.morePageLinkWrap {
    margin-top: 9vmin;
    padding: 4vmin 0 8vmin;
}
.morePageLinkWrap .txt01 {
    font-size: 4.6vmin;
}
.morePageLinkWrap .c-button-container {}
.morePageLinkWrap .c-button-container .c-button {}  
  }