@charset "UTF-8";
/* CSS Document */
/*common_______*/
.in {
  width: 90%;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin: 2rem auto;
  align-items: stretch;
}
h3 {
  font-size: 2rem;
  text-align: center;
  margin: 0 auto;
}
.left_area, .right_area {
  display: block;
  width: 100%;
  margin: 2rem auto;
  padding: 0;
  box-sizing: border-box;
  text-align: center;
}
ul.txt_list li {
  width: 100%;
  display: inline-block;
  padding: 1.6rem 1rem;
  vertical-align: middle;
  box-sizing: border-box;
}
ul.txt_list {
  width: 100%;
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  height: 98%;
}
ul.photo {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}
ul.photo li {
  width: 49%;
}
ul.photo li img {
  width: 100%;
  height: auto;
}
/*sec01_sp______*/

.sec01 {
    background: url(../image/mv_bg_sp@2x.png) no-repeat;
    background-position: 90% 0;
    background-size: 100%;
    height: 40vh;
    position: relative;
}
.sec01 .tel_img {
  display: none;
}
.sec01 .txt_img {
  position: absolute;
  bottom: 3vh;
  margin: 0;
  padding: 0;
}
.sec01 .txt_img img {
  width: 98%;
  margin-right: 2%;
  height: auto;
}
/*sec02_sp______*/
.sec02 {
  display: block;
  width: 100%;
  margin: 0 0;
  background: url("../image/sec02_bg.jpg") center bottom no-repeat;
}
.sec02 .in{
    margin: 0 auto;
}
.sec02 .left_area {
      margin-top: 0;
  text-align: center;
  box-sizing: border-box;
  z-index: 10;
}
.sec02 .right_area {
  padding: 0 0 2rem;
  align-self: center;
  height: auto;
}
.sec02 .left_area img {
  width: 90%;
  height: auto;
  margin: 0 auto;
  max-width: 385px;
}
.sec02 .btn_blue {
  display: inline-block;
}
/*sec03_______*/

.sec03 ul.txt_list li {
  background: #F7F8F8;
  padding: 2rem 1rem 2rem 2rem;
}
.sec03 ul.txt_list li:nth-child(2n) {
  background: #FFF;
}
/*sec04__sp_____*/
.sec04 {}
.flow_area {
  width: 100%;
  background: linear-gradient(to right, #fff 0, #fff 30%, #F7F8F8 30%, #F7F8F8 100%);
  padding: 2rem 0;
}
.flow_area ul li {
  width: 100%;
  background: url(../image/flow_base_sp.svg) center top no-repeat;
}
.flow_area ul li img, .flow_area ul li span {
  display: inline-block;
  vertical-align: middle;
  /* letter-spacing: 0.2rem;*/
}
.flow_area ul li h3 {
  width: 100%;
  text-align: center;
  padding: 2.8rem 0 0;
}
.flow_area ul li img {
  padding: 0 1rem 0 0;
}
.flow_area p {
  width: 80%;
  text-align: center;
  min-height: 8rem;
  margin: 1rem auto 0;
  font-size: 1.4rem;
  line-height: 1.2;
}
/*sec05__sp_____*/
.sec05 ul.txt_list li {
  font-weight: bold;
  line-height: 2;
  position: relative;
}
.sec05 ul.txt_list li:nth-child(1)::after {
  content: '';
  position: absolute;
  top: 0;
  right: 10%;
  width: 94px;
  height: 88px;
  background: url("../image/sec05_img01@2x.png") top right/94px no-repeat;
}
.sec05 ul.txt_list li:nth-child(4) {
        min-height: 215px;
}
.sec05 ul.txt_list li span {
  font-weight: normal;
  font-size: small;
}
.sec05 ul.txt_list li:nth-child(4)::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 120px;
  background: url(../image/sec05_img02@2x.png) top right/100% no-repeat;
}
/*sec06__sp_____*/
.sec06 {
  width: 100%;
  height: auto;
  position: relative;
}
.sec06 h3 {
  font-size: 2rem;
  width: 100%;
  background: #004996;
  color: #fff;
  font-weight: normal;
  text-align: center;
  padding: 0.5rem 0;
  margin-top: 4rem;
}
.sec06 .goyoubou {
  display: block;
  padding: 2rem 0 0 130px;
  text-align: left;
  line-height: 1.6;
  position: relative;
  width: 96%;
  margin: 1rem auto;
  box-sizing: border-box;
  /* padding: 2rem 0 0 130px; */
  min-height: 130px;
}
.sec06 .goyoubou::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0%;
  width: 130px;
  height: 130px;
  background: url("../image/sec06_icon@2x.png") center left/130px no-repeat;
}
.sec06 .in {
  width: 100%;
  height: auto;
}
.sec06 .left_area, .sec06 .right_area {
  margin: 0 auto;
}
.sec06 .left_area img, .sec06 .right_area img {
  width: 100%;
  height: auto;
}
.sec06 .bars {
  width: 100%;
  position: absolute;
  top: 250px;
  display: flex;
  flex-flow: wrap;
  height: 138vw;
  align-items: stretch;
}
ul.y_bar {
  display: flex;
  /* top: 18%; */
  /* left: 5%; */
  width: 100%;
  justify-content: space-around;
  height: 6rem;
}
ul.b_bar {
  display: flex;
  /* left: 10%; */
  /* top: 36%; */
  width: 100%;
  justify-content: space-evenly;
}
.y_bar li, .b_bar li {
  display: block;
  border-radius: 5vw;
  height: 10vw;
  text-align: center;
  font-size: 5vw;
  letter-spacing: 0.1rem;
  line-height: 2;
  font-weight: bold;
  box-sizing: border-box;
  background: #fff;
}
.y_bar li {
  border: #FACC60 2px solid;
  width: 12rem;
}
.y_bar li:nth-child(2) {
  align-self: flex-start;
}
.y_bar li:nth-child(1), .y_bar li:nth-child(3) {
  align-self: flex-end;
}
.b_bar li {
  border: #609BFA 2px solid;
  width: 14rem;
}
.sec06 .genchi {
  display: block;
  text-align: left;
  margin: 2rem auto;
  line-height: 1.6;
  position: relative;
  width: 90%;
}
.sekou {
  position: relative;
  margin: 0 auto;
  width: 90%;
}
.sekou img {
  width: 100%;
  height: auto;
}
.loupe {
  position: absolute;
  right: 0;
  bottom: 10px;
  width: 40px;
  height: 40px;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4px;
}
.loupe img {
  width: 38px;
  height: 38px;
  display: table-cell;
  vertical-align: middle;
  color: #fff;
  margin: 4px;
}
.sec06 .naiyou {
  padding: 0 2rem 1rem 2rem;
  background: #D3E3ED;
  text-align: center;
  box-sizing: border-box;
  margin: 0 auto;
  width: 90%;
}
.sec06 .naiyou h4 {
  display: inline-block;
  background: #fff;
  padding: 1rem 2rem;
  margin-bottom: 2rem;
}
.sec06 .naiyou ul {
  margin-left: 2rem;
}
.sec06 .naiyou ul li {
  list-style: disc;
  margin-bottom: 0.5rem;
}
.sec06 .work {
  margin: 2rem auto;
  width: 90%;
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
}
.sec06 .work li {
  width: 48%;
  line-height: 1.4;
    margin-bottom: 1rem;
}
.sec06 .work li img {
  width: 100%;
  height: auto;
}
/*sec07__sp_____*/
.sec07 .torikumi {
  background: url(../image/sec07_bg@2x.png);
  background-size: cover;
  background-position: 38% 0;
  padding: 3rem 0 0rem;
  width: 100%;
  max-width: 680px;
  margin: 5rem auto 0;
}
.sec07 h3 {
  font-size: 2rem;
  width: 22rem;
  text-align: center;
  margin: -5rem auto;
  padding: 0.5rem 2rem;
  background: #fff;
  letter-spacing: 0.4rem;
}
.sec07 ul {
  width: 69%;
  padding-bottom: 3rem;
  margin: 21% 0 9% 30%;
}
.sec07 ul li {
  margin: 1rem 0;
}
.sec07 table {
  margin: 4rem auto;
  width: 100%;
  max-width: 680px;
}
.sec07 th {
  padding: 3rem 0 2rem;
  width: 10rem;
  border-bottom: 2px solid #707070;
}
.sec07 td {
  padding: 3rem 0 2rem;
  width: auto;
  border-bottom: 1px solid #CCCCCC;
}
  .sec07 .gmap {
    width: 100%;
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
  }
  .sec07 .gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}


@media screen and (min-width:768px) {
  /*common_______*/
  .in {
    width: 90%;
    display: flex;
    max-width: 1000px;
    margin: 2rem auto;
    justify-content: center;
    align-items: stretch;
  }
  .photo li img {
    width: 100%;
  }
  ul.txt_list li {
    width: 100%;
    display: inline-block;
    padding: 1rem 1rem 1rem 0rem;
    vertical-align: middle;
    box-sizing: border-box;
  }
  ul.txt_list {
    width: 96%;
  }
  /*sec01_______*/
  .sec01 {
    text-align: left;
    background: url(../image/mv_bg@2x.png);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    padding: 0;
    width: 100%;
    max-width: 1000px;
    height: 480px;
    margin: 0 auto 0;
    box-sizing: border-box;
  }
  .sec01 .tel_img {
    position: absolute;
    bottom: 210px;
    display: block;
    width: 318px;
    padding: 2rem 24px;
    margin: 0 0 30px;
    background: rgba(255,255,255,0.5);
    backdrop-filter: blur(12px);
    box-sizing: border-box;
  }
  .sec01 .tel_img p {
    line-height: 2.6;
    font-weight: bold;
    color: #004996;
    text-decoration-line: underline;
  }
  .sec01 .txt_img {
    width: 48%;
    position: absolute;
    bottom: 0px;
    display: block;
    margin: 30px 0;
  }
  /*sec02_______*/
  .sec02 {
    display: block;
    width: auto;
    background: url("../image/sec02_bg@2x.jpg") center bottom no-repeat;
    background-size: 200%;
  }
  .sec02 .left_area {
    margin-top: 0;
    padding: 2%;
  }
  .sec02 .right_area {
    padding: 1rem 0;
    align-self: center;
    height: auto;
  }
  .sec02 .btn_blue {
    display: inline-block;
  }
  /*sec04_______*/
  .flow_area {
    width: 100%;
    background: linear-gradient(#fff 0, #fff 30%, #F7F8F8 30%, #F7F8F8 100%);
  }
  .flow_area ul {
    width: 100%;
    max-width: 1000px;
    display: flex;
    justify-content: space-between;
    margin: 2rem auto;
  }
  .flow_area ul li {
    width: 20%;
    background: none;
  }
  .flow_area ul li h3 {
    max-width: 190px;
    text-align: left;
    background: url(../image/flow_base.svg) no-repeat;
    background-size: 100%;
    padding: 0 0 0 2rem;
    box-sizing: border-box;
  }
  .flow_area ul li img {
    padding: 32px 1rem 50px 0;
    height: 4rem;
  }
  .flow_area ul li span {
    font-size: 2vw;
  }
  .flow_area p {
    margin: 1rem 0 0 2rem;
    font-size: 1.4rem;
    line-height: 1.4;
    text-align: left;
  }
  /*sec05_______*/
  
  .sec05 ul.txt_list li:nth-child(4) {
        min-height: 120px;
}
  .sec05 ul.txt_list li:nth-child(4)::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 500px;
    height: 114px;
    background: url("../image/sec05_img02@2x.png") top right/250px no-repeat;
  }
  
  /*sec06_______*/
  .sec06, .sec06 .in, .sec06 h3 {
    max-widthwidth: 1000px;
    height: auto;
  }
  .sec06 .goyoubou {
    width: 64%;
    padding: 5rem 0 0 130px;
  }
  .sec06 .in {
    align-items: stretch;
    justify-content: space-between;
  }
  .sec06 .left_area img, .sec06 .right_area img {
    width: 98%;
    height: auto;
  }
  .sec06 .bars {
    width: 100%;
    position: relative;
    display: flex;
    flex-flow: column;
    height: auto;
    justify-content: space-around;
    top: 0;
  }
  ul.y_bar {
    position: relative;
    display: flex;
    width: 40%;
    min-width: 384px;
    margin: 0rem auto;
    justify-content: space-between;
    height: auto;
    left: 0;
  }
  ul.b_bar {
    position: relative;
    display: flex;
    width: 34%;
    min-width: 350px;
    margin: 2rem auto;
    justify-content: space-around;
    left: 0;
  }
  .y_bar li, .b_bar li {
    display: block;
    border-radius: 2rem;
    height: 4rem;
    text-align: center;
    font-size: 2rem;
    letter-spacing: 0.1rem;
    line-height: 2;
    font-weight: bold;
    box-sizing: border-box;
    background: #fff;
  }
  .y_bar li {
    width: 12rem;
  }
  .b_bar li {
    width: 16rem;
  }
  .sec06 .genchi {
    margin: 4rem auto;
  }
  /*  .sec06 .sekou {
    position: relative;
    width: 648px;
    height: 280px;
  }
  .sec06 .naiyou {
    position: relative;
    width: 330px;
    padding: 0 2rem 1rem 2rem;
    background: #D3E3ED;
    text-align: center;
    box-sizing: border-box;
    margin: 0;
  }*/
  .sec06 .naiyou h4 {
    display: inline-block;
    background: #fff;
    padding: 0 2rem 1rem;
    margin-bottom: 2rem;
  }
  .loupe {
    bottom: 0;
  }
  .sec06 .work {
    margin: 2rem auto;
    margin: 0 auto;
    width: 90%;
    display: flex;
    justify-content: space-between;
  }
  .sec06 .work li {
    width: 22%;
  }
  /*sec07_______*/
  .sec07 .torikumi {
    background: url("../image/sec07_bg@2x.png") no-repeat center 20px/100% auto;
    padding: 3rem 0 2rem;
    width: 100%;
    max-width: 680px;
  }
  .sec07 h3 {
    font-size: 2.4rem;
    width: 22rem;
    text-align: center;
    margin: -4rem auto;
    padding: 1rem 2rem;
    background: #fff;
  }
  .sec07 ul {
    width: 48%;
    margin: 10% 0 5% 50%;
  }
  .sec07 ul li {
    margin: 2rem 0;
  }
}
@media screen and (min-width:1000px) {
  .in {
    width: 100%;
  }
  .sec02 {
    display: block;
    width: auto;
    margin: 0 -50%;
    background: url(../image/sec02_bg@2x.jpg) center bottom/100% 100% no-repeat;
  }
  .left_area, .right_area {
    display: block;
    width: 50%;
    box-sizing: border-box;
  }
  .flow_area ul li {
    width: 190px;
    background: none;
  }
 /* .flow_area ul li h3 {
    width: 190px;
    text-align: left;
    background: url("../image/flow_base.svg") no-repeat;
    padding: 0 0 0 2rem;
  }
  .flow_area ul li img {
    padding: 4.5rem 0.5rem 4.5rem 0rem;
    height: 2vw
  }*/
  .flow_area ul li span {
    font-size: 1.8rem;
  }
  .sec06 .sekou {
    position: relative;
    width: 648px;
    height: 280px;
    margin: 0;
  }
  .sec06 .naiyou {
    position: relative;
    width: 330px;
    padding: 0 2rem 1rem 2rem;
    background: #D3E3ED;
    text-align: center;
    box-sizing: border-box;
    margin: 0;
  }
  .sec06 .work {
    width: 100%;
}
}