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

   mixin

===========================================================================*/
/*--------------------------------------------------------------------------
   overwrite
---------------------------------------------------------------------------*/
.g-header .gnav__item--07 a {
  color: #0B8943;
}

.page-voice .l-page-wrapper {
  overflow: hidden;
}

.m-intro__obj-slide {
  height: 111px;
}

.page-voice .m-page-mv__body::before{
  display: none;
}

.page-voice .m-page-mv__hdg,
.page-voice .m-page-mv__txt{
  color: #111111;
}

/*--------------------------------------------------------------------------
   common
---------------------------------------------------------------------------*/
/* section
-----------------------------------------------------------------*/

.icon_no1 img{width: 270px; height: 270px;}
.icon_no1{
  position: absolute;
  bottom: 30px; right: 30px;
  z-index: 2;
}

/*--------------------------------------------------------------------------
   obi_ttl
---------------------------------------------------------------------------*/

.obi_ttl{
  background: #00375A;
  background: linear-gradient(145deg, rgba(0, 55, 90, 1) 35%, rgba(32, 120, 163, 1) 100%);
  position: relative;
  padding: 3% 0;
}
.obi_ttl::after{
  content: '';
  display: block;
  position: absolute;
  top: 0; left: 0;
  z-index: 1;
  width: 100%; height: 100%;
  background: url(../../img/voice/bgTexture.png) repeat;
}

.yellow_gradation{
  background: linear-gradient(90deg, #FEEF78, #F5D62F);
  background: -webkit-linear-gradient(0deg, #FEEF78, #F5D62F);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.obi_ttl h2{
  text-align: center;
  position: relative;
  z-index: 2;
  max-width: 1000px;
  margin: auto;
}
.obi_ttl h2 img{
  max-width: 100%;
}
.obi_ttl p{
  text-align: center;
  font-size: 32px;
  line-height: 1.4;
  position: relative;
  z-index: 2;
  font-family: "Noto Serif JP", serif, sans-serif;
  padding-top: 16px;
}

.en{font-family: "Playfair Display", serif;}
.ja{font-family: "Noto Serif JP", serif, sans-serif;}


/*--------------------------------------------------------------------------
   voicelink_tab
---------------------------------------------------------------------------*/

.voicelink_tab {font-family: "Noto Serif JP", serif, sans-serif;}
.voicelink_tab ul{
  display: flex;
  justify-content: space-between;
}
.voicelink_tab li{
  flex-basis: 20%;
}
.voicelink_tab li a{
  display: block;
  transition: .3s;
  position: relative;
  padding: 32px 5px;
}
.voicelink_tab li a:hover{opacity: .7;}

.voicelink_tab li.link_access a{
  background: url(../../img/voice/link_access.png);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
.voicelink_tab li.link_location a{
  background: url(../../img/voice/link_location.png);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
.voicelink_tab li.link_design a{
  background: url(../../img/voice/link_design.png);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
.voicelink_tab li.link_equipment a{
  background: url(../../img/voice/link_equipment.png);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
.voicelink_tab li.link_other a{
  background: url(../../img/voice/link_other.png);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}

.voicelink_tab li a::after{
    content: '';
    display: block;
    height: 100%;
    width: 100%;
    background-color: rgba(20, 92, 131, .5);
    position: absolute;
    top: 0;
    left: 0;
}
.voicelink_tab li dl{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
}
.voicelink_tab li dl dt{
  color: #00375A;
  text-align: center;
  background-color: #fff;
  border-radius: 50px;
  padding: 8px 32px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 2px;
}
.voicelink_tab li.link_design dl dt{letter-spacing: 0;}
.voicelink_tab li dl dd:nth-of-type(1){
  display: block;
  margin: auto;
  padding-top: 12px;
}
.voicelink_tab li dl dd:nth-of-type(1) img{width: 40px;}
.voicelink_tab li dl dd:nth-of-type(2){
  padding-top: 8px;
  text-align: center;
  color: #fff;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: 0px 0px 4px rgba(0, 0, 0, 1);
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: 1px;
}

/*--------------------------------------------------------------------------
   voice_contents_wrap
---------------------------------------------------------------------------*/


.voice_contents_wrap{
  background: #00375A;
  background: linear-gradient(145deg, rgba(0, 55, 90, 1) 35%, rgba(32, 120, 163, 1) 100%);
  position: relative;
}
.voice_contents_wrap::after{
  content: '';
  display: block;
  position: absolute;
  top: 0; left: 0;
  z-index: 0;
  width: 100%; height: 100%;
  background: url(../../img/voice/bgTexture.png) repeat;
}

.voice_contents_wrap h3{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 46svw;
  position: relative;
  z-index: 2;
}
.voice_contents_wrap h3 span{
  display: block;
  text-align: center;
}
.voice_contents_wrap h3 span.en{
  color: #fff;
  font-size: 177px;
  line-height: 1;
  font-weight: 400;
}
.voice_contents_wrap h3 span.ja{
  color: #00375A;
    text-align: center;
    background-color: #fff;
    border-radius: 50px;
    padding: 8px 32px;
    font-size: 32px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 2px;
    margin-top: 8px;
}
.voice_contents_wrap h3 .c-img-caption{
  bottom: 0; right: 0;
  position: absolute;
  font-family: "YakuHanJP", "Noto Sans JP", "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", Osaka, Verdana, sans-serif;
}


.voice_contents_wrap.area_access h3{
  background: url(../../img/voice/ttl_bg_access_pc.jpg) no-repeat top left;
  background-size: 100%;
}
.voice_contents_wrap.area_location h3{
  background: url(../../img/voice/ttl_bg_location_pc.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_design h3{
  background: url(../../img/voice/ttl_bg_design_pc.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_equipment h3{
  background: url(../../img/voice/ttl_bg_equipment_pc.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_other h3{
  background: url(../../img/voice/ttl_bg_other_pc.jpg) no-repeat top left;
  background-size: cover;
}

.voice_contents{
  padding: 5% 0 10%;
  width: 92%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.voice_contents .inner{
  max-width: 1000px;
  margin: 0 auto;
}

.fukidashi{
  text-align: center;
}
.speechBubble {
  position: relative;
  display: inline-block;
  margin-bottom: 13px;
  padding: 16px;
  border: 1px solid #ffffff;
  background-color: rgba(255, 255, 255, 0);
  text-align: center;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.5;
  color: #ffffff;
}

.speechBubble::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 30%;
    border-style: solid;
    border-width: 14px 30px 0 0;
    border-color: #ffffff transparent transparent;
    translate: -50% 100%;
    transform: skew(65deg);
    transform-origin: top;
}

.speechBubble::after {
   content: "";
    position: absolute;
    bottom: 0;
    left: 30.1%;
    border-style: solid;
    border-width: 12.3px 26px 0 0;
    border-color: #003557 transparent transparent;
    translate: -50% 100%;
    transform: skew(65deg);
    transform-origin: top;
}

.voice_contents .icon_crown{
  text-align: center;
  padding-top: 24px;
}

.voice_contents .no1_answer dt{
  text-align: center;
  color: #FEEF78;
  font-size: 40px;
  line-height: 1.6;
  margin-top: 24px;
}
.voice_contents .no1_answer dd{
  text-align: left;
  color: #FEEF78;
  font-size: 20px;
  margin-top: 24px;
}

.analysis{
  background-image: url(../../img/voice/analysis_bg.png);
  background-size: cover;
  padding: 4% 1%;
  margin-top: 48px;
}
.analysis h4{
  font-weight: 300;
  text-align: center;
  font-size: 26px;
  letter-spacing: 2px;
}
.analysis_img{
  text-align: center;
  margin-top: 24px;
}

.voice_list_wrap{
  margin-top: 24px;
}
.voice_list_wrap .voice_txt{
  text-align: center;
  margin-bottom: 8px;
}

.voice_list_wrap .voice_list .list-item{
  position: relative;
}
.voice_list_wrap .voice_list .list-item a{
  cursor: default;
}
.voice_list_wrap .voice_list .list-item .list_info{
  position: absolute;
  top: 4px; left: 1px;
  font-family: "YakuHanJP", "Noto Sans JP", "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", Osaka, Verdana, sans-serif;
}
.voice_list_wrap .voice_list .list-item .list_info .era{
  padding: 6px 12px;
  line-height: 1;
  font-size: 13px;
  color: #fff;
}

.area_access .voice_list_wrap .voice_list .list-item .list_info .era{
  background: #4DAC83;
  background: linear-gradient(180deg, rgba(77, 172, 131, 1) 0%, rgba(76, 173, 178, 1) 100%);
}
.area_access .voice_list_wrap .voice_list .list-item .list_info .composition{color: #4DAC83;}

.area_location .voice_list_wrap .voice_list .list-item .list_info .era{
  background: #4CADB2;
  background: linear-gradient(180deg, rgba(76, 173, 178, 1) 0%, rgba(81, 162, 211, 1) 100%);
}
.area_location .voice_list_wrap .voice_list .list-item .list_info .composition{color: #4CADB2;}

.area_design .voice_list_wrap .voice_list .list-item .list_info .era{
  background: #51A2D3;
  background: linear-gradient(180deg, rgba(81, 162, 211, 1) 0%, rgba(151, 109, 166, 1) 100%);
}
.area_design .voice_list_wrap .voice_list .list-item .list_info .composition{color: #51A2D3;}

.area_equipment .voice_list_wrap .voice_list .list-item .list_info .era{
  background: #976DA6;
  background: linear-gradient(180deg, rgba(151, 109, 166, 1) 0%, rgba(224, 123, 131, 1) 100%);
}
.area_equipment .voice_list_wrap .voice_list .list-item .list_info .composition{color: #976DA6;}

.area_other .voice_list_wrap .voice_list .list-item .list_info .era{
  background: #E07B83;
  background: linear-gradient(180deg, rgba(224, 123, 131, 1) 0%, rgba(241, 148, 110, 1) 100%);
}
.area_other .voice_list_wrap .voice_list .list-item .list_info .composition{color: #E07B83;}




.voice_list_wrap .voice_list .list-item .list_info .composition span{
  font-size: 10px;
  padding-right: 8px;
}
.voice_list_wrap .voice_list .list-item .list_info .composition{
  font-size: 13px;
  padding-left: 8px;
}

.list-item{
    opacity: 1;
    margin: 0 0 20px;
}
.list-item.is-hidden {
    opacity: 0;
    height: 0;
    margin: 0;
}
.voice_list_btn {
    margin-top: 20px;
    position: relative;
    z-index: 2;
}
.voice_list_btn.is-btn-hidden{
  display:none;
}
/* .voice_list_btn button {
    background-color: #333;
  color:#fff;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    height: 32px;
    line-height: 32px;
    width: 120px;
} */

.voice_list_btn button {
  width: 400px;
  height: 60px;
  margin: 40px auto 0;
  border: 1px solid #1F74AF;
  border-radius: 30px;
  font-size: 18px;
  letter-spacing: 0.2em;
  text-align: center;
  overflow: hidden;
  display: block;
}
.voice_list_btn button a {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  color: #fff;
  background: #1F74AF;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  z-index: 0;
}
.voice_list_btn button a::before {
  position: absolute;
  top: 50%;
  right: 18px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #fff;
  content: "";
  -webkit-transition: 0.3s;
  transition: 0.3s;
  z-index: -1;
}
.voice_list_btn button a:hover{
  color: #1F74AF;
}
.voice_list_btn button a:hover::before{
  right: -18px;
  width: 150%;
  height: 500%;
}

.pc{display: block;}
.sp{display: none;}


.modaal-content-container{
  padding: 0 !important;
  width: auto;
}
.modaal-container{
  background: none !important;
}
.modaal-content-container .midal_img{
  width: 100%;
}
.modaal-content-container .modal_cap{
    color: #fff;
    text-align: center;
    display: block;
    padding-top: 8px;
}
.modaal-content-container .modal_cap .midal_cap_icon{
  width: 20px;
  padding-right: 6px;
}

/*--------------------------------------------------------------------------
   custom animation
---------------------------------------------------------------------------*/



@media only screen and (max-width: 767px) {
  
  .pc{display: none;}
.sp{display: block;}

  .icon_no1 img{width: 120px; height: 120px;}
.icon_no1{
  position: absolute;
  bottom: 15px; right: 15px;
  z-index: 2;
}
.m-page-mv__img::after{display: none;}

/*--------------------------------------------------------------------------
   obi_ttl
---------------------------------------------------------------------------*/

.obi_ttl{
  background: #00375A;
  background: linear-gradient(145deg, rgba(0, 55, 90, 1) 35%, rgba(32, 120, 163, 1) 100%);
  position: relative;
  padding: 12% 0;
}
.obi_ttl::after{
  content: '';
  display: block;
  position: absolute;
  top: 0; left: 0;
  z-index: 1;
  width: 100%; height: 100%;
  background: url(../../img/voice/bgTexture.png) repeat;
}

.yellow_gradation{
  background: linear-gradient(90deg, #FEEF78, #F5D62F);
  background: -webkit-linear-gradient(0deg, #FEEF78, #F5D62F);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.obi_ttl h2{
  max-width: 90%;
}
.obi_ttl h2 img{
  max-width: 100%;
}
.obi_ttl p{
  font-size: 18px;
}



/*--------------------------------------------------------------------------
   voicelink_tab
---------------------------------------------------------------------------*/

.voicelink_tab ul{
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.voicelink_tab li a{
  padding: 24px 5px;
}
.voicelink_tab li dl dt{
  font-size: 18px;
}
.voicelink_tab li dl dd:nth-of-type(1) img{width: 30px;}
.voicelink_tab li dl dd:nth-of-type(2){
  font-size: 20px;
}

/*--------------------------------------------------------------------------
   voice_contents_wrap
---------------------------------------------------------------------------*/


.voice_contents_wrap h3{
  min-height: 105svh;
}
.voice_contents_wrap h3 span.en{
  color: #fff;
  font-size: 57px;
  line-height: 1;
  font-weight: 400;
}
.voice_contents_wrap h3 span.ja{
    padding: 4px 16px;
    font-size: 16px;
}


.voice_contents_wrap.area_access h3{
  background: url(../../img/voice/ttl_bg_access_sp.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_location h3{
  background: url(../../img/voice/ttl_bg_location_sp.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_design h3{
  background: url(../../img/voice/ttl_bg_design_sp.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_equipment h3{
  background: url(../../img/voice/ttl_bg_equipment_sp.jpg) no-repeat top left;
  background-size: cover;
}
.voice_contents_wrap.area_other h3{
  background: url(../../img/voice/ttl_bg_other_sp.jpg) no-repeat top left;
  background-size: cover;
}

.voice_contents{
  padding: 10% 0 20%;
}
.voice_contents .inner{
  max-width: 100%;
  margin: 0 auto;
}

.fukidashi{
  text-align: left;
}
.speechBubble {
  padding: 24px;
  text-align: left;
  font-size: 22px;
}


.speechBubble::after {
  border-color: #003455 transparent transparent;
}

.voice_contents .icon_crown{
  text-align: center;
  padding-top: 24px;
}
.voice_contents .icon_crown img{width: 48px;}

.voice_contents .no1_answer dt{
  text-align: center;
  color: #FEEF78;
  font-size: 24px;
}
.voice_contents .no1_answer dd{
  text-align: left;
  color: #FEEF78;
  font-size: 14px;
  line-height: 2;
  margin-top: 24px;
}

.analysis{
  padding: 12% 2%;
  margin-left: calc((-100vw - -100%) / 2);
  margin-right: calc((-100vw - -100%) / 2);
}
.analysis h4{
  font-size: 26px;
  letter-spacing: 2px;
}
.analysis_img{
  text-align: center;
  margin-top: 24px;
}
.analysis_img img{max-width: 100%;}
.voice_list_wrap{
  margin-top: 24px;
}
.voice_list_wrap .voice_txt{
  text-align: center;
  margin-bottom: 8px;
}

.voice_list_wrap .voice_list .list-item .list_info{
  top: 1px; left: 1px;
}
.voice_list_wrap .voice_list .list-item .list_info .era{
  padding: 3px 6px;
  font-size: 10px;
}

.voice_list_wrap .voice_list .list-item .list_info .composition span{
  font-size: 10px;
  padding-right: 8px;
}
.voice_list_wrap .voice_list .list-item .list_info .composition{
  font-size: 9px;
}

.list-item{
    opacity: 1;
    margin: 0 0 20px;
}
.list-item img{max-width: 100%;}
.list-item.is-hidden {
    opacity: 0;
    height: 0;
    margin: 0;
}
.voice_list_btn {
    margin-top: 20px;
    position: relative;
    z-index: 2;
}
.voice_list_btn.is-btn-hidden{
  display:none;
}
/* .voice_list_btn button {
    background-color: #333;
  color:#fff;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    height: 32px;
    line-height: 32px;
    width: 120px;
} */

.voice_list_btn button {
  width: 280px;
     height: 45px;
    margin: 16px auto 0;
    border: 1px solid #1F74AF;
    border-radius: 30px;
    font-size: 13px;
}
.voice_list_btn button a {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  color: #fff;
  background: #1F74AF;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  z-index: 0;
}
.voice_list_btn button a::before {
  position: absolute;
  top: 50%;
  right: 18px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #fff;
  content: "";
  -webkit-transition: 0.3s;
  transition: 0.3s;
  z-index: -1;
}
.voice_list_btn button a:hover{
  color: #1F74AF;
}
.voice_list_btn button a:hover::before{
  right: -18px;
  width: 150%;
  height: 500%;
}
}


@media screen and (min-width: 768px) and (max-width: 991px) {

}
@media screen and (min-width: 768px) and (max-width: 1440px) {
  
}

@media screen and (min-width: 768px) and (max-width: 950px) {

}


/*#*/ /*sourceMappingURL=../maps/access/style.css.map */
/*  */