@import url(//fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url('//fonts.googleapis.com/css2?family=Bentham&display=swap');

html,body{
    font-family: '小塚ゴシック Pro','Kozuka Gothic Pro', 'Noto Sans JP' ,sans-serif;
    color:#666464;
    letter-spacing:0.06rem;
    padding:0;
    margin:0;
}
a:link,
a:visited,
a:active{
    text-decoration:none;   
}
a:hover{
    text-decoration:none;   
}
p {
    font-size: 14px;
}
li {
    font-size: 14px;
}

header{ 
    height:auto;
    padding:0;
    position:fixed;
    margin:0;
    width:100%;
    background:#f9de8c;
    top:0;
    left:0;
    z-index:999;}
.btn_sp{display:none;}
.logo{
    text-align:center;
    width:100%;
    display:block;
    height:auto;
    /*background:url(../img/logo.svg) 10px 15px no-repeat;*/
    /*background-size:150px auto;   */
}
.logo img{
    width:150px;
    height:auto;   
}
nav{
    margin-bottom:0;
}
nav ul {
    margin: 0 auto;
    padding: 0;
    display: flex;
    list-style: none;
    max-width: 1140px;
    justify-content: space-around;
    align-items: center;
}
nav ul li a {
    line-height: 1.6;
    font-size: 13px;
    font-weight: 500;
    display: block;
    padding: 24px 10px;
    position:relative;
}
nav ul li.corporate a{
    padding:0;
}
nav ul li.corporate a:hover::after{display: none}
nav ul li a:link,
nav ul li a:hover,
nav ul li a:visited,
nav ul li a:active{
    color:#231815;
    font-weight:300;
}
nav .link-current{
 position:relative;   
}
nav .link-current::after {
    background: #d3a003;
    width: 26px;
    height: 4px;
    position: absolute;
    left: 50%;
    bottom: 10px;
    content: "";
    display: block;
    animation-name: navActive;
    animation-duration: .6s;
    animation-fill-mode: forwards;
    animation-delay: .1s;
    opacity: 0;
    transform: translateY(30%);
    margin-left: -13px;
}
nav .corporate .link-current:after{
 display:none;   
}
.navul li:nth-child(5) .link-current::after, .navul li:nth-child(6) .link-current::after, .navul li:nth-child(7) .link-current::after {
    bottom: 10px;
    height: 4px;
    width: 220px;
}
.navul li a:hover::after {
    background: #d3a003;
    width: 26px;
    height: 4px;
    position: absolute;
    left: 50%;
    bottom: 10px;
    content: "";
    display: block;
    animation-name: navActive;
    animation-duration: .6s;
    animation-fill-mode: forwards;
    animation-delay: .1s;
    opacity: 0;
    transform: translateY(30%);
    margin-left: -13px;
}
nav ul .sub_ul{
    display: none;
    position: absolute;
    flex-wrap: wrap;
    width: 250px;
    padding: 0;
    left: -90px;
    top: 67px;
    justify-content: left;
    background: #fade8c;
    padding-left: 15px;
}
nav ul .sub_ul li{
    width: 100%;
}
nav ul .sub_ul li a{
    padding: 20px 0;
    display: block;
    transition: 0.5s ease-out;

}
nav ul .sub_ul li a:hover::after{
    display: none;
}
nav ul .sub_ul li a:hover{
    padding-left: 10px;
}
nav ul li.bussines:hover > .sub_ul{
    display: block;
}
@keyframes navActive {
    0% {
        opacity: 0;
        transform: translateY(30%);
    }
    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}

main{
 padding:69px 0 0 0px;   
}
.frontvisual{
overflow:hidden;
 display:flex;
 justify-content:space-between;
 margin:0;
 padding:0;
 height:580px;
}
.frontvisual h2{
font-family: 'Bentham', serif;
padding:70px 0 10px 9vw;
margin:0;
font-size:36px;
width:500px;
color:#d3a003;
}
.frontvisual p{
padding:0 0 0 9vw;   
color:#d3a003;
}
.frontvisual .left{
     background:#f6f5ef url(../img/fv.png) right top no-repeat;
     width:82%;
     background-size:auto 100%;
}
.right img {
    object-fit: cover;
    height: 100%;
    width:100%;
}
h3{
    font-size: 22px;
    color: #555;
}
.aboutus .left{
    background:#f6f5ef url(../img/aboutbg.jpg) right top no-repeat;
    width:100%;
    background-size:cover;
}
.about{
    display:flex;
    justify-content:space-between;
    overflow:hidden;
}
.about .container{
    width: 100%;
 padding:0 0 0 9vw;   
}
.about .title span{
    margin:60px 0 5px 50px;
    font-size:24px;
    line-height:1.1;
    font-weight:200;
    display:block;
}
.about h2{
    margin:0;
    padding:0px 0 40px 50px;
    font-size:11px;
    font-weight:200;
    color:#79858f;
}
.about .left h3{
    font-family:serif;
    font-weight:300;
}
.about .left p{
    margin-right:60px;
    font-family:serif;
    font-weight:300;
    line-height:1.8
}

.about .readmore{
 background:#d3a003;
 color:#fff;
 padding:5px 15px 5px 38px;
 border-radius:5px;
 font-size:11px;
 position:relative;   
 font-weight:300;
 margin-left:auto;
 display:block;
 width:80px;
 margin-right:60px;
 transition:0.5s ease-out;
}
.about .readmore:hover{
 padding:5px 20px 5px 42px;
}
.about .readmore:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}
.about .left{
 padding:0 0 0 105px;   
 position:relative;
}
.readmoreBtn{
 background:#d3a003;
 color:#fff;
 padding:5px 15px 5px 38px;
 border-radius:5px;
 font-size:11px;
 position:relative;   
 font-weight:300;
 margin-left:auto;
 display:block;
 width:100px;
 margin:5px 0 30px 0;
 transition:0.5s ease-out;
}
.readmoreBtn:hover{
 padding:5px 20px 5px 42px;
}
.readmoreBtn:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}
.section_bar{
   background-color: #cfdce7;
   width:1px;
   position:absolute;
   top:-20px;
   left:40px;
}
.realestate .box {
    padding:0 0 0 9vw;
}

.realestate .container {
    display: flex;
    flex-wrap: wrap;
    max-width: 900px;
    margin: 0 0 0 170px;
    position: relative;
    justify-content: space-evenly;
}
.section_bar02{
   background-color: #cfdce7;
   width:1px;
   position:absolute;
   top:80px;
   left:40px;
   z-index:0;
}
.realestate .title{
 position:relative;   
}
.realestate .title:before{
 content:"Business 01";
 display:block;
 position:absolute;
 left:-22px;
 top:50px;
 width:120px;
 height:20px;
 font-size:9px;
 color:#ddd;
 transform:rotate(90deg);
}
.realestate .title span{
    margin:60px 0 5px 60px;
    font-size:24px;
    line-height:1.1;
    font-weight:200;
    display:block;
}
.realestate h2{
    margin:0;
    padding:0px 0 40px 60px;
    font-size:11px;
    font-weight:200;
    color:#79858f;
}
.realestate h3{
    margin-top:0px;
    transition:0.4s all;   
}
.realestate01:hover h3,
.realestate02:hover h3,
.realestate03:hover h3,
.realestate04:hover h3{
    margin-top:-15px;  
    opacity:.8; 
}
.realestate01{
    width:47%;
    height:240px;   
    text-align:center;
    margin:0 30px 30px 0;
    display: flex;
justify-content: center;
align-items: center;
overflow:hidden;
position:relative;
background:#000;
}
.realestate01::after,
.realestate02::after,
.realestate03::after,
.realestate04::after {
    content: "Read More";
    display: block;
    color: #fff;
    line-height: 23px;
    width: 130px;
    border: solid 1px #fff;
    border-radius: 5px;
    text-align: center;
    position: absolute;
    top: 62%;
    left: 50%;
    margin-left: -65px;
    opacity: 0;
    z-index: 10;
    transition: 0.3s;
    font-weight: 300;
    letter-spacing: 0.1em;
    font-size:12px;
}
.realestate01:hover:after,
.realestate02:hover:after,
.realestate03:hover:after,
.realestate04:hover:after {
      opacity:.8;
  top:59%;
}
.realestate01 img{
 position:absolute;
 z-index:-1;   
  transition:all 0.6s;  
  width:100%;
}
.realestate01:hover img{
opacity:0.6;    
width:110%;
filter: blur(2px);
}
.realestate02{
    width:47%;
    height:240px;   
    text-align:center;
    margin:0 0px 30px 0;
    display: flex;
justify-content: center;
align-items: center;
overflow:hidden;
position:relative;
background:#000;
}
.realestate02 img{
 position:absolute;
 z-index:-1;   
  transition:all 0.6s;  
  width:100%;
}
.realestate02:hover img{
opacity:0.6;    
width:110%;
filter: blur(2px);
}
.realestate03{
    width:47%;
    height:240px;   
    text-align:center;
    margin:0 30px 60px 0;
    display: flex;
justify-content: center;
align-items: center;
overflow:hidden;
position:relative;
background:#000;
}
.realestate03 img{
 position:absolute;
 z-index:-1;   
  transition:all 0.6s;  
  width:100%;
}
.realestate03:hover img{
opacity:0.6;    
width:110%;
filter: blur(2px);
}
.realestate04{
    width:47%;
    height:240px;   
    text-align:center;
    margin:0 0px 60px 0;
    display: flex;
justify-content: center;
align-items: center;
overflow:hidden;
position:relative;
background:#000;
}
.realestate04 img{
 position:absolute;
 z-index:-1;   
  transition:all 0.6s;  
  width:100%;
}
.realestate04:hover img{
opacity:0.6;    
width:110%;
filter: blur(2px);
}
.realestate01 h3,
.realestate02 h3,
.realestate03 h3,
.realestate04 h3{
    color:#fff;
    font-weight:300;
    font-size:18px;
    margin:0;    
}
.realestate{z-index:0;overflow:hidden;}
.securitization{
    display:flex;
    justify-content:space-between;    
    z-index:1;  
    overflow:hidden;
}
.securitization .container{
    width: 75%;
}
.securitization .container .box{
    display: flex;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 110px 0 0 100px;
    position: relative;
    justify-content: space-evenly;
    width: auto;
}
.section_bar03{
   background-color: #cfdce7;
   width:1px;
   position:absolute;
   top:80px;
   left:60px;
   z-index:0;
}
.securitization .title{
 position:relative;   
}
.securitization .title:before{
 content:"";
 display:block;
 position:absolute;
 left:-4px;
 top:50px;
 width:120px;
 height:20px;
 font-size:9px;
 color:#ddd;
 transform:rotate(90deg);
}
.securitization .title span{
    margin:60px 0 5px 80px;
    font-size:24px;
    line-height:1.1;
    font-weight:200;
    display:block;
}
.securitization h2{
    margin:0;
    padding:0px 0 40px 80px;
    font-size:11px;
    font-weight:200;
    color:#79858f;
}
.securitization p{
    margin-right:110px;
    margin-left:110px;
    font-family:serif;
    font-weight:300;
    line-height:1.8
}
.securitization .readmore{
 background:#231815;
 color:#fff;
 padding:5px 15px 5px 38px;
 border-radius:5px;
 font-size:11px;
 position:relative;   
 font-weight:300;
 margin-left:auto;
 display:block;
 width:80px;
 margin-right:110px;
 transition:0.5s ease-out;
}
.securitization .readmore:hover{
 padding:5px 20px 5px 42px;
}
.securitization .readmore:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}
.business{
    display:flex;
    justify-content:space-between; 
    padding:60px 110px;
    overflow:hidden;
}
.business .container{
 padding:0 7px   
}
.business .title span{
    margin:60px 0 5px 0px;
    font-size:24px;
    line-height:1.1;
    font-weight:200;
    display:block;
}
.business h2{
    margin:0;
    padding:0px 0 40px 0px;
    font-size:11px;
    font-weight:200;
    color:#79858f;
}
.business .forest,
.business .agriculture,
.business .house{
    padding-right:50px;
    width:24%;
}

.business .forest .section_bar04{
   background-color: #cfdce7;
   width:1px;
   position:absolute;
   top:80px;
   left:-15px;
   z-index:0;
}
.business .forest .title{
 position:relative;
 padding-left:7px;
}
.business .forest .title:before{
 content:"Business 02";
 display:block;
 position:absolute;
 left:-77px;
 top:50px;
 width:120px;
 height:20px;
 font-size:9px;
 color:#ddd;
 transform:rotate(90deg);
}
.business .agriculture .section_bar05{
   background-color: #cfdce7;
   width:1px;
   position:absolute;
   top:80px;
   left:-15px;
   z-index:0;
}
.business .agriculture .title{
 position:relative;
 padding-left:7px;
}
.business .agriculture .title:before{
 content:"Business 02";
 display:block;
 position:absolute;
 left:-77px;
 top:50px;
 width:120px;
 height:20px;
 font-size:9px;
 color:#ddd;
 transform:rotate(90deg);
}
.business .house .section_bar06{
   background-color: #cfdce7;
   width:1px;
   position:absolute;
   top:80px;
   left:-15px;
   z-index:0;
}
.business .house .title{
 position:relative;
 padding-left:7px;
}
.business p{font-family:serif;}
.business .house .title:before{
 content:"Business 02";
 display:block;
 position:absolute;
 left:-77px;
 top:50px;
 width:120px;
 height:20px;
 font-size:9px;
 color:#ddd;
 transform:rotate(90deg);
}
.infoDetail .container,.privacy .container {
    max-width:800px;
    margin: 0 auto;
    padding:60px 30px;
    letter-spacing:0.1rem;
}
.privacy .container{
 line-height:1.8;   
}
.privacy .block{
 margin-bottom:40px;   
}
.infoDetail h2 {
    margin: 0 0 30px;
    color: #d3a003;
    font-family: 'Bentham', serif;
    font-size: 26px;
}
.infoDetail .date{
 color:#888;   
 font-size:12px;
}
.infoDetail p{
 line-height:1.8;
 margin:0 0 20px 0;   
}
.business .forest img, .business .agriculture img, .business .house img {
    width: 80%;
    margin-left: 10%;
}
.business .readmore{
 background:#231815;
 color:#fff;
 padding:5px 15px 5px 38px;
 border-radius:5px;
 font-size:11px;
 position:relative;   
 font-weight:300;
 margin-left:auto;
 display:block;
 width:80px;
 margin-right:0px;
 transition:0.5s ease-out;
}
.business .readmore:hover{
 padding:5px 20px 5px 42px;
}
.business .readmore:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}
.profile {
    background: url(../img/img_profile.jpg) center no-repeat;
    width: calc(100% - 220px);
    height: 300px;
    background-attachment: fixed;
    background-size: 100%;
    padding: 0 110px;
}
.profile .title span{
    padding:60px 0 5px 40px;
    font-size:26px;
    line-height:1.1;
    font-weight:200;
    display:block;
    color:#fff;
    font-family: 'Bentham', serif;
}
.profile h2{
    margin:0;
    padding:0px 0 40px 40px;
    font-size:11px;
    font-weight:200;
    color:#fff;
}
.profile .readmore{
 background-color:rgba(11,11,11,0.5);
 color:#fff;
 padding:5px 15px 5px 38px;
 border-radius:5px;
 font-size:11px;
 position:relative;   
 font-weight:300;
 margin-left:auto;
 display:block;
 width:80px;
 margin-right:60px;
 margin-top:40px;
 border:1px solid #fff;
 transition:0.5s ease-out;
}
.profile .readmore:hover{
 padding:5px 20px 5px 42px;
}
.profile .readmore:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}
.contact{
 background:#eff3f6;
 overflow:hidden;
 }
.contact img.left{
 width:180px;   
}
.contact img.right{
 width:420px;   
}
.contact .container{
    display:flex;
}
.contact .title{
 width:100%;   
}
.contact .title span{
    padding:60px 0 5px 40px;
    font-size:26px;
    line-height:1.1;
    font-weight:200;
    display:block;
    color:#231815;
    font-family: 'Bentham', serif;
}
.contact h2{
    margin:0;
    padding:0px 0 40px 40px;
    font-size:11px;
    font-weight:200;
    color:#231815;
}
.contact .readmore{
 background-color:#d3a003;
 color:#fff;
 padding:5px 15px 5px 38px;
 border-radius:5px;
 font-size:11px;
 position:relative;   
 font-weight:300;
 margin-left:auto;
 display:block;
 width:180px;
 margin-right:60px;
 margin-left:auto;
 margin-top:40px;
 border:1px solid #fff;
 transition:0.5s ease-out;
}
.contact .readmore:hover{
 padding:5px 20px 5px 42px;
}
.contact .readmore:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}

.copy{
    color:#a69591;
    font-size:11px;
    text-align:right;
    padding:0 30px 20px 0;
}

.information{
    display:flex;
    justify-content:space-between;
    overflow:hidden;
    margin-bottom: 80px;
}
.information .container{
    padding:0 0 0 9vw;
}
.information .title span{
    margin:60px 0 5px 50px;
    font-size:24px;
    line-height:1.1;
    font-weight:200;
    display:block;
}
.information h2{
    margin:0;
    padding:0px 0 40px 50px;
    font-size:11px;
    font-weight:200;
    color:#79858f;
}
.information .left {
    padding: 0 0 0 105px;
    position: relative;
}
.information .left h3{
    font-family:serif;
    font-weight:300;
}
.information .left p{
    margin-right:60px;
    font-family:serif;
    font-weight:300;
    line-height:1.8
}
.information .information_ul{
    list-style: none;
}
.information .information_ul a{
    display: block;
    width: 100%;
    margin-right: 110px;
    margin-left: 110px;
    font-family: serif;
    font-weight: 300;
    line-height: 1.8;
    color: #666464;
    padding: 15px 0;
    border-bottom: 0.5px solid #cedce7;
    transition:0.5s ease-out;
}
.information .information_ul a:hover{
    padding-left: 15px;
}
.information .information_ul a span{
    width: 20%;
    display: inline-block;
    font-size: 12px;
    font-family: auto;
    color: #79858f;
}

footer{
    background:#f9de8c;
    color:#231815;   
    padding:20px 0 0 0px;   
}
footer .container {
    display: flex;
    justify-content: space-between;
    padding:10px 110px 20px 110px;
    max-width:1140px;
    margin:0 auto;
}
footer ul {
    list-style: none;
    margin: 14px 0 0 0;
    padding: 0;
}
footer ul > li > ul{
 margin:0 0 0 10px;   
}
footer ul li{position:relative;}
footer ul li:before{
 width:3px;
 height:3px;
 border-radius:50%;
 content:"";
 display:block;
 position:absolute;
 top:13px;
 left:0;
 background:#666;   
}
footer ul li a:link, footer ul li a:active, footer ul li a:visited {
    display: block;
    font-size: 11px;
    color: #231815;
    position: relative;
    line-height: 32px;
    margin: 0 10px 0 0;
    font-weight: 300;
    padding-left:8px;
}
footer p {
    margin-top: 20px;
}

.shutter {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #f9de8c;
  z-index: 999;
  -webkit-animation: byeShutter 2.6s forwards;
          animation: byeShutter 2.6s forwards;
}
.shutter::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  background-color: #f3f3f3;
  width: 0;
  height: 1px;
  -webkit-animation: shutterOpen 2.6s forwards;
          animation: shutterOpen 2.6s forwards;
}

.content {
  -webkit-animation: contentScale 2.6s forwards;
          animation: contentScale 2.6s forwards;
}

@-webkit-keyframes byeShutter {
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
    z-index: -1;
  }
}

@keyframes byeShutter {
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
    z-index: -1;
  }
}
@-webkit-keyframes shutterOpen {
  0% {
    width: 0;
    height: 1px;
  }
  50% {
    width: 100%;
    height: 1px;
  }
  90% {
    width: 100%;
    height: 100%;
  }
  100% {
    width: 100%;
    height: 100%;
  }
}
@keyframes shutterOpen {
  0% {
    width: 0;
    height: 1px;
  }
  50% {
    width: 100%;
    height: 1px;
  }
  90% {
    width: 100%;
    height: 100%;
  }
  100% {
    width: 100%;
    height: 100%;
  }
}
@-webkit-keyframes contentScale {
  70% {
    transform: perspective(800px) scale(0.9) rotateX(15deg);
  }
  100% {
    transform: perspective(800px) scale(1) rotateX(0);
  }
}
@keyframes contentScale {
  70% {
    transform: perspective(800px) scale(0.9) rotateX(15deg);
  }
  100% {
    transform: perspective(800px) scale(1) rotateX(0);
  }
}

.frontvisual .right{
overflow: hidden;
  position: relative;
}
.frontvisual .right:before {
  animation: imgWrap .8s cubic-bezier(.4, 0, .2, 1) forwards;
  background: #fff;
  bottom: 0;
  content: '';
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
animation-delay: 3s;
}
@keyframes imgWrap {
  100% {
    transform: translateX(100%);
  }
}
.fade {
  transition: all 2000ms;
  opacity: 0;
  visibility: hidden;
  transform: translate(0px, 50px);
}

.fadein {
  opacity: 1;
  visibility: visible;
  transform: translate(0px, 0px);
} 
.fade-text {
   margin-right:60px;
    font-family:serif;
    font-weight:300;
    line-height:1.8;
}
.slide{
   transition: all 2000ms;
  opacity: 0;
  visibility: hidden;
  transform: translate(-100px, 0px);   
}
.slidein {
  opacity: 1;
  visibility: visible;
  transform: translate(0px, 0px);
} 
.frontvisual .left{
overflow: hidden;
  position: relative;
}
.frontvisual .left:before {
  animation: imgWrap2 0.8s cubic-bezier(.2, 0, .2, .5) forwards;
  background: #fff;
  bottom: 0;
  content: '';
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
animation-delay: 2.4s;
}

/*About us*/
.about02{
    display:flex;
    justify-content:space-between;
    overflow:hidden;
    padding: 5vw 0;
    align-items: center;
}
.about02 .container{
    width: 100%;
 padding:0 0 0 9vw;   
}
.about02 .left h3{
    font-family:serif;
    font-weight:300;
}
.about02 .left p{
    margin-right:60px;
    font-family:serif;
    font-weight:300;
    line-height:1.8
}
.about02 .left{
 padding:0 0 0 105px;   
 position:relative;
}
.about03{
    display:flex;
    justify-content:space-between;    
    z-index:1;  
    overflow:hidden;
    padding: 5vw 0;
}
.about03 .container{
    width: 75%;
}
.about03 .right{
    position: relative;
}
.about03 h3{
    margin-right:110px;
    margin-left:110px;
    font-family: serif;
    font-weight: 300;
}
.about03 p{
    margin-right:110px;
    margin-left:110px;
    font-family:serif;
    font-weight:300;
    line-height:1.8
}
.about .section_center{
 margin:0 auto;   
}
.section_center{
    display: flex;
    overflow: hidden;
    padding: 8vw;
    align-items: center;
    justify-content: center;
    padding-bottom: 6vw;
}
.section_center .container{
    text-align: center;
    border-left: 1px solid #cedce7;
    border-right: 1px solid #cedce7;
    display: flex;
    padding: 0 8px;
    width: 600px;
    max-width: 90%;
}
.section_center .center{
    padding: 1vw 4vw;
    border-left: 1px solid #cedce7;
    border-right: 1px solid #cedce7;
    font-family: serif;
}
/* About us end*/

@keyframes imgWrap2 {
  100% {
    transform: translateX(100%);
  }
}


header{
       top:-150px;
       left:0;
animation-name: headerFade;
animation-duration: .8s;
animation-fill-mode: forwards;
animation-delay: 2.1s;
opacity:0;
    height: 69px;
}

.logo{
    transform: translateX(-150%);
animation-name: fadeIn;
animation-duration: 1s;
animation-fill-mode: forwards;
animation-delay: 2s;
opacity:0;
}
.frontvisual .title{
    transform: translateY(50%);
animation-name: fadeInUp;
animation-duration: 1s;
animation-fill-mode: forwards;
animation-delay: 2.7s;
opacity:0;
}

.navul li {
transform: translateX(-150%);
animation-name: fadeIn;
animation-duration: 1s;
animation-fill-mode: forwards;
opacity:0;
}

/*.navul li:nth-child(1){ animation-delay: 2.1s; }*/
/*.navul li:nth-child(2){ animation-delay: 2.2s; }*/
/*.navul li:nth-child(3){ animation-delay: 2.3s; }*/
/*.navul li:nth-child(4){ animation-delay: 2.4s; }*/
/*.navul li:nth-child(5){ animation-delay: 2.5s; }*/
/*.navul li:nth-child(6){ animation-delay: 2.6s; }*/
/*.navul li:nth-child(7){ animation-delay: 2.7s; }*/
/*.navul li:nth-child(8){ animation-delay: 2.8s; }*/
/*.navul li:nth-child(9){ animation-delay: 2.9s; }*/
/*.navul li:nth-child(10){ animation-delay: 3.0s; }*/
            
@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0%);
    }
}            
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}
@keyframes headerFade {
    0% {
        opacity: 0;
        top: -150px;
    }
    100% {
        opacity: 1;
        top: 0;
    }
}
@keyframes lefFade {
    0% {
        opacity: 0;
        transform: translateX(-40%);
    }
    100% {
        opacity: 1;
        transform: translateX(0%);
    }
}
@keyframes righFade {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0%);
    }
}
.sp_logo{display:none;}


/*.frontvisual.election{*/
/*    height: 380px;*/
/*}*/
.election .left{
    background: #f6f5ef url(../img/electedbg.jpg) center top no-repeat;
    width: 100%;
    background-size: auto 100%;
}
.election01 img{
    display: block;
    width: 1200px;
    max-width: 90%;
    margin: 0 auto;
    margin-bottom: 100px;
}
.election02 .container{
    display: flex;
    justify-content: center;
    background:url(../img/img_elected02.jpg) right bottom no-repeat;
    width:100%;
    background-size:cover;
    margin-bottom: 40px;
}
.election02 .container .center{
    z-index: 1;
    background: #fff;
    height: 100%;
    padding: 4vw 6vw 6vw;
    width: 50%;
    max-width: 800px;
    font-family: serif;
    line-height: 1.4rem;
}
.election02 .container img{
    width: 100%;
}
.election03 .container{
    padding: 6vw 0 0;
}
.election03 .container .point{
    background: #fcf8ec;
    display: flex;
    justify-content: space-between;
    padding: 0 6vw;
    margin-bottom: 7vw;
    font-family: serif;
    line-height: 1.5rem;
    position: relative;
    align-items: center;
}
.election03 .container .point img{max-width: 100%}
.election03 .container .point .p_left,.election03 .container .point .p_right{
    width: 50%;
    padding: 30px;
    
}
.election03 .container .point01{
    margin-left: 90px;
}
.election03 .container .point02{
    margin-right: 90px;
    flex-flow: row-reverse;
}
.election03 .container .point span{
    color: #f0b80d;
    font-size: 46px;
    position: absolute;
    top: -40px;
    line-height: initial;
}
/* Support */
.frontvisual.secondPage{
    height: 380px;
}
.frontvisual.secondPage .left{
    height:380px;
}
.support .left{
    background:#f6f5ef url(../img/supportbg.jpg) right top no-repeat;
    width:100%;
    background-size:cover;
}
.support01{
    display:flex;
    justify-content:space-between;
    overflow:hidden;
    padding: 5vw 0;
    align-items: center;
}
.support01 .container{
    width: 100%;
 padding:0 0 0 9vw;   
}
.support01 .left h3{
    font-family:serif;
    font-weight:300;
}
.support01 .left p{
    margin-right:60px;
    font-family:serif;
    font-weight:300;
    line-height:1.8
}
.support01 .left{
 padding:0 0 0 105px;   
 position:relative;
}
.support02{
    display: flex;
    justify-content: center;
    background:url(../img/img_support02.jpg) right bottom no-repeat;
    width:100%;
    background-size:cover;
}
.support02 .container{
    display: flex;
    justify-content: center;
    background:url(../img/img_support03.svg) center bottom no-repeat;
    width: 100%;
    background-size: auto 100%;
    padding: 4vw 0;
}
.support02 .container .center{
    display: flex;
    justify-content: center;
    width:80%;
    background-size:cover;
    flex-wrap: wrap;
}
.support02 .title{
    width: 100%;
}
.support02 .title span{
    margin:60px 0 5px 50px;
    line-height:1.1;
    font-weight:200;
    display:block;
    color: #f0b80d;
    font-size: 30px;
    font-family: 'Bentham', serif;
}
.support02 h2{
    margin:0;
    padding:0px 0 40px 50px;
    font-size:11px;
    font-weight:200;
    color: #f0b80d;
}
.support02 .container .center .boxs{
    width: calc(30% - 120px);
    background: rgb(252 249 240 / 80%);
    margin: 1%;
    padding: 60px;
    padding-bottom: 100px;
    line-height: 1.5rem;
    font-family: serif;
}

/* Support */
.frontvisual.profiletop{
    height: 380px;
}

.profiletop .left{
    background:#f6f5ef url(../img/profilebg.jpg) right top no-repeat;
    width:100%;
    background-size:cover;
}
.profile01{
    display:flex;
    justify-content:space-between;
    overflow:hidden;
    padding: 5vw 0;
    align-items: center;
}
.profile01 iframe{
 background:#fff;
 padding-top:30px;   
}
.profile01 .container{
    width: 90%;
    background: #fcf8ec;
    max-width: 860px;
    margin: 0 auto;
}
.profile01 table{padding: 3vw 5vw;font-family: serif;font-size: 14px;}
.profile01 table tr th{padding: 15px 0;
    border-bottom: 1px solid #ece7d5;
    width: 25%;
    text-align: left;}
.profile01 table tr td{padding: 15px 0;
    border-bottom: 1px solid #ece7d5;}

/* Contact us */

.frontvisual.contactus{
    height: 290px;
}

.contactus .left{
    background:#f6f5ef url(../img/contactbg.jpg) right top no-repeat;
    width:100%;
    background-size:cover;
}
.need {
    display: inline-block;
    color: rgb(255, 255, 255);
    font-size: 12px;
    margin-left: 8px;
    line-height: 12px;
    background: rgb(236, 73, 53);
    padding: 3px 4px;
    border-radius: 2px;
    font-family: serif;
}
.contact_form .form {
    background: #fcf8ec;
    padding: 30px 50px;
    width: 80%;
    max-width: 650px;
    margin: 60px auto;
    min-height: 30vh;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.contact_form .form h3 {
    text-align: center;
    color: #333;
    font-weight: 100;
    font-size: 1.4rem;
    margin-bottom: 0px;
    width: 100%;
}

.contact_form .form table {
    width: 100%;
    max-width: 800px;
    margin: 30px auto 40px;
}

.contact_form .form table tr {
    width: 100%;
    display: flex;
    margin-bottom: 20px;
    align-items: center;
}

.contact_form .form table tr th {
    text-align: right;
    width: 30%;
    padding-right: 20px;
    font-size: 14px;
    font-weight: 100;
    line-height: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-family: serif;
}

.contact_form .form table tr td {
    width: 70%;
}

.contact_form .form table tr.submit_link {
    margin-top: 20px;
}

.contact_form .form table tr.submit_link td {
    text-align: left;
}

.input {
    width: 96%;
    padding: 10px 2%;
    border-radius: 2px;
    -webkit-appearance:none;
    transition: all .5s;
    -moz-transition: all .5s;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    border: none;
}

.input:focus-visible {
    border-color: #E4AA6A;
    outline: none;
}

.contact_form .form .btn {
    color: #fff;
    padding: 8px 15px 8px 46px;
    border-radius: 5px;
    font-size: 12px;
    position: relative;
    font-weight: 300;
    margin-left: auto;
    display: block;
    transition: 0.5s ease-out;
    border: none;
    background: url(../img/arrow.png) left 12px center no-repeat,#d3a003;
    background-size: 20px auto;
}
.contact_form .form .btn:hover {
    padding: 8px 20px 8px 50px;
}

.contactus .readmore {
    background-color: #d3a003;
    color: #fff;
    padding: 5px 15px 5px 38px;
    border-radius: 5px;
    font-size: 11px;
    position: relative;
    font-weight: 300;
    display: block;
    width: 180px;
    margin-top: 40px;
    border: 1px solid #fff;
    transition: 0.5s ease-out;
}
.contactus .readmore:hover{
    padding:5px 20px 5px 42px;
}
.contactus .readmore:before{
    content:"";
    display:block;
    position:absolute;
    left:12px;
    top:8px;
    width:20px;
    height:12px;
    background:url(../img/arrow.png) 0 0 no-repeat;
    background-size:20px auto;
}
.nav_home_sp{
     display: none;
 }
.nav_home_pc{
    display: block;
}