@charset "UTF-8";
/****************************************

            Mirai Top Page

*****************************************/
.mirai_wrap {
    text-align: center;
 }
 .mirai_top .sub_title h2,
 .mirai_article .sub_title h2  {
    font-size: 3.5em;
 }

 .mirai_wrap .mirai_archi {
   font-size: 6.5625vw;
   font-family:  FB Benton Sans Medium;
   margin-top: 13.33vw;
 }
 .page-topImg {
    width: 100%;
    height: auto;
 }
 .page-topImg img {
    width: 100%;
    height: 100%;
 }
 .page-topImg img.gray_line {
    border: 1px solid #ccc;
    box-sizing: border-box;
 }
 .page_topTxt {
    padding: 0 3.333vw;
    text-align: left;
 }
 
 .page_topTxt p {
    font-size: 4.0625vw;
    margin-top: 6.666vw;
    line-height: 1.5;
 }
 
 .mirai_wrap h3 {
   font-family: FB Benton Sans Medium;
    font-size: 4.0625vw;
    font-weight: 600;
    margin: 3.33vw 0 0;
 }
 .mirai_wrap p.highlight {
   margin: 2vw 0 3.33vw;
   font-size: 3.75vw;
}
 
 .mirai_wrap .sub_list03 .branding_list_img {
    position: relative;
    border: 1px solid #ccc;
    box-sizing: border-box;
 }
 
 .mirai_wrap .sub_list03 .branding_list_new {
    position: absolute;
    top: 0;
    left: 0;
 }
 .mirai_wrap .sub_list03 .branding_list > p {
    position: relative;
    display: inline-block;
    width: 70%;
    min-height: 3em;
 }
 .mirai_wrap p.highlight > span {
   box-shadow: 0 5px 0 0 #fff100;
 }
 .mirai_wrap p.highlight span span {
   position: relative;
   top: .68em;
   -webkit-box-decoration-break: clone;
   box-decoration-break: clone;
 }

 .list_infoBox {
    padding: 0 3.333vw;
    font-size: 3.125vw;
    text-align: left;
 }
 .list_infoBox p { 
   line-height: 1.5;
 }
 .list_infoBox .list_infoDate {
    font-weight: 600;
    margin: 4vw 0 0;
    padding: 0;
 }
 .list_infoBox_b {
   font-family:  TBGothic M;
font-weight: 600;
 }
 .list_name {
    display: flex;
    align-items: center;
    margin: 2.6667vw 0 0;
 }
 .list_name div {
    width: 8.4vw;
    border-radius: 50%;
    overflow: hidden;
}
 .list_name p {
    font-size: .75em;
    color: #999;
    font-weight: 600;
    margin-left: 4vw;
 }
 
 .pc_active {
    display: none !important;
 }
 .mirai_article .page-box  table {
    width: 100% !important;  
   }
   .mirai_article .page-box table td {
      width: 100% !important;  
      display: block;
      font-size: 4.0625vw;
      line-height: 1.5;
     }
     .mirai_article .page-box table td:last-child {
        margin-top: 2vw;
     }
     .mirai_article .page-box table td img {
      width: 100% !important;  
      
     }

 
 @media screen and (min-width: 768px) {
   .mirai_wrap .mirai_archi {
      font-size: 48px;
      margin-top: 40px;
      font-family:  FB Benton Sans Medium;
    }
    .sp_active {
       display: none !important;
    }
    .pc_active {
       display: block !important;
    }
    .mirai_wrap .sub_list03 li img.pc_active {
       width: 100% !important;
       position: relative;
       -webkit-filter: grayscale(100%);
       -moz-filter: grayscale(100%);
       -ms-filter: grayscale(100%);
       -o-filter: grayscale(100%);
       filter: grayscale(100%);
    }
    .mirai_wrap .sub_list03 li:hover img.pc_active {
       -webkit-filter: grayscale(0%);
       -moz-filter: grayscale(0%);
       -ms-filter: grayscale(0%);
       -o-filter: grayscale(0%);
       filter: grayscale(0%);
    }
 
    .mirai_wrap .sub_list03 li .branding_list_img>a::before {
      display: block;
      content: "";
      width: 100%; 
      height: 100%;
      background-color: rgba(0, 0, 0, 0.2);
      z-index: 2;
      position: absolute;
      -webkit-transition: background-color 1s, -webkit-transform 2s;
      transition: background-color 1s, transform 2s;
   }
   .mirai_wrap .sub_list03 li:hover .branding_list_img>a::before {
      display: block;
      content: "";
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0);
      z-index: 1;
      position: absolute;
   }
    .mirai_top .sub_title h2 {
       font-size: 120px;
    }
    .mirai_article .page-date {
       font-size: 18px;
       color: #333;
    }
    .page-topImg {
       width: 100%;
       margin-top: 50px;
       margin-bottom: 120px;
    }
    
    .page_topTxt {
       padding: 0 80px 100px;
       text-align: center;
    }
    .page_topTxt p {
       font-size: 16px;
       margin-top: 0;
       line-height: 2;
    }
    .mirai_wrap h2 {
       font-size: 48px;
       font-weight: bold;
       text-align: center;
       margin-bottom: 80px;
    }
 
    .mirai_wrap p.highlight {
       margin: 10px 0 15px;
       font-size: 14px;
    }
 
    .mirai_wrap .sub_list03 ul { 
       text-align: left;
       display: -ms-flex-box;
	   display: -webkit-flex;
       display: flex;
       justify-content: space-between;
       -webkit-flex-wrap: wrap; /* Safari 6.1+ */ 
       flex-wrap: wrap;
    } 
    .mirai_wrap .sub_list03 ul::after { 
       display: block;
       content: "";
       width: 270px;
    } 
    .mirai_wrap .sub_list03 ul li {  
       width: 270px;
       margin-bottom: 70px;
    }
 
 
    .mirai_wrap .sub_list03 h3 {
      font-family: FB Benton Sans Medium;
      font-size: 18px;
      font-weight: bold;
      margin: 0;
   }
   .mirai_wrap .sub_list03 p {
       font-size: 14px;
    }

    .mirai_wrap .sub_list03 .branding_list > p {
      width: 100%;
   }
    .mirai_wrap .sub_list03 .branding_list > p::before {
       height: 7px;
    }

    .mirai_wrap .sub_list03 .branding_list_img  {
     width: 270px;
     height: 180px;
     overflow: hidden;
    }
 
 
    .list_infoBox {
       width: 100%;
       padding: 0 0;
       font-size: 14px;
      }
      .list_infoBox p { 
        line-height: 1.3;
      }
    .list_infoBox .list_infoDate {
       font-size: 14px;
       margin: 10px 0 0;
    }
    .list_infoBox p:nth-child(2) {
       margin: 5px 0;
    }

    .list_name {
       display: flex;
       margin: 8px 0 0;
    }
    .list_name div {
       width: 30px;
    }
    .list_name p {
       font-size: 12px;
       margin-left: 8px;
       
    }
 
    .mirai_article .page-box table td {
      width: 48% !important;  
      font-size: 14px;
      display: inline-block;
     }

      .mirai_article .page-box table td:last-child {
         margin-top: 0;
         margin-left: 20px;
         vertical-align: top;
         line-height: 1.8
      }

 
 }
 
 @media (min-width:768px) and ( max-width:1024px) { 
    .mirai_wrap .sub_title {
        width: 100%;
        padding: 0 3.3vw;
        box-sizing: border-box;
    }
    .mirai_wrap .sub_list03 ul {
        display: flex;
    }
    .mirai_wrap .sub_list03 ul li {
        margin-bottom: 110px;
        margin-right: 0;
        width: 34vw;    
        padding: 0 3.3vw;
        box-sizing: border-box;
    }
    .mirai_wrap .sub_list03 ul li .branding_list_img {
        width: 27vw;
        height: 18vw;
        position: relative;
    }
 }
 
 /****************************************
 
             Mirai Article Page
 
 *****************************************/
 .mirai_article .page-date {
   font-size: 3.75vw;
 }
 .mirai_article .page-title {
   font-family: FB Benton Sans Medium;
    font-size: 4.0625vw;
    font-weight: bold;
    margin-top: 1.5vw;
 }
 .mirai_article .page-header_wrap {
    padding: 0 3.333vw 6.6667vw;
 }
 .mirai_article .page-header {
    display: flex;
    justify-content: space-between;
    position: relative;
 }
 .mirai_article .sns-item {
   width: 15vw; 
   position: absolute;
   right: 0;
   top: -3px;
}
 .mirai_article .page-box {
    padding: 6.33vw 3.333vw 0;
    margin-bottom: 10.333vw;
 }
 .mirai_article .page-box .point_btn {
    width: 100%;
    padding: 1.333vw 3.333vw;
    box-sizing: border-box;
 }


 .mirai_article .page-box h2 {
   padding: 2vw 2.66vw 1.8vw;
   margin: 4vw 0 2vw;
   background: #fff100;
   font-size: 5vw;
   font-family:  TBGothic M;
   font-weight: 600;
   line-height: 1.5;
}
.mirai_article .page-box h2 br { 
   display: none;
}
 .mirai_article .page-box p {
   font-size: 4.0625vw;
   line-height: 1.5;
   margin-top: 2vw;
}

 .mirai_article .page-box span {
    display: inline-block;
    margin-top: 5.333vw;
 }
 .mirai_article .page-box span:first-child {
    margin-top: 0;
 }
 .mirai_article .blue_name {
    color: #0000ff; 
 }
 .mirai_article .red_name {
    color: #ff0000;
 }
 
 .mirai_article .pro_list {
    border-top: 1px solid #eee;
    padding: 10.333vw 3.333vw 0;
    box-sizing: border-box;
    margin-top: 10.333vw;
 }
 .mirai_article .pro_list ul {
    list-style: none;
 }
 .mirai_article .pro_list_txt::after {
    display: block;
    content: "";
    clear: both;
 }
 .mirai_article .pro_list_img {
    width: 33.333vw;
    margin: 0 auto 1.333vw;
 }
 .mirai_article .pro_list_txt span {
    font-size: .6563em;
    font-weight: 600;
 }
 .mirai_article .pro_list_txt h4 {
    font-size: .9375em;
    font-weight: 600;
 }

 
 .mirai_article_infoWrap {
    width: 100%;
    background: #f3f3f3;  
    padding: 13.333vw 0;
 }
 .mirai_article_infoWrap h2.bt_info_title {
    font-size: 7.5vw;
    font-family:  FB Benton Sans Medium;
    font-weight: 600;
    text-align: center;
    margin-bottom: 6.6667vw;
 }

 .mirai_article .pro_list li {
    margin-bottom: 8vw;
 }
  
 .mirai_article .pro_list_txt p.mirai_ename {
    font-size: 3.75vw;
    font-weight: 600;
 }
 .mirai_article .pro_list_txt p.mirai_jname {
    font-size: 4.0625vw;
    margin-bottom: 3vw;
    margin-top: 0;
 }
 .mirai_article .pro_list_txt div.mirai_info {
    font-size: 4.0625vw;
    line-height: 1.5;
    margin-bottom: 4vw;
 }


 .mirai_article_info {

   padding: 0 3.3vw;
}
.mirai_article_info_img,
.mirai_article_info_img img {
   width: 100%;
}
.mirai_article_info_txt {
   width: 100%;
   margin-top: 4.6667vw;
    padding: 0;
}
.mirai_article_info_txt b {
   display: block;
    margin: 4vw 0;
    font-size: 4.375vw;
    font-weight: 600;
}
.mirai_article_info_txt p {
   line-height: 1.5;
   font-size: 3.75vw;
}
.mirai_article_info_txt p br { 
   display: none;
}

.mirai_article_info_txt p a {
   color: #000;
   text-decoration: none;
   display: inline-block;
   margin: 1.5vw 0 0;
   word-break: break-all;
   position: relative;
   z-index: 1;
}
.mirai_article_info_txt p a::after {
   width: 100%;
   height: 7px;
   display: block;
   content: "";
   background: #fff100;
   position: absolute;
   bottom: 5px;
   z-index: -1;
}


 
 @media screen and (min-width: 768px) {
   .mirai_article .page-date {
      font-size: 18px;
    }
    .mirai_article .page-header_wrap {
       padding: 0 0;
       max-width: 1000px;
       margin: 80px auto 0;
    }
    .mirai_article .page-info {
       margin-top: 0;
   }
   .mirai_article .sns-item {
      width: 82px;
      position: relative;
      top: 0;
      right: 0;
   }
   .mirai_article .page-title {
      margin-top: 20px;
      font-size: 24px;
   }
   .mirai_article .page-topImg {
    margin-top: 30px;
    margin-bottom: 70px;
    }
    .mirai_article .page-box {
       padding: 0 0;
       max-width: 1000px;
       margin: 0 auto;
       box-sizing: border-box;
    }
 
    .mirai_article .page-box span {
       margin-top: 20px;
    }
    .mirai_article .pro_list {
       padding: 70px 0 0;
       margin-top: 70px;
    }
    .mirai_article .pro_list ul { 
       list-style: none;
    }
    .mirai_article .pro_list_txt::after {
      display: block;
      content: "";
      clear: both;
   }
    .mirai_article .pro_list_img {
       width: 150px;
       margin: 7px 25px 20px 0;
       float: left;
    }
    .mirai_article .pro_list_txt p.mirai_ename {
       font-size: 16px;
       line-height: 1.8;
    }
    .mirai_article .pro_list_txt p.mirai_jname {
       font-size: 21px;
       line-height: 1;
       margin-bottom: 15px;
    }
    .mirai_article .pro_list_txt div.mirai_info {
       font-size: 14px;
       line-height: 1.5;
    }
 
 
 /**/
    .mirai_article .page-box h2 {
       padding: 20px 25px 18px;
       margin: 55px 0 35px;
       background: #fff100;
       font-size: 21px;
       font-weight: bold;
       line-height: 1.5;
    }
    .mirai_article .page-box h2 br { 
      display: block;
   }
    .mirai_article .page-box p {
       font-size: 14px;
       margin-top: 20px;
       line-height: 1.8;
    }
 
    .mirai_article_infoWrap {
       margin-top: 130px;
       padding: 120px 0;
    }
    .mirai_article_infoWrap h2.bt_info_title {
       font-size: 48px;
       margin-bottom: 60px;
    }
    .mirai_article_info {
       max-width: 1000px;
       padding: 0 0;
       box-sizing: border-box;
       margin: 0 auto;
       display: flex;
       justify-content: space-between;
    }
    .mirai_article_info_img {
       width: 350px;
       margin-top: 5px;
       margin-right: 30px;
    }
    .mirai_article_info_txt {
       width: 575px;
       margin-top: 0;
       padding: 0 0;
    }
    .mirai_article_info_txt b {
       margin: 25px 0 0;
       font-size: 18px;
    }
    .mirai_article_info_txt p {
       line-height: 2;
       font-size: 14px;
    }
 
 }

 @media (min-width:768px) and ( max-width:1024px) { 
    .mirai_article .sub_title,
    .mirai_article .sub_container {
        width: 100%;
        padding: 0 3.3vw;
        box-sizing: border-box;
    }
    .mirai_article .page-box table td {
        width: 45% !important;  
    }
    .mirai_article .page-box table td:first-child {
        padding-right: 5%;
        line-height: 0;
    }
}