@charset "utf-8";
/*--
中 font-size:96%;
小 font-size:88%;
--*/
/*---------------------------------------*/
/* 共通 */
/*---------------------------------------*/
.areaInner{
  width:90%;
  max-width:1300px;
  margin:0 auto;
  position:relative;
  z-index:10;
}
.areaInner.w1000{
  max-width:1000px;
}
.areaBase{
  margin:0 auto 100px;
  overflow:hidden;
}
@media screen and (max-width:767px){
  .areaBase{
    margin:0 auto 50px;
  }
}
.partsBase{
  margin:0 auto 60px;
  overflow:hidden;
}
@media screen and (max-width:767px){
  .partsBase{
    margin:0 auto 30px;
  }
}
/* パララックス */
.pcContent .bgslide{
  background-attachment:fixed !important;
  height:600px;
}
/* btn */
.btn a{
  display:block;
  width:95%;
  max-width:436px;
  height:48px;
  line-height:48px;
  margin:0 auto;
  border-radius:7px;
  background:#fff;
  border:1px solid #00a0e9;
  position:relative;
  text-align:center;
  font-size:114%;
  letter-spacing:0.05em;
}
/*IE用記述 */
@media all and (-ms-high-contrast: none){
  .btn a{
    line-height:53px;
  }
}
.btn.w100 a{
  max-width:inherit;
  height:74px;
  line-height:74px;
  width:100%;
  box-sizing:border-box;
}
/*IE用記述 */
@media all and (-ms-high-contrast: none){
  .btn.w100 a{
    line-height:77px;
  }
}
@media screen and (max-width:980px){
  .btn a{
    font-size:9pt;
    max-width:100%;
    height:40px;
    line-height:40px;
  }
  .btn.w100 a{
    font-size:9pt;
    height:40px;
    line-height:40px;
  }
}
.btn a:hover{
  background:#00a0e9;
}
.btn.short a{
  max-width:238px;
}
@media screen and (max-width:767px){
  .btn.short a{
    max-width:100%;
  }
}
.btn.small a{
  height:33px;
  line-height:33px;
  font-size:86%;
}
/*IE用記述 */
@media all and (-ms-high-contrast: none){
  .btn.small a{
    line-height:35px;
  }
}
@media screen and (max-width:767px){
  .btn.small a{
    height:25px;
    line-height:25px;
  }
}
.btn.blue a{
  background:#00a0e9;
}
.btn.blue a:hover{
  background:#fff;
}
.btn.gray a{
  border:1px solid #9fa0a0;
}
.btn.gray a:hover{
  border:1px solid #00a0e9;
  background:#fff;
}
.btn.left a{
  margin:0;
}
.btn a .icon-more{
  color:#00a0e9;
  position:absolute;
  top:0;
  right:25px;
  line-height:48px;
  font-size:27px;
  transition: color 0.3s ease;
}
@media screen and (max-width:767px){
  .btn a .icon-more{
    display:none;
  }
}
.btn a:hover .icon-more{
  color:#fff;
}
.btn.blue a .icon-more{
  color:#fff;
}
.btn.blue a:hover .icon-more{
  color:#00a0e9;
}
.btn.gray a .icon-more{
  color:#9fa0a0;
}
.btn.gray a:hover .icon-more{
  color:#00a0e9;
}
.btn.small a .icon-more{
  font-size:13px;
  line-height:30px;
  right:15px;
}
.btn.w100 a .icon-more{
  line-height:74px;
}
/* 背景 */
.bg{
  background:#efefef;
}
/* テキストカラー*/
.white{
  color:#fff;
}
.red{
  color:#de2726;
}
/* 画像100％ */
.w100img img{
  width:100%;
  height:auto;
}
/* テキストスタイル各種 */
.areaTtl{
  font-family:"Noto Sans JP", sans-serif;
  font-weight:300;
  font-size:214%;
  line-height:1.5;
  margin-bottom:30px;
}
@media screen and (max-width:767px){
  .areaTtl{
    font-size:16pt;
    margin-bottom:20px;
  }
}
.areaTtl.uLine{
  padding-bottom:20px;
  border-bottom:1px solid #00a0e9;
}
@media screen and (max-width:767px){
  .areaTtl.uLine{
    padding-bottom:5px;
  }
}
@media screen and (max-width:767px){
  .areaTtl.mb70{
    margin-bottom:30px!important;
  }
}
.areaTtl .attention{
  font-size:33.3333%;
  margin-top:15px;
  display:block;
  line-height:1.5;
}
@media screen and (max-width:767px){
  .areaTtl .attention{
    font-size:7pt;
  }
}
.mainTtl{
  font-size:164%;
  line-height:1.5;
  margin-bottom:25px;
}
@media screen and (max-width:767px){
  .mainTtl{
    margin-bottom:15px;
    font-size:12pt;
  }
}
.mainTtl.line-left{
  border-left:1px solid #00a0e9;
  padding:5px 0 5px 34px;
}
@media screen and (max-width:767px){
  .mainTtl.line-left{
    padding:5px 0 5px 15px;
  }
}
.partsTtl{
  font-size:128.5%;
  line-height:1.5;
  margin-bottom:50px;
  font-weight:bold;
  border-bottom:1px solid #00a0e9;
  letter-spacing:0.1em;
  padding-bottom:15px;
}
@media screen and (max-width:767px){
  .partsTtl{
    margin-bottom:15px;
    font-size:10pt;
  }
}
.partsTtl .small{
  font-size:66.666%;
}
@media screen and (max-width:767px){
  .partsTtl .small{
    font-size:7pt;
    font-weight:normal;
    letter-spacing:normal;
  }
}
.bgTtl{
  height:4.0em;
  font-size:107%;
  font-weight:bold;
  background:#dcdddd;
  margin:40px 0 20px 0;
  padding:0.3em 2% 0.25em;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
  align-items: center; /* 縦方向中央揃え */
}
@media screen and (max-width:767px){
  .bgTtl{
    font-size:10pt;
  }
}
.subTtl{
  font-size:93%;
  margin-bottom:1em;
  line-height:1.5;
}
@media screen and (max-width:767px){
  .subTtl{
    font-size:9pt;
  }
}
.baseNote{
  line-height:2;
}
.baseNote.mb{
  margin-bottom:2em;
}
.smallNote{
  line-height:1.6;
  font-size:86%;
}
@media screen and (max-width:767px){
  .smallNote{
    font-size:8pt;
  }
}
.smallNote.mb{
  margin-bottom:2em;
}
@media screen and (max-width:767px){
  .smallNote.mb{
    margin-bottom:1.5em;
  }
}
.lead{
  line-height:2;
  text-align:center;
  margin-bottom:50px;
}
@media screen and (max-width:767px){
  .lead{
    text-align:left;
    margin-bottom:20px;
  }
}

.faq_accordion input {display: none;}
.faq_accordion input:checked + ul {
  display: block;
  line-height: 1.5;
  padding: 1.0em 1.0em 4.0em 4.0em;
}
.faq_accordion ul {
  overflow: hidden;
  line-height: 0;
  padding: 0 1.0em;
  transition: 0.2s;
  margin: 0;
  /*border:1px dotted #ffffff ; */
}
.faq_accordion ul li{
  background-color:#efefef;
}
.faq_accordion ul li a{
  text-decoration: underline;
}
.faq_accordion label {
  display: block;
  margin: 0;
  padding: 0.5rem;
  cursor: pointer;
}
.faq_accordion label:hover {
  color:#00a0e9;
  text-decoration:underline;
}

/* tableStyle01 */
.tableStyle01{
  width:100%;
}
.tableStyle01>tbody>tr:nth-child(2n){
  background:#dcdddd;
}
.tableStyle01>tbody>tr>th{
  padding:8px 2%;
  width:26%;
}
@media screen and (max-width:767px){
  .tableStyle01>tbody>tr>th{
    width:96%;
    padding:10px 2% 5px;
    display:block;
  }
}
.tableStyle01>tbody>tr>td{
  padding:8px 2% 8px 0;
}
@media screen and (max-width:767px){
  .tableStyle01>tbody>tr>td{
    display:block;
    padding:0 2% 10px;
  }
}
/* tableStyle02 */
.tableStyle02{
  width:100%;
}
.tableStyle02>tbody>tr{
  border-bottom:1px solid #898989;
}
.tableStyle02>tbody>tr>th{
  padding:8px 0;
  width:26%;
  vertical-align:middle;
}
@media screen and (max-width:767px){
  .tableStyle02>tbody>tr>th{
    width:96%;
    padding:10px 0 5px;
    display:block;
  }
  .tableStyle02>tbody>tr>th.none{
    height:1px;
  }
}
.tableStyle02>tbody>tr>td{
  padding:8px 0;
  vertical-align:middle;
}
@media screen and (max-width:767px){
  .tableStyle02>tbody>tr>td{
    display:block;
    padding:0 0 10px;
  }
}
.tableStyle02>tbody>tr>td.pb{
  padding-bottom:30px;
}
@media screen and (max-width:767px){
  .tableStyle02>tbody>tr>td.pb{
    padding-bottom:15px;
  }
}
/* tableStyle03 */
.tableStyle03{
  width:100%;
  line-height:1.5;
  margin:32px 0;
}
@media screen and (max-width:767px){
  .tableStyle03{
    font-size:8pt;
    margin:15px 0;
  }
}
.tableStyle03>tbody>tr{
  border:1px solid #898989;
}
.tableStyle03>tbody>tr>th{
  padding:8px 1%;
  width:14.666%;
  border:1px solid #898989;
  text-align:center;
  vertical-align:middle;
}
.tableStyle03>tbody>tr>td{
  padding:8px 0;
  border:1px solid #898989;
  text-align:center;
  vertical-align:middle;
}
/* tableStyle04 */
.tableStyle04{
  width:100%;
}
.tableStyle04>tbody>tr>th{
  width:96%;
  padding:5px 2%;
  display:block;
  background:#dcdddd;
  font-weight:bold;
}
.tableStyle04>tbody>tr>td{
  display:block;
  padding:10px 2%;
}
/* boxStyle01 */
.boxStyle01{
  border:1px solid #b5b5b6;
  padding:40px;
  width:96%;
  margin:0 auto 40px;
  box-sizing:border-box;
}
@media screen and (max-width:767px){
  .boxStyle01{
    width:100%;
    padding:15px;
  }
}
.boxStyle01.half{
  max-width:500px;
  margin-left:0;
}
.boxStyle01.narrow{
  padding:15px 40px;
  margin:0 0 20px 0;
}
@media screen and (max-width:767px){
  .boxStyle01.narrow{
    padding:15px;
  }
}
/* boxStyle02 */
.boxStyle02{
  border:1px dashed #333;
  padding:40px;
  width:96%;
  margin:0 auto 40px;
  box-sizing:border-box;
}
@media screen and (max-width:767px){
  .boxStyle02{
    width:100%;
    padding:15px;
  }
}
.boxStyle02.half{
  max-width:500px;
  margin-left:0;
}
.boxStyle02.narrow{
  padding:15px 40px;
  margin:0 0 20px 0;
}
@media screen and (max-width:767px){
  .boxStyle02.narrow{
    padding:15px;
  }
}
/* imgContent */
.imgContent{
  padding:150px 0;
}
@media screen and (max-width:767px){
  .imgContent{
    padding:50px 0;
  }
}
@media screen and (max-width:980px){
  .imgContent .areaInner{
    max-width:600px;
  }
}
.imgContent .img{
  position:absolute;
  top:0;
  left:0;
  width:50%;
}
@media screen and (max-width:980px){
  .imgContent .img{
    width:100%;
    position:relative;
    margin:0 auto 15px;
  }
}
.imgContent .img img{
  width:100%;
  height:auto;
}
.imgContent .txtBox{
  margin-left:56.7%;
}
@media screen and (max-width:980px){
  .imgContent .txtBox{
    margin-left:0;
  }
}
.imgContent .txtBox .baseNote{
  margin-bottom:40px;
}
@media screen and (max-width:767px){
  .imgContent .txtBox .baseNote{
    margin-bottom:20px;
  }
}
/*---------------------------------------*/
/* pageBase */
/*---------------------------------------*/
.pageBase{
  padding:50px 0 0;
}
@media screen and (max-width:767px){
  .pageBase{
    padding:20px 0 0;
  }
}
/*---------------------------------------*/
/* breadcrumbs */
/*---------------------------------------*/
.breadcrumbs {
  width:100%;
  height:40px;
  font-size:86%;
  padding:100px 0;
}
@media screen and (max-width:767px){
  .breadcrumbs {
    font-size:7pt;
    height:auto;
    padding:40px 0;
  }
}
.breadcrumbs li{
  display:inline;
  list-style:none;
  vertical-align:middle;
}
.breadcrumbs li .arrow{
  padding: 0 6px 0 10px;
}
/*---------------------------------------*/
/* ページャー */
/*---------------------------------------*/
.pager{
  text-align: center;
}
.pager a {
  display:inline-block;
  width:30px;
  height:30px;
  line-height:30px;
  margin:0 5px;
  font-size:86%;
  color:#333;
  transition: all 0.3s ease 0s;
}
@media screen and (max-width: 767px) {
  .pager a {
    font-size:8pt;
    width:20px;
    height:20px;
    line-height:20px;
    margin:0 2px;
  }
}
.pager .current {
  display:inline-block;
  width:30px;
  height:30px;
  line-height:30px;
  margin:0 5px;
  font-size:86%;
  font-weight:bold;
}
@media screen and (max-width: 767px) {
  .pager .current {
    font-size:8pt;
    width:20px;
    height:20px;
    line-height:20px;
    margin:0 2px;
  }
}
.pager .nextpostslink,
.pager .previouspostslink{
  color:#333;
}
/*---------------------------------------*/
/* pageNavigation */
/*---------------------------------------*/
.naviOuter{
  margin-bottom:40px;
}
@media screen and (max-width:767px){
  .naviOuter{
    margin-bottom:20px;
  }
  .naviOuter .pageNaviOpen{
    cursor:pointer;
    width:100%;
    height:30px;
    line-height:30px;
    background:#efefef;
    text-align:center;
    position:relative;
  }
  .naviOuter .pageNaviOpen .icon{
    position:absolute;
    top:12px;
    right:10px;
    width:5px;
    height:5px;
    border-top:1px solid #333;
    border-right:1px solid #333;
    transform:rotate(45deg);
    transition: all 0.3s ease;
  }
  .naviOuter .pageNaviOpen.open .icon{
    transform:rotate(135deg);
  }
}
.pageNavigation{
  border-bottom:1px solid #00a0e9;
  display:block;
}
@media screen and (max-width:767px){
  .pageNavigation{
    border-bottom:none;
    display:none;
  }
}
.pageNavigation li{
  float:left;
  font-size:86%;
  border-top:1px solid #00a0e9;
  background:#fff;
}
@media screen and (max-width:767px){
  .pageNavigation li{
    font-size:8pt;
    border-top:none;
    border-bottom:1px solid #c9caca;
  }
  .pageNavigation li.on{
    margin-bottom:0;
  }
}
.pageNavigation.colum8 li{
  width:12.5%;
}
@media screen and (max-width:980px){
  .pageNavigation.colum8 li{
    width:20%;
  }
}
@media screen and (max-width:767px){
  .pageNavigation.colum8 li{
    width:100%;
  }
}
.pageNavigation.colum5 li{
  width:20%;
}
@media screen and (max-width:980px){
  .pageNavigation.colum5 li{
    width:25%;
  }
}
@media screen and (max-width:767px){
  .pageNavigation.colum5 li{
    width:100%;
  }
}
.pageNavigation li a{
  display:block;
  background:#00a0e9;
  margin-right:1px;
  text-align:center;
  white-space:nowrap;
  padding:5px 0;
}
@media screen and (max-width:767px){
  .pageNavigation li a{
    border:none !important;
    margin:0;
    background:none;
    text-align:left;
  }
}
.pageNavigation li:first-child a{
  border-left:1px solid #00a0e9;
}
.pageNavigation li:last-child a{
  border-right:1px solid #00a0e9;
  margin-right:0;
}
.pageNavigation li a:hover{
  background:#fff;
}
@media screen and (max-width:767px){
  .pageNavigation li a:hover{
    background:none;
  }
}
.pageNavigation li.on>a{
  background:#fff;
  border-left:1px solid #00a0e9;
  margin-left:-1px;
}
@media screen and (max-width:767px){
  .pageNavigation li.on>a{
    background:none;
  }
}
.pageNavigation li:first-child.on a{
  margin-left:0;
}
.pageNavigation li.on + li a{
  border-left:1px solid #00a0e9;
}

@media screen and (max-width:767px){
  .pageNavigation li.mainNavi{
    position:relative;
  }
  .pageNavigation li.mainNavi .plus{
    position:absolute;
    top:14px;
    right:10px;
    width:10px;
    height:1px;
    background:#333;
  }
  .pageNavigation li.mainNavi .plus:after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:10px;
    height:1px;
    background:#333;
    transform:rotate(90deg);
    transition: all 0.3s ease;
  }
  .pageNavigation li.mainNavi.open .plus:after{
    transform:rotate(0);
  }
}
.pageNavigation li .subNavi{
  display:none;
}
.pageNavigation li .subNavi li{
  border:none;
}
.pageNavigation li .subNavi li:before{
  content:"-";
  margin:0 5px;
}
.pageNavigation li .subNavi li a{
  padding:2px 0;
  display:inline-block;
}
.pagesubNavi{
  border-bottom:1px solid #00a0e9;
  padding:15px 0;
  margin-bottom:60px;
}
.pagesubNavi li{
  font-size:86%;
  float:left;
  padding:0 1em;
  border-right:1px solid #333;
  line-height:1;
  margin-bottom:5px;
  letter-spacing:0.1em;
}
.pagesubNavi li:last-child{
  border-right:none;
}
.pagesubNavi li a{
  position:relative;
}
.pagesubNavi li a:after{
  content:"";
  position:absolute;
  bottom:-4px;
  left:0;
  width:100%;
  height:1px;
  background:#fff;
}
.pagesubNavi li.on a:after,
.pagesubNavi li a:hover:after{
  background:#00a0e9;
}
/*---------------------------------------*/
/* projectList */
/*---------------------------------------*/
.projectList>li{
  float:left;
  width:23.5%;
  margin-right:2%;
  background:#fff;
  margin-bottom:100px;
}
@media screen and (max-width:980px){
  .projectList>li{
    width:47.5%;
    margin-right:5%;
  }
}
@media screen and (max-width:767px){
  .projectList>li{
    width:100%;
    margin-right:0;
    margin-bottom:20px;
  }
}
.projectList>li:nth-child(4n){
  margin-right:0;
}
@media screen and (max-width:980px){
  .projectList>li:nth-child(2n){
    margin-right:0;
  }
}
.projectList li .imgOuter{
  position:relative;
}
.projectList li .imgOuter .img{
  padding-top:53.6%;
  position:relative;
  overflow:hidden;
}
.projectList li .imgOuter .img a img{
  position:absolute;
  top:50%;
  left:0;
  transition: all 0.3s ease;
  transform:translate(0,-50%);
}
.projectList li .imgOuter .img a:hover img{
  opacity:0.7;
}
.projectList li .imgOuter .lavel{
  position:absolute;
  top:5px;
  left:-9px;
  width:48px;
  height:20px;
  text-align:center;
  line-height:20px;
  color:#fff;
  font-size:71%;
}
@media screen and (max-width:767px){
  .projectList li .imgOuter .lavel{
    left:-5px;
    font-size:7pt;
  }
}
.projectList li .imgOuter .lavel.new{
  background:#00a0e9;
}
.projectList li .imgOuter .lavel.fin{
  background:#333;
  letter-spacing:0.2em;
}
.projectList li .imgOuter .lavel.now{
  background:#717071;
}
.projectList li .txt{
  padding:10px 5%;
}
.projectList li .txt .catch{
  line-height:1.5;
  font-size:107%;
  margin-bottom:10px;
  height:4.5em;
}
@media screen and (max-width:767px){
  .projectList li .txt .catch{
    font-size:10pt
  }
}
.projectList li .txt .address{
  line-height:1.5;
  font-size:86%;
}
@media screen and (max-width:767px){
  .projectList li .txt .address{
    font-size:8pt;
  }
}
.projectList li .list{
  margin-bottom:5px;
}
.projectList li .list li{
  width:32.6%;
  float:left;
  margin-right:1.1%;
  text-align:center;
  background:#e6e6e6;
  line-height:1;
  padding:20px 0;
}
@media screen and (max-width:767px){
  .projectList li .list li{
    padding:10px 0;
  }
}
.projectList li .list li:nth-child(3){
  margin-right:0;
}
.projectList li .list li .ttl{
  font-size:71%;
  margin-bottom:5px;
}
@media screen and (max-width:767px){
  .projectList li .list li .ttl{
    font-size:7pt;
    margin-bottom:5px;
  }
}
.projectList li .list li .note{
  font-size:114%;
}
@media screen and (max-width:1250px){
  .projectList li .list li .note{
    font-size:100%;
  }
}
@media screen and (max-width:767px){
  .projectList li .list li .note{
    font-size:11pt;
  }
}
.projectList li .current{
  font-size:71%;
  text-align:center;
  margin-bottom:5px;
}
@media screen and (max-width:767px){
  .projectList li .current{
    font-size:7pt;
  }
}
.projectList li .current .num{
  font-size:220%;
}
@media screen and (max-width:767px){
  .projectList li .current .num{
    font-size:20pt;
  }
}
.projectList li .progressBar{
  position:relative;
  font-size:71%;
  width:90%;
  margin:0 auto;
  line-height:1.5;
  margin-bottom:25px;
}
@media screen and (max-width:767px){
  .projectList li .progressBar{
    font-size:7pt;
    margin-bottom:15px;
  }
}
.projectList li .progressBar .moreday{
  position:absolute;
  top:0;
  right:5%;
}
.projectList li .progressBar .bar{
  position:relative;
  width:100%;
  height:6px;
  background:#e6e6e6;
}
.projectList li .progressBar .bar .completion{
  position:absolute;
  top:0;
  left:0;
  height:100%;
}
.projectList li .progressBar .completion .completionIn{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:0;
  background:#00a0e9;
  transition: all 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s;
}
.projectList li .progressBar .bar.animation .completion .completionIn{
  width:100%;
}
.projectList li .btn{
  margin-bottom:15px;
}
/*---------------------------------------*/
/* projectContent */
/*---------------------------------------*/
.projectContent{
  overflow:visible;
}
.projectContent .blockLeft{
  width:50%;
}
@media screen and (max-width:767px){
  .projectContent .blockLeft{
    width:100%;
    margin-bottom:20px;
  }
}
.projectContent .blockLeft .imgOuter{
  position:relative;
  margin-bottom:35px;
}
@media screen and (max-width:767px){
  .projectContent .blockLeft .imgOuter{
    margin-bottom:15px;
  }
}
.projectContent .blockLeft .imgOuter img{
  transition: all 0.3s ease;
}
.projectContent .blockLeft .imgOuter a:hover img{
  opacity:0.7;
}
.projectContent .blockLeft .imgOuter .lavel{
  position:absolute;
  top:20px;
  left:-12px;
  width:58px;
  height:58px;
  text-align:center;
  line-height:58px;
  color:#fff;
}
@media screen and (max-width:767px){
  .projectContent .blockLeft .imgOuter .lavel{
    top:10px;
    left:-6px;
    width:40px;
    height:40px;
    line-height:40px;
    font-size:8pt;
  }
}
.projectContent .blockLeft .imgOuter .lavel.new{
  background:#00a0e9;
}
.projectContent .blockLeft .imgOuter .lavel.fin{
  background:#333;
}
.projectContent .blockLeft .imgOuter .lavel.now{
  background:#717071;
}
#index .projectContent .blockLeft .overview{
  height:250px;
}
.projectContent .blockRight{
  width:45%;
}
@media screen and (max-width:767px){
  .projectContent .blockRight{
    width:100%;
  }
}
.projectContent .blockRight table.status{
  width:100%;
  margin-bottom:20px;
  line-height:1.5;
}
.projectContent .blockRight table.status th{
  width:30%;
  padding:5px 0 5px 5px;
  vertical-align:middle;
}
@media screen and (max-width:767px){
  .projectContent .blockRight table.status th{
    width:40%;
  }
}
.projectContent .blockRight table.status td{
  text-align:right;
  padding:5px 0;
}
.projectContent .blockRight table.status td.current{
  font-size:214%;
  padding:0;
}
@media screen and (max-width:767px){
  .projectContent .blockRight table.status td.current{
    font-size:20pt;
  }
}
.projectContent .blockRight .progressBar{
  margin-bottom:45px;
}
@media screen and (max-width:767px){
  .projectContent .blockRight .progressBar{
    margin-bottom:25px;
  }
}
.projectContent .blockRight .progressBar .ttl{
  font-size:78.5%;
  margin-left:5px;
}
@media screen and (max-width:767px){
  .projectContent .blockRight .progressBar .ttl{
    font-size:7pt;
  }
}
.projectContent .blockRight .progressBar .bar{
  position:relative;
  width:100%;
  height:6px;
  background:#e6e6e6;
}
.projectContent .blockRight .progressBar .bar .completion{
  position:absolute;
  top:0;
  left:0;
  height:100%;
}
.projectContent .blockRight .progressBar .bar .completion .completionIn{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:0;
  background:#00a0e9;
  transition: all 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s;
}
.projectContent .blockRight .progressBar .bar.animation .completion .completionIn{
  width:100%;
}
.projectContent .blockRight .btn{
  margin-bottom:35px;
}
.projectContent .blockRight .infoBox{
  padding:30px 10%;
}
@media screen and (max-width:980px){
  .projectContent .blockRight .infoBox{
    padding:20px 5%;
  }
}
@media screen and (max-width:767px){
  .projectContent .blockRight .infoBox{
    padding:10px 5%;
  }
}
.projectContent .blockRight .infoBox table{
  width:100%;
  line-height:1.5;
}
@media screen and (max-width:980px){
  .projectContent .blockRight .infoBox table{
    font-size:86%;
  }
}
.projectContent .blockRight .infoBox table th{
  width:40%;
  padding:5px 0;
}
.projectContent .blockRight .infoBox table td{
  padding:5px 0;
}
/*---------------------------------------*/
/* articleArea */
/*---------------------------------------*/
.articleArea{
  padding:100px 0;
  border:1px solid #00a0e9;
}
@media screen and (max-width:767px){
  .articleArea{
    padding:30px 0;
  }
}
.articleArea .areaInner{
  max-width:650px;
  margin:0 auto;
}
.articleArea .areaInner p{
  max-width:605px;
  margin-left:auto;
  margin-right:auto;
}
.articleArea .areaInner .img{
  margin-bottom:40px;
}
@media screen and (max-width:767px){
  .articleArea .areaInner .img{
    margin-bottom:20px;
  }
}
/*---------------------------------------*/
/* colum */
/*---------------------------------------*/
/* columList */
.columList li{
  float:left;
  width:30%;
  margin-right:5%;
  margin-bottom:50px;
}
@media screen and (max-width:767px){
  .columList li{
    width:100%;
    margin:0 0 30px;
    position:relative;
    min-height:60px;
  }
}
.columList li:nth-child(3n){
  margin-right:0;
}
.columList li .img{
  margin-bottom:15px;
}
@media screen and (max-width:767px){
  .columList li .img{
    position:absolute;
    top:0;
    left:0;
    width:90px;
  }
}
.columList li .img img{
  transition: all 0.3s ease;
}
.columList li .img a:hover img{
  opacity:0.7;
}
.columList li .ttl{
  font-size:107%;
  line-height:1.5;
  margin-bottom:10px;
}
@media screen and (max-width:767px){
  .columList li .ttl{
    font-size:9pt;
    margin-left:110px;
  }
}
.columList li .more{
  font-size:86%;
  padding-bottom:5px;
  border-bottom:1px solid #9e9e9f;
  display:inline-block;
}
@media screen and (max-width:767px){
  .columList li .more{
    font-size:8pt;
    margin-left:110px;
    padding-bottom:0;
  }
}
.columList li .more .icon-more{
  color:#9e9e9f;
  margin-left:15px;
  transition: color 0.3s ease;
}
@media screen and (max-width:767px){
  .columList li .more .icon-more{
    margin-left:10px;
  }
}
.columList li .more a:hover .icon-more{
  color:#00a0e9;
}
/* columContent */
#colum .columContent{
  margin:0 140px;
}
@media screen and (max-width:980px){
  #colum .columContent{
    margin:0 140px 0 0;
  }
}
@media screen and (max-width:767px){
  #colum .columContent{
    margin:0 0 30px 0;
  }
}
#colum .columContentIn{
  max-width:605px;
  margin:0 auto;
}
#colum .columContent .img{
  margin-bottom:40px;
}
@media screen and (max-width:767px){
  #colum .columContent .img{
    margin-bottom:20px;
  }
}
#colum .othersContent{
  position:absolute;
  top:180px;
  right:0;
  width:100px;
}
@media screen and (max-width:767px){
  #colum .othersContent{
    position:static;
    width:100%;
  }
}
#colum .othersContent .ttl{
  font-weight:bold;
  line-height:1;
  padding-bottom:10px;
  margin-bottom:10px;
  border-bottom:1px solid #00a0e9;
}
#colum .othersContent ul li{
  font-size:71%;
  line-height:1.5;
  margin-bottom:5px;
  padding-left:0.3em;
}
@media screen and (max-width:767px){
  #colum .othersContent ul li{
    font-size:7pt;
    width:47.5%;
    margin-right:2.5%;
    float:left;
    padding:0;
    margin-bottom:10px;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
  }
}
/*---------------------------------------*/
/* news */
/*---------------------------------------*/
/* newsList */
.newsList li{
  height:80px;
  line-height:80px;
  border-bottom:2px solid #c8c9ca;
  position:relative;
}
@media screen and (max-width:767px){
  .newsList li{
    height:auto;
    line-height:1.5;
    padding:15px 0;
  }
}
.newsList li .date{
  position:absolute;
  top:0;
  left:0;
}
@media screen and (max-width:767px){
  .newsList li .date{
    position:relative;
  }
}
.newsList li .ttl{
  margin-left:130px;
  position:relative;
  height:80px;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
  padding-right:40px;
}
@media screen and (max-width:767px){
  .newsList li .ttl{
    height:auto;
    margin:0;
    padding-right:20px;
  }
}
.newsList li .ttl .icon-arrow{
  position:absolute;
  top:50%;
  right:0;
  transform:translate(0,-50%);
  font-size:10px;
}
@media screen and (max-width:767px){
  .newsList li .ttl .icon-arrow{
    font-size:7px;
  }
}
/* newsContent */
#news .newsContent .date{
  font-size:86%;
  margin-bottom:5px;
}
@media screen and (max-width:767px){
  #news .newsContent .date{
    font-size:8pt;
  }
}
#news .newsContent .mainTtl{
  margin-bottom:15px;
  line-height:1.5;
  padding-bottom:15px;
  border-bottom:1px solid #c9caca;
}
/*---------------------------------------*/
/* concept */
/*---------------------------------------*/
#concept .concept-topBg{
  position:absolute;
  top:0;
  background:url(../images/page/bg-concepttop.jpg) center no-repeat;
  background-size:cover;
  width:100%;
  height:330px;
}
@media screen and (max-width:767px){
  #concept .concept-topBg{
    height:170px;
  }
}
#concept .topTtl{
  font-family:"Noto Sans JP", sans-serif;
  font-weight:100;
  font-size:271%;
  letter-spacing:0.3em;
  padding-bottom:100px;
  position:relative;
  z-index:10;
}
@media screen and (max-width:767px){
  #concept .topTtl{
    font-size:18pt;
    padding-bottom:50px;
  }
}
#concept .conceptNote{
  line-height:2;
  margin-bottom:2em;
  font-size:114%;
}
@media screen and (max-width:767px){
  #concept .conceptNote{
    font-size:9pt;
    line-height:1.8;
    margin-bottom:1.8em;
  }
}
#concept .conceptNote:last-child{
  margin-bottom:0;
}
#concept .bg{
  padding:100px 0;
}
@media screen and (max-width:767px){
  #concept .bg{
    padding:50px 0;
  }
}
#concept .scheme{
  max-width:588px;
  margin:0 auto;
}
@media screen and (max-width:767px){
  #concept .scheme{
    margin:0 auto;
  }
}
#concept .feature .icon{
  max-width:152px;
  margin:0 auto 10px;
}
#concept .feature .ttl{
  text-align:center;
  margin-bottom:20px;
}
@media screen and (max-width:767px){
  #concept .feature .ttl{
    margin-bottom:5px;
  }
}
#concept .feature .ttl .num{
  font-size:243%;
  line-height:1;
  vertical-align:middle;
  margin-right:10px;
  position:relative;
  top:-2px;
}
@media screen and (max-width:767px){
  #concept .feature .ttl .num{
    font-size:23pt;
    top:-3px;
  }
}
#concept .feature .ttl .txt{
  font-size:107%;
  font-weight:bold;
}
@media screen and (max-width:767px){
  #concept .feature .ttl .txt{
    font-size:10pt;
  }
}
#concept .feature .baseNote{
  max-width:650px;
  margin-left:auto;
  margin-right:auto;
}
#concept .feature .blockLeft,
#concept .feature .blockRight{
  width:49%;
}
#concept .feature .img.w100img{
  max-width:650px;
  margin-left:auto;
  margin-right:auto;
}
/*---------------------------------------*/
/* guide */
/*---------------------------------------*/
#guide .guideContent{
  border-radius:5px;
  padding:40px 30px;
  background:#e6e6e6;
  position:relative;
  overflow:visible;
}
@media screen and (max-width: 767px){
  #guide .guideContent{
    border-radius:5px;
    padding:20px 5%;
  }
}
#guide .guideContent .ttl{
  margin-bottom:15px;
  line-height:1.5;
}
@media screen and (max-width: 767px){
  #guide .guideContent .ttl{
    margin-bottom:10px;
  }
}
#guide .guideContent.guide01 .ttl{
  margin-right:250px;
}
@media screen and (max-width: 767px){
  #guide .guideContent.guide01 .ttl{
    margin-right:0;
  }
}
#guide .guideContent .ttl .step{
  font-size:114%;
}
@media screen and (max-width: 767px){
  #guide .guideContent .ttl .step{
    font-size:9pt;
  }
}
#guide .guideContent .ttl .txt{
  font-size:186%;
}
@media screen and (max-width: 767px){
  #guide .guideContent .ttl .txt{
    font-size:12pt;
  }
}
#guide .guideContent .guideNote{
  font-size:114%;
  line-height:2.5;
}
@media screen and (max-width: 767px){
  #guide .guideContent .guideNote{
    line-height:2;
    font-size:9pt;
  }
}
#guide .guideContent.guide01 .guideNote{
  margin-right:250px;
}
@media screen and (max-width: 767px){
  #guide .guideContent.guide01 .guideNote{
    margin-right:0;
  }
}
#guide .guideContent .btn{
  position:absolute;
  top:50%;
  right:30px;
  width:238px;
  transform:translate(0,-50%);
}
@media screen and (max-width: 767px){
  #guide .guideContent .btn{
    position:static;
    width:100%;
    transform:none;
    margin-top:15px;
  }
}
#guide .guideContent .arrow{
  position:absolute;
  top:100%;
  margin-top:20px;
  left:50%;
  transform:translate(-50%,0);
  width:47px;
}
@media screen and (max-width: 767px){
  #guide .guideContent .arrow{
    width:23px;
    margin-top:10px;
  }
}