@charset "utf-8";

/*========= レイアウトのためのCSS ===============*/
html{scroll-behavior: smooth;}
body{margin: 0;font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;}

h1{
  font-size:1.2rem;
}
h1 img.logo{
    z-index: 9999;
    position: relative;
	width: 200px;
}
h4{font-size: 26px;}

.t_center{text-align: center;}
.t_right{text-align:right;}
.cont_center{justify-content: center;}

.d_block{display: block;}

p{margin: 0;}

.bg_orange{background-color: #FF7E00;}
.bg_orange2{background-color: rgba(198,108,0,0.59);}
.bg_white{background-color: #fff !important;}
.bg_white2{background-color: rgba(255,255,255,0.46);}
.bg_blue{background-color:#D5EFFB;}
.bg_blue2{background-color:#009FE8;}
.bg_blue3{background-color:#00458c;}
.bg_gray{background-color: #d0d0d0;}
.bg_yellow{background-color: #f6d08b78;}
.bg_none{background: unset !important;}

.bk{color: #000;}
.white{color: #fff;}
.orange{color:#FF7E00;}
.orange2{color:#521E07;}
.red{color: #BC0003;}
.blue{color:#008DE3;}
.yellow{color:#ffff00;}
.gray{color: #666;}
.green{color: #1F7C3B;}
.b{font-weight: bold;}
.dec_none{text-decoration: none;}

.kadomaru{border-radius: 20px;}

.w100{width: 100%;}
.w90{width: 90%;}
.w20{width: 20%;}
.mw90{max-width: 90%;}
.mw80{max-width: 80%;}
.mw70{max-width: 70%;}
.mw60{max-width: 60%;}

.p10{padding: 10px;}
.p20{padding: 20px;}
.p30{padding: 30px;}
.p40{padding: 40px;}
.p50{padding: 50px;}

.pt0{padding-top: 0px !important;}
.pt10{padding-top: 10px;}
.pt20{padding-top: 20px;}
.pt30{padding-top: 30px;}
.pt40{padding-top: 40px;}
.pt50{padding-top: 50px;}

.pb0{padding-bottom: 0px !important;}
.pb10{padding-bottom: 10px;}
.pb20{padding-bottom: 20px;}
.pb30{padding-bottom: 30px;}
.pb40{padding-bottom: 40px;}
.pb50{padding-bottom: 50px;}

.m-a{margin: auto;}
.m0{margin:0 !important;}

.mt0{margin-top: 0px !important;}
.mt10{margin-top: 10px;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mt70{margin-top: 70px;}
.mt80{margin-top: 80px;}
.mt90{margin-top: 90px;}
.mt100{margin-top: 100px;}

.mb0{margin-bottom: 0px !important;}
.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}
.mb70{margin-bottom: 70px;}
.mb80{margin-bottom: 80px;}
.mb90{margin-bottom: 90px;}
.mb100{margin-bottom: 100px;}

.ml0{margin-left: 0px;}
.ml10{margin-left: 10px;}
.ml20{margin-left: 20px;}
.ml30{margin-left: 30px;}
.ml40{margin-left: 40px;}
.ml50{margin-left: 50px;}
.ml60{margin-left: 60px;}
.ml70{margin-left: 70px;}
.ml80{margin-left: 80px;}
.ml90{margin-left: 90px;}
.ml100{margin-left: 100px;}

.mr0{margin-right: 0px;}
.mr10{margin-right: 10px;}
.mr20{margin-right: 20px;}
.mr30{margin-right: 30px;}
.mr40{margin-right: 40px;}
.mr50{margin-right: 50px;}
.mr60{margin-right: 60px;}
.mr70{margin-right: 70px;}
.mr80{margin-right: 80px;}
.mr80{margin-right: 90px;}
.mr100{margin-right: 100px;}

.lh180{line-height: 180%;}
.lh190{line-height: 190%;}
.lh200{line-height: 200%;}
.lh210{line-height: 210%;}
.lh220{line-height: 220%;}
.lh230{line-height: 230%;}

.text120{font-size: 120%;}
.text130{font-size: 130%;}
.text140{font-size: 140%;}
.text150{font-size: 150%;}
.text160{font-size: 160%;}
.text170{font-size: 170%;}
.text180{font-size: 180%;}


small{
  color:#000;
  display: block;
  text-align: center;
    line-height: 30px;
        left: -15px;
    position: relative;
}

#header{
  width:90%;
    max-width: 1300px;
    margin: 20px auto;
}

section{
  padding:100px 30px;
}
.container{
        max-width: 1300px;
    margin: auto;
    width: 90%;
}
.container2{
        max-width: 850px;
    margin: auto;
    width: 90%;
}
.container3{
        max-width: 1000px;
    margin: auto;
    width: 90%;
}

section:nth-child(2n){
  background:#d0d0d0; 
}

#footer{
  background:#fff;
  padding:20px;
}

.nav_box{
    width:100%;
    max-width: 1300px;
    margin: auto;
    
}
.pc_onry{display: block;}
.sp_onry{display: none;}

@media screen and (max-width: 764px){
h1{
    margin: 10px 0;
}
    #header{
  width:95%;
    margin: 15px auto 0;
}

    #header img{
        width: 150px;
    }
    
    .nav_box{
    width:95%;
    margin: auto;
    }
    section{
  padding:30px 10px;
}
.pc_onry{display: none;}
.sp_onry{display: block;}

.w20{width: 60%;}

.p10{padding: 10px;}
.p20{padding: 10px;}
.p30{padding: 20px;}
.p40{padding: 20px;}
.p50{padding: 20px;}

.pt10{padding-top: 10px;}
.pt20{padding-top: 10px;}
.pt30{padding-top: 10px;}
.pt40{padding-top: 20px;}
.pt50{padding-top: 20px;}

.pb10{padding-bottom: 10px;}
.pb20{padding-bottom: 10px;}
.pb30{padding-bottom: 10px;}
.pb40{padding-bottom: 20px;}
.pb50{padding-bottom: 20px;}
    
.mt10{margin-top: 10px;}
.mt20{margin-top: 10px;}
.mt40{margin-top: 10px;}
.mt50{margin-top: 30px;}
.mt60{margin-top: 30px;}
.mt70{margin-top: 30px;}
.mt80{margin-top: 30px;}
.mt90{margin-top: 30px;}
.mt100{margin-top: 30px;}

.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 10px;}
.mb30{margin-bottom: 10px;}
.mb40{margin-bottom: 20px;}
.mb50{margin-bottom: 30px;}
.mb60{margin-bottom: 40px;}
.mb70{margin-bottom: 40px;}
.mb80{margin-bottom: 40px;}
.mb90{margin-bottom: 40px;}
.mb100{margin-bottom: 40px;}

.ml10{margin-left: 10px;}
.ml20{margin-left: 10px;}
.ml30{margin-left: 10px;}
.ml40{margin-left: 20px;}
.ml50{margin-left: 20px;}
.ml60{margin-left: 30px;}
.ml70{margin-left: 30px;}
.ml80{margin-left: 30px;}
.ml90{margin-left: 30px;}
.ml100{margin-left: 30px;}

.mr10{margin-right: 10px;}
.mr20{margin-right: 10px;}
.mr30{margin-right: 10px;}
.mr40{margin-right: 20px;}
.mr50{margin-right: 20px;}
.mr60{margin-right: 30px;}
.mr70{margin-right: 30px;}
.mr80{margin-right: 30px;}
.mr80{margin-right: 30px;}
.mr100{margin-right: 30px;}

.text120{font-size: 110%;}
.text130{font-size: 110%;}
.text140{font-size: 120%;}
.text150{font-size: 120%;}
.text160{font-size: 120%;}
.text170{font-size: 120%;}
.text180{font-size: 120%;}

small{left: 0px;}


}


/*========= ナビゲーションのためのCSS ===============*/

#g-nav{
    /*position:fixed;にし、z-indexの数値を小さくして最背面へ*/
    position:absolute;
  z-index: -1;
  opacity: 0;/*はじめは透過0*/
    /*ナビの位置と形状*/
  top:0;
    right: 0;
  width:500px;
    height: 620px;/*ナビの高さ*/
  background:#eee;
    /*動き*/
  transition: all 0.3s;
}

/*アクティブクラスがついたら透過なしにして最前面へ*/
#g-nav.panelactive{
  opacity: 1;
  z-index:999;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: relative;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
    display: none;
    /*ナビゲーション天地中央揃え*/
    position: absolute;
    z-index: 999;
    top:332px;
    left:50%;
    transform: translate(-50%,-50%);
    /*border-left: 1px #999 dotted;*/
    padding: 0px;
    width: 100%;
}

/*#g-nav ul::after{
    content: "●";
    font-size: 18px;
    color: #03A9F7;
    position: absolute;
    bottom: -10px;
    left: -6px;
}*/

#g-nav.panelactive ul {
    display: block;
}

/*リストのレイアウト設定*/

#g-nav li{
  list-style: none;
    text-align: left; 
    border-bottom: solid 1px #03A9F7;
}

#g-nav li:first-child{
    border-top:solid 1px #03A9F7;
}

#g-nav li a{
  color: #03A9F7;
  text-decoration: none;
  padding: 20px 60px 20px 0;
  display: block;
  text-transform: uppercase;
  /*letter-spacing: 0.1em;*/
    font-size: 18px;
    text-align: right;
}

@media screen and (max-width: 764px){
    #g-nav{
        width: 100%;
        height: 600px;
    }
    #g-nav ul {
    top:300px;
    left:0%;
    padding: 0px;
        right: 0;
}
    #g-nav li{
  width: 150%; 
}
    #g-nav li a{
        font-size: 16px;
        padding: 20px;
    }

    
}


/*========= ボタンのためのCSS ===============*/
.openbtn1{
  position:absolute;
    z-index: 9999;/*ボタンを最前面に*/
  top:10px;
  right: 80px;
  cursor: pointer;
    width: 60px;
    height:50px;
}
  
/*×に変化*/  
.openbtn1 span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 2px;
    border-radius: 3px;
  background-color: #008DE3;
    width: 75%;
  }

#top .openbtn1 span{
    background-color: #fff;
}

.openbtn1 span:nth-of-type(1) {
  top:15px; 
}

.openbtn1 span:nth-of-type(2) {
  top:26px;
}

.openbtn1 span:nth-of-type(3) {
  top:37px;
}

.openbtn1.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-30deg);
    width: 70%;
	background-color: #008DE3;
}
#top .openbtn1.active span:nth-of-type(1),
#top .openbtn1.active span:nth-of-type(3)
{
	background-color: #008DE3;
}

.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn1.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(30deg);
    width: 70%;
	background-color: #008DE3;
}

.x_logo{
    width: 30px;
    float: left;
}

@media screen and (max-width: 764px){
    .openbtn1{
  top:0px;
  right: 20px;
  cursor: pointer;
    width: 40px;
    height:50px;
}
.openbtn1 span:nth-of-type(1) {
  top:17px; 
}

.openbtn1 span:nth-of-type(2) {
  top:24px;
}

.openbtn1 span:nth-of-type(3) {
  top:31px;
}
    
    
}

/*==================================================
ふわっとアニメーション
===================================*/

/* その場で */
.fadeIn{
animation-name:fadeInAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* 下から */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 上から */

.fadeDown{
animation-name:fadeDownAnime;
animation-duration:2s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeDownAnime{
  from {
    opacity: 0;
  transform: translateY(-100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 左から */

.fadeLeft{
animation-name:fadeLeftAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeLeftAnime{
  from {
    opacity: 0;
  transform: translateX(-100px);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}

/* 右から */

.fadeRight{
animation-name:fadeRightAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeRightAnime{
  from {
    opacity: 0;
  transform: translateX(100px);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}
.flex{
  display:flex;
  flex-wrap: wrap;
}



/*トップページ*/
#top .tel,
#about .tel{display: none;}

.top_bg{
    background:url("../img/top/bg4.jpg") repeat-x;
    background-size: auto;
    margin-top: -120px;
    background-position: 50% 0%;
	background-position: 0 0;
    -webkit-animation: bgroop 130s linear infinite;
    animation: bgroop 130s linear infinite;
}
@-webkit-keyframes bgroop {
    from {
        background-position: 0  0;
    }
    to {
        background-position: -4160px 0;
    }
}
@keyframes bgroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -4160px 0;
    }
}

.reed_text{
        max-width: 870px;
    margin: auto;
    width: 80%;
    padding-bottom: 380px;
	padding-top: 150px;
}
.reed_text img{
        max-width: 1000px;
    margin: 40px auto 0;
    width: 100%;
}
.cont_box{
    display: flex;
}
.cont_margin{
    margin-top: -380px;
}
.bnr_area{width: 1000px;margin: auto;}
.bnr_box2{
        width: calc(100% / 2);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 30px 0 30px;
}
.bnr_box2 img{
    width: 80%;
	margin: auto;
	display: block;
}
.box4{
        width: calc(100% / 4);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 30px 0 0;
}
.box4 img{
    width: 100%;
}
.box4:last-child{
    margin: 0;
}

table.table_info{color: #434343; font-size: 16px; line-height: 220%; text-align: left;}
table.table_info td{vertical-align: top;}
table.table_info td.tit{width: 15%;}
table.table_info td.text{width: 85%;}
table.table_info a{color: #434343;}

.bnr01{
	max-width: 1000px;
	margin:50px auto 0;
	display: block;
}
.bnr01 img{
	width: 100%;
}
img.p100s90{
    max-width: 600px;
}
img.t_logo{
	width: 260px
}

@media screen and (max-width: 764px){
.top_bg{
    background-size: 590%;
    margin-top: -71px;
    -webkit-animation: bgroop 200s linear infinite;
    animation: bgroop 200s linear infinite;
}
.reed_text{
        max-width: 1000px;
    margin: auto;
    width: 80%;
    padding-bottom: 80px;
    padding-top: 70px;
}
.cont_margin{
    margin-top:-80px;
}
.bnr_area{width: 100%;margin: auto;}
.bnr_box2{
        width: calc(100% / 1);
	margin: 0 10px 0 10px;
	}
.bnr_box2 img{width: 100%;}
    .box4{
        width: calc(100% / 4);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px 0 0;
}
    table.table_info{font-size: 14px; line-height: 220%;min-height: 700px;}
table.table_info td.tit{width: 30%;}
table.table_info td.text{width: 70%;}
img.p100s90{max-width: 90%;}
    
.bnr01{
	max-width: 1000px;
	margin:20px auto 0;
	display: block;
}
    
    
}


/*リノベーションページ*/
.top_bg2{
    background:url("../img/renovation/bg2.jpg") no-repeat,#f3f3f3;
    background-size: contain;
    background-position: 0px -200px;
}
.reed_text2{
    max-width: 870px;
    margin: 0 auto;
    width: 80%;
    padding: 50px 0;
}
.reed_text2 img{
    margin: auto;
    width: 100%;
}
.triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 65px solid transparent;
  border-left: 65px solid transparent;
  border-top: 60px solid #eb8205;
    border-bottom: 0;
    position: absolute;
    left: 45%;
}

.waku001{
    background-color: #fff;
    padding: 0 50px;
    position: relative;
  text-align: center;
}
/*.waku001:before,
.waku001:after {
  position: absolute;
  content: '';
}

.waku001:after {
  top: 0;
  left: 0;
  width: 90px;
  height: 90px;
  border-top: 2px solid #008DE3;
  border-left: 2px solid #008DE3;
}

.waku001:before {
  right: 0;
  bottom: 0;
  width: 90px;
  height: 90px;
  border-right: 2px solid #008DE3;
  border-bottom: 2px solid #008DE3;
}*/
.waku001 p{
    font-size: 20px;
    line-height: 180%;
    font-weight: bold;
    padding: 30px;
}

.waku002{
  position: relative;
  display: block;
  margin: 1.5em 0 5em;
  padding: 30px 10px;
  min-width: 120px;
  max-width: 100%;
  font-size: 18px;
  background: #FFF;
  border-bottom: solid 3px #FF7E00;
  box-sizing: border-box;
        font-weight: bold;
    line-height: 180%;
}

.waku002:before {
  content: "";
  position: absolute;
  bottom: -70px;
  left: 50%;
  margin-left: -38px;
  border: 35px solid transparent;
  border-top: 35px solid #FFF;
  z-index: 2;
}

.waku002:after {
  content: "";
  position: absolute;
  bottom: -80px;
  left: 50%;
  margin-left: -43px;
  border: 40px solid transparent;
  border-top: 40px solid #FF7E00;
  z-index: 1;
}

h2.tit001{
    color: #008de4;
    font-size: 30px;
    margin-bottom: 50px;
}
.u_dot0{
    border-top: #000 dotted 2px;
}
.u_dot{
    border-top: #000 dotted 2px;
    padding: 30px;
    font-size: 26px;
    line-height: 180%;
        margin-top: 0;
}

@media screen and (max-width: 764px){
.top_bg2 {
    background: url(../img/renovation/bg2.jpg) 50% no-repeat , #f3f3f3;
    background-size: 100%;
    background-position: 50% -2%;
}
.reed_text2 {
    padding: 20px 0;
}
.triangle {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 35px solid transparent;
    border-left: 35px solid transparent;
    border-top: 30px solid #eb8205;
    border-bottom: 0;
    position: absolute;
    left: 42%;
}
.waku001 {
    background-color: #fff;
    padding: 20px;
    position: relative;
    text-align: center;
    margin-top: 30px;
}
    h2.tit001 {
    font-size: 20px;
    margin-bottom: 30px;
}
    .waku002 {
    margin: 1.5em 0 3em;
    padding: 20px;
    font-size: 18px;
    line-height: 180%;
}
    .waku001 p {
    font-size: 16px;
    line-height: 180%;
    font-weight: bold;
    padding: 20px;
}
.u_dot {
    padding: 20px;
    font-size: 20px;
}


    
}


/*不動産仲介*/
.top_bg3{
    background:url("../img/realestate/bg.jpg") no-repeat;
    background-size: contain;
     background-position: 50% 0%;
}
.reed_text3{
    max-width: 870px;
    margin: 0 auto 50px;
    width: 80%;
    padding: 50px 0 75px;
}
.reed_text3 img{
    margin: auto;
    width: 100%;
}

.box3{
        width: calc(100% / 3);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 50px 0 0;
}
.box3 img{
    width: 100%;
}
.box3:last-child{
    margin: 0;
}
.box4{
        width: calc(100% / 4);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 20px 0 0;
}
.box4 img{
    width: 100%;
}
.box4:last-child{
    margin: 0;
}

.tyukai_box{
    margin: -170px 0 -150px;
}
.tyukai_box4{
    margin: -170px 0 -140px;
}
.or_box{
    border: 2px solid #FF6C00;
    padding: 23px 30px;
    color: #FF6C00;
    line-height: 200%;
    font-weight: bold;
    border-radius: 20px;
}
.or_box p span{
    font-size: 120%;
    text-decoration: underline; /* 下線 */
  text-decoration-thickness: 0.9em; /* 線の太さ */
  text-decoration-color: #fef074; /* 線の色 */
  text-underline-offset: -0.4em; /* 線の位置。テキストに重なるようにやや上部にする */
  text-decoration-skip-ink: none; /* 下線と文字列が重なる部分でも下線が省略されない（線が途切れない） */
}
.u_dot2{
    border-top: #000 dotted 2px;
    border-bottom: #000 dotted 2px;
}
.fukidashi{
        display: flex;
    float: right;
    margin: -138px -100px -200px 0;
    z-index: 9999;
    position: relative;
}
.sankakku::after{
    content: "▼";
    font-size: 50px;
    color: #fff;
    position: absolute;
    margin-top: 80px;
    margin-left: -3%;
}

.sankakku2{
    position: relative;
    display: inline-block;
    width:-webkit-fill-available;
}
.sankakku2::after{
    content: "▼";
    font-size: 50px;
    color: #fff;
    position: absolute;
        margin-top: 25px;
    left: 45%;
}

@media screen and (max-width: 764px){
.top_bg3{
    background-size: contain;
     background-position: 50% 0%;
}
.reed_text3 {
    max-width: 870px;
    margin: 0 auto 20px;
    width: 80%;
    padding: 20px 0;
}
.tyukai_box{
    margin: -50px 0 -49px;
}
.tyukai_box4{
    margin: -50px 0 -45px;
}
.box3 {
    width: calc(100% / 3);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px 0 0;
}
.box4{
        width: calc(100% / 4);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px 0 0;
}    

.tit002{font-size: 18px;}
.fukidashi{
    margin: -60px -15px -60px 0;
    width: 31%;
}
.sankakku::after{
    content: "▼";
    font-size: 30px;
    color: #fff;
    position: absolute;
    margin-top: 45px;
    margin-left: 0%;
}
h3{margin: 0 0 10px;}
    
}



/*ライフデザイン*/
.top_bg4{
    background:url("../img/lifedesign/bg.jpg") no-repeat;
    background-size: contain;
     background-position: 50% 0%;
}
.reed_text4{
    max-width: 870px;
    margin: 0 auto 50px;
    width: 80%;
    padding: 50px 0 75px;
}
.reed_text4 img{
    margin: auto;
    width: 100%;
}
.life_box{
    display: flex;
}
.l_b_img{
    width: 40%;
    margin-right: 30px;
}
.l_b_text{
    width: 60%;
}
.l_b_img2{
    width: 40%;
}
.l_b_text2{
    width: 60%;
    margin-right: 30px;
}
h4.tit003{
    border-bottom: solid 3px #008DE3;
    padding-bottom: 10px;
        max-width: 400px;
}
h4.tit003::after{
    content: url("../img/lifedesign/008.png");
    position: absolute;
        margin: 41px -100px 0;
}

@media screen and (max-width: 764px){
.top_bg4{
    background:url("../img/lifedesign/bg.jpg") no-repeat;
    background-size: contain;
     background-position: 50% 0%;
}
.reed_text4 {
    margin: 0px auto;
    padding: 20px 0 40px;
}
.life_box {
    display: block;
}
.l_b_img,.l_b_text2 {
    width: 100%;
    margin-right: unset;
}

.l_b_text,.l_b_img2 {
    width: 100%;
}

h4.tit003::after {
    margin: 35px -130px 0;
}

}


/*事例集*/
#case_info .tel,
#case_archive .tel{display: none;}
.top_bg5{
    background:url("../img/case/bg.jpg") no-repeat;
        background-size: cover;
    background-position: 50% 60%;
}
.reed_text5{
    max-width: 1100px;
    margin: 0 auto;
    width: 80%;
    padding: 73px 0;
}
.reed_text5 img{
    margin: auto;
    width: 100%;
}
.top_bg6{
    background:url("../img/case/bg2.jpg")repeat-y !important;
}
.cont_box2{
    display: flex;
}
.case_b3{
    width: calc(100% / 3);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 90px 0 0;
    margin-bottom: 50px;
}

.case_b3:nth-child(3n) {
    margin: 0;
}

.case_b2{
    width: calc(100% / 2);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 60px 0 0;
    margin-bottom: 50px;
}
.case_b2:nth-child(2n) {
    margin: 0;
}

.case_tit{
    font-size: 10px;
    background: url("../img/case/001.png") no-repeat;
    background-size: contain;
    height: 50px;
    margin: 0 0 -15px -30px;
    padding-left: 20px;
    line-height: 40px;
}
.c_tit{
    margin: 10px 0;
}
.dit{
    font-size: 12px;
    color: #666;
}

.top_bg7{
    background-size: contain;
}
.reed_text7{
    margin: 0 auto;
    width: 100%;
    padding: 0;
}

.case_img,.case_img2{
    justify-content: center;
    max-width: 870px;
    margin: auto;
}

.case_img3{
    justify-content:start;
    max-width: 1050px;
    margin: auto;
}

.fadeDown img{
    margin: auto;
    display: block;
}

.c_001{background:url("../img/case/bg-c01.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_002{background:url("../img/case/bg-c02.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_003{background:url("../img/case/bg-c03.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_004{background:url("../img/case/bg-c04.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_005{background:url("../img/case/bg-c05.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_006{background:url("../img/case/bg-c06.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_007{background:url("../img/case/bg-c07.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_008{background:url("../img/case/bg-c08.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_009{background:url("../img/case/bg-c09.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_010{background:url("../img/case/bg-c10.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_011{background:url("../img/case/bg-c11-3.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_012{background:url("../img/case/bg-c12-2.jpg") no-repeat;background-size: cover; background-position: 50% 90%;}
.c_013{background:url("../img/case/bg-c13.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}
.c_014{background:url("../img/case/bg-c14.jpg") no-repeat;background-size: cover; background-position: 50% 50%;}

.case_detail{
    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}


.c_tit2{
    padding: 50px 0;
}
.fadeDown img.c_tit2{
        width: 230px;
    }

@media screen and (max-width: 1100px){
        .case_img{
        justify-content: start;
    width: auto;
    margin-left: 30px;
}
    .fadeDown img {
    width: 100%;
}

.c_tit2{
    padding: 30px 0 30px 30px;
    width: 190px !important;
}

}


@media screen and (max-width: 764px){
    .case_img{
        justify-content: start;
    width: 500px;
    margin-left: 50px;
}
        .case_img2{
        justify-content:center;
    width: 100%;
}
    .case_img img{
        width: 100%;
    }
    .case_img2 img{
        width: 50%;
    }
	.fadeDown img.c_tit2{
        width: 300px;
    }
    .cont_box2{
    display: block;
        margin-bottom: 30px;
}
    .case_b3 {
    width: calc(100% / 1);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 0px 0 0;
    margin-bottom: 30px;
}
    .case_tit{
    font-size: 10px;
    height: 50px;
    margin: 0 0 -15px -10px;
    padding-left: 20px;
    line-height: 40px;
}
.c_tit{
    margin: 5px 0;
}
    
.c_tit2{
    padding: 30px 0 30px 30px;
    width: 150px !important;
}
    
}


@media screen and (max-width: 764px){
        .case_img{
        justify-content: start;
    width: auto;
    margin-left: 30px;
}
        .case_img2{
        justify-content:center;
    width: 100%;
}
    .case_img img{
        width: 100%;
    }
    .case_img2 img{
        width: 50%;
    }
    
}



/**コンサル**/
.top_bg8{
    background:url("../img/consulting/bg.jpg") no-repeat;
        background-size: cover;
    background-position: 50% 35%;
}
.top_bg8 img{
   max-width: 870px;
    margin: 0 auto 50px;
    width: 100%;
    padding: 50px 0 75px
}
h4.tit004,h4.tit005{
    border-bottom: solid 3px #1F7C3B;
    padding-bottom: 30px;
    max-width: 100%;
    color: #1F7C3B;
    margin: 0px 0 70px;
    font-size: 22px;
}
h4.tit004::before{
    content: url("../img/consulting/009.png");
    position: absolute;
    margin: 92px 0px 0 200px;
}
h4.tit005::before{
    content: url("../img/consulting/009.png");
    position: absolute;
    margin: 59px 0px 0 200px;
}

.cstg_box{
    display: flex;
    margin-bottom: 100px;
}
.cstg_box_shiro{
    display: flex;
}
.tate_b{
    width: 15%;
    border-left: 1px solid #1F7C3B;
    border-top: 1px solid #1F7C3B;
    background-image : linear-gradient(to bottom, #1F7C3B 5px, transparent 5px);
 background-size: 5px 20px;
 background-repeat: repeat-y; 
 background-position: top;
}
.tate_shiro{
    width: 15%;
    background-image : linear-gradient(to bottom, #fff 5px, transparent 5px);
 background-size: 5px 20px;
 background-repeat: repeat-y; 
 background-position: top;
}

/*.tate_b::after {
    background: radial-gradient(circle farthest-side, #000, #000 30%, transparent 30%, transparent);
    background-size: 20px;
    content: '';
    display: inline-block;
    height: 20px;
    width: 100%;
    transform: rotate(90deg);
}*/

.tate_b::before{
    content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 30px solid transparent;
  border-left: 30px solid transparent;
  border-bottom: 30px solid #1f7c3b;
  border-top: 0;
  transform: rotate(315deg);
        display: block;
    top: -5px;
    left: -20px;
    position: relative;
}
.tate_b p{
        writing-mode: vertical-rl;
    margin: -30px auto 0;
    color: #1F7C3B;
    font-size: 24px;
    font-weight: bold;
    padding-top: 50px;
    background: #fff;
 /*background-image : linear-gradient(to bottom, #1F7C3B 5px, transparent 5px);
 background-size: 5px 20px;
 background-repeat: repeat-y; 
 background-position: top;
height:100%;*/
}


.tate_b p span{
    background-color: #fff;
    padding-bottom: 15px;
	text-orientation: upright;
}



.tate2_b{
    width: 85%;
    border-left: 1px solid #1F7C3B;
    border-top: 1px solid #1F7C3B;
    border-right: 1px solid #1F7C3B;
}
.tate2_shiro{
    width: 85%;
}
.tate2_b p{
    padding: 50px;
    line-height: 200%;
}
.tate2_shiro p{
    padding: 0 50px;
    line-height: 200%;
    color: #fff;
}

.c_img{
    padding: 0 50px;
}

.box2{
    width: calc(100% / 2);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
}
.box2 img{
    width: -webkit-fill-available;
    border: solid 10px #e0e0e0;
    margin: 10px;
}
.bg_con01{
    background:url("../img/consulting/bg2.jpg") no-repeat !important;
        background-size: cover !important;
}
.bg_con02{
    background:url("../img/consulting/bg3.jpg") no-repeat 50% 40% !important;
        background-size: cover !important;
}
.bg_con03{
    background:url("../img/consulting/bg4.jpg") no-repeat 50% 70% !important;
        background-size: cover !important;
}
.bg_con04{
    background:url("../img/consulting/bg5.jpg") no-repeat 50% 70% !important;
        background-size: cover !important;
}
.bg_con05{
    background:url("../img/consulting/bg6.jpg") no-repeat 50% 50% !important;
        background-size: cover !important;
}

ul.cstg_list{
    list-style: none;
    padding: 0;
    margin: 0 !important;
}
ul.cstg_list li{
    margin-bottom: 40px;
    line-height: 200%;
    margin-left: 36px;
    text-indent: -36px;
}
ul.cstg_list li:last-child{
    margin-bottom: 0px;
}
ul.cstg_list li::before{
    content: "";
    width: 10px;
    height: 10px;
    border: solid 8px #1F7C3A;
    margin-right: 10px;
    display: inline-flex;
}

ul.flex li{
    width: calc(83% / 4);
}


@media screen and (max-width: 764px){
.top_bg8 img {
     margin: 0 auto;
     padding: 20px 0 50px;
}

h4.tit004, h4.tit005 {
    padding-bottom: 20px;
    margin: 0px 0 40px;
    font-size: 18px;
    }
h4.tit004::before {
    margin: 97px 0px 0 80px;
}
h4.tit005::before {
    margin: 69px 0px 0 80px;
}
ul.cstg_list li {
    margin-bottom: 20px;
    }
.cstg_box {
    display: flex;
    margin-bottom: 30px;
}
.tate_b::before {
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #1f7c3b;
    top: -3px;
    left: -10px;
}
.tate_b p {
    margin: -15px auto 0;
    font-size: 16px;
    padding-top: 20px;
}
.tate_b {
    width: 10%;
    background-image: linear-gradient(to bottom, #1F7C3B 2px, transparent 2px);
    background-size: 2px 10px;
}
.tate2_b {width: 90%;}
.tate2_shiro{width: 90%;}
.tate2_b p{padding: 20px;}
.tate2_shiro p{padding: 0 20px;}
    
.c_img{
    padding: 0 20px;
}

.box2{
    width: calc(100% / 2);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
}
.box2 img{
    width: -webkit-fill-available;
    border: solid 3px #e0e0e0;
    margin: 5px;
}
.tate_shiro {
    width: 10%;
    background-image: linear-gradient(to bottom, #fff 2px, transparent 2px);
    background-size: 2px 10px;
    }

ul.flex li {
    width: calc(78% / 2);
}
.case_b2{
    width: calc(100% / 1);
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    margin: 0 0px 0 0;
    margin-bottom: 30px;
}
    
}


/***つなげる***/

@media screen and (max-width: 764px){

/*.k000{
width: 150%;
    left: -25%;
    position: absolute;
}*/

}