@charset "utf-8";




@media print, screen and (min-width: 781px) {
  .heading-type1 .image{
    background-image: url("../img/img_main.jpg");
  }
}
@media screen and (max-width: 780px) {
  .heading-type1 .image{
    background-image: url("../img/img_main_sp.jpg");
  }
}



.outline-sec-head-wrap{
  margin: 0 auto;
  width: 90%;
  max-width: 700px;
}
.outline-sec-head p{
  color: #FFF;
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.02em;
  text-align: center;
  margin: 0 auto;
}
.outline-sec:nth-child(odd) .outline-sec-head p{
  background-color: #73AAD1;
}
.outline-sec:nth-child(even) .outline-sec-head p{
  background-color: #73CFCB;
}
.outline-sec-head h2{
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  text-align: center;
}
@media print, screen and (min-width: 781px) {
  .outline-sec-head p{
    padding: 30px 10px;
    max-width: 240px;
  }
  .outline-sec-head h2{
    font-size: 2.8rem;
    margin-top: 50px;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 780px) {
  .outline-sec-head p{
    font-size: 1.0rem;
    padding: 20px 10px;
    width: 80%;
    max-width: 172px;
  }
  .outline-sec-head h2{
    font-size: 2.0rem;
    margin-top: 50px;
    margin-bottom: 15px;
  }
}


.outline-sec-contents-wrap{
  position: relative;
}
.outline-sec-contents-wrap:before{
  background-color: #F4F4F4;
  content: "";
  display: block;
  width: calc(100% - 80px);
  position: absolute;
  top: 80px;
  bottom: 0;
  z-index: -1;
}
.outline-sec:nth-child(odd) .outline-sec-contents-inner{
  background-color: #DCEAF4;
}
.outline-sec:nth-child(even) .outline-sec-contents-inner{
  background-color: #DCF3F2;
}

@media print, screen and (min-width: 781px) {
  .outline-sec{
    padding-top: 160px;
  }
  .outline-sec:first-child{
    padding-top: 100px;
  }
  .outline-sec-contents-wrap{
    padding-bottom: 80px;
    margin-top: 140px;
  }
  .outline-sec-contents-inner{
  }
  .outline-sec:nth-child(odd) .outline-sec-contents-wrap:before{
    left: 80px;
  }
  .outline-sec:nth-child(even) .outline-sec-contents-wrap:before{
    right: 80px;
  }
  .outline-sec-contents-inner{
  }
  .outline-sec:nth-child(odd) .outline-sec-contents-inner{
    padding-left: 80px;
    margin-right: 80px;
  }
  .outline-sec:nth-child(even) .outline-sec-contents-inner{
    padding-right: 80px;
    margin-left: 80px;
  }
  .outline-sec-contents{
    margin: 0 auto;
    max-width: 1400px;
  }
}
@media screen and (max-width: 780px) {
  .outline-sec{
    padding-top: 75px;
  }
  .outline-sec:first-child{
    padding-top: 65px;
  }
  .outline-sec-contents-wrap{
    margin-top: 100px;
  }
  .outline-sec-contents-inner{
  }
  .outline-sec-contents-wrap:before{
    display: none;
  }
}



@media print, screen and (min-width: 781px) {
  .col2{
    display: flex;
  }
  .outline-sec:nth-child(odd) .col2 > .left-wrap{
    width: 42.3%;
  }
  .outline-sec:nth-child(odd) .col2 > .right-wrap{
    width: 57.7%;
  }
  .outline-sec:nth-child(even) .col2 > .left-wrap{
    width: 57.7%;
  }
  .outline-sec:nth-child(even) .col2 > .right-wrap{
    width: 42.3%;
  }
}
@media screen and (max-width: 780px) {
  .col2{
    padding-bottom: 1px;
  }
}



@media print, screen and (min-width: 781px) {
}
@media screen and (max-width: 780px) {
}



.outline-sec .item .ttl{
  text-align: center;
}
.outline-sec .item .ttl > p{
  border-bottom: 1px solid #707070;
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  margin: 0 auto;
}
.outline-sec .item .ttl > h3{
  font-family: 'Zen Old Mincho', serif;
  font-weight: 400;
  line-height: 1.6;
  min-height: 3em;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.outline-sec .item .ttl > h3 > span{
  display: block;
}
.outline-sec:nth-child(odd) .item{
  background-color: #DCEAF4;
}
.outline-sec:nth-child(even) .item{
  background-color: #DCF3F2;
}
.outline-sec .swiper-button-prev,
.outline-sec .swiper-button-next{
  top: 400px;
  height: 40px;
  width: 40px;
}
.outline-sec .swiper-button-prev:after,
.outline-sec .swiper-button-next:after{
  display: none;
}
.outline-sec .swiper-button-prev{
  background-image: url("../../common/img/ic_prev.svg");
  left: -40px;
}
.outline-sec .swiper-button-next{
  background-image: url("../../common/img/ic_next.svg");
  right: -40px;
}
@media print, screen and (min-width: 781px) {
  .outline-sec .slide{
    padding-top: 90px;
    margin: 0 auto;
    width: 90%;
    max-width: 468px;
  }
  .outline-sec .item .ttl > p{
    font-size: 1.2rem;
    padding-bottom: 15px;
    max-width: 340px;
  }
  .outline-sec .item .ttl > h3{
    font-size: 2.8rem;
    margin-top: 20px;
  }
  .outline-sec .item .ttl > h3 > span{
    font-size: 1.8rem;
  }
  .outline-sec .item > p{
    margin: 35px auto 0;
    width: 90%;
    max-width: 445px;
  }
}
@media screen and (max-width: 780px) {
  .outline-sec .swiper-button-prev,
  .outline-sec .swiper-button-next{
    background-size: 30px auto;
    top: 300px;
    height: 30px;
    width: 30px;
  }
  .outline-sec .swiper-button-prev{
    left: -30px;
  }
  .outline-sec .swiper-button-next{
    right: -30px;
  }
  
  .outline-sec .slide{
    padding-top: 75px;
    margin: 0 auto;
    width: 80%;
  }
  .outline-sec .item .ttl > p{
    font-size: 1.2rem;
    padding-bottom: 15px;
    max-width: 340px;
  }
  .outline-sec .item .ttl > h3{
    font-size: 2.8rem;
    margin-top: 20px;
  }
  .outline-sec .item .ttl > h3 > span{
    font-size: 1.8rem;
  }
  .outline-sec .item > p{
    margin: 35px auto 0;
    width: 90%;
    max-width: 445px;
  }
}


.thumbnail .swiper-wrapper{
  display: block;
}
.thumbnail .swiper-slide{
  background-image: url("../../common/img/ic_arrow.svg");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 4px auto;
  background-color: #FFF;
  cursor: pointer;
  line-height: 1;
  margin-top: 5px;
  width: 100%;
  transition: .2s;
}
.outline-sec .thumbnail .swiper-slide-thumb-active{
  background-image: url("../../common/img/ic_arrow_w.svg");
  color: #FFF;
}
.outline-sec:nth-child(odd) .thumbnail .swiper-slide-thumb-active{
  background-color: #61ACD5;
}
.outline-sec:nth-child(even) .thumbnail .swiper-slide-thumb-active{
  background-color: #73CFCB;
}
.outline2-1-thumb .swiper-wrapper{
  column-count: 2;
}
.outline2-1-thumb .swiper-slide{
  width: 100% !important;
}
.outline2-1-thumb .swiper-slide:first-child{
  margin-top: 0;
}
@media print, screen and (min-width: 781px) {
  .thumbnail{
    margin: 40px auto 0;
    width: 90%;
    max-width: 445px;
  }
  .thumbnail .swiper-slide{
    font-size: 1.4rem;
    padding: 10px 20px;
  }
}
@media screen and (max-width: 780px) {
  .thumbnail{
    margin: 40px auto 0;
    width: 90%;
  }
  .thumbnail .swiper-slide{
    font-size: 1.2rem;
    padding: 10px 10px;
  }
}





.outline2-1{
  position: relative;
}
.outline2-1 .swiper-slide figure{
  margin-top: 65px;
}
.outline2-2{
  display: flex;
  position: relative;
}
.outline2-2:before{
  background: url("../img/img_area.png") no-repeat;
  background-size: cover;
  content: "";
  display: block;
  padding-bottom: 92.948%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.outline2-1 .swiper-slide,
.outline2-2 .swiper-slide{
  opacity: 0 !important;
  transition: .3s;
}
.outline2-2 .swiper-slide{
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-bottom: 92.948%;
}
.outline2-1 .swiper-slide-visible,
.outline2-2 .swiper-slide-visible{
  opacity: 1 !important;
}
.outline2-2 .image1{
  background-image: url("../img/img_area1.png");
}
.outline2-2 .image2{
  background-image: url("../img/img_area2.png");
}
.outline2-2 .image3{
  background-image: url("../img/img_area3.png");
}
.outline2-2 .image4{
  background-image: url("../img/img_area4.png");
}
.outline2-2 .image5{
  background-image: url("../img/img_area5.png");
}
.outline2-2 .image6{
  background-image: url("../img/img_area6.png");
}
.outline2-2 .image7{
  background-image: url("../img/img_area7.png");
}
.outline2-2 .image8{
  background-image: url("../img/img_area8.png");
}
.outline2-2 .image9{
  background-image: url("../img/img_area9.png");
}





.outline3-1{
  position: relative;
}
.outline3-1 .swiper-slide figure{
  margin-top: 55px;
}
.outline3-2{
  display: flex;
  position: relative;
}
.outline3-2:before{
  background: url("../img/img_express.png") no-repeat;
  background-size: cover;
  content: "";
  display: block;
  padding-bottom: 92.735%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.outline3-1 .swiper-slide,
.outline3-2 .swiper-slide{
  opacity: 0 !important;
  transition: .3s;
}
.outline3-2 .swiper-slide{
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-bottom: 92.735%;
}
.outline3-1 .swiper-slide-visible,
.outline3-2 .swiper-slide-visible{
  opacity: 1 !important;
}
.outline3-2 .image1{
  background-image: url("../img/img_express1.png");
}
.outline3-2 .image2{
  background-image: url("../img/img_express2.png");
}
.outline3-2 .image3{
  background-image: url("../img/img_express3.png");
}
.outline3-2 .image4{
  background-image: url("../img/img_express4.png");
}





.outline4-1{
  position: relative;
}
.outline4-2{
  display: flex;
}
.outline4-2 .swiper-slide{
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-bottom: 128.3%;
}
.outline4-2 .image1{
  background-image: url("../img/img_outline4_1.jpg");
}
.outline4-2 .image2{
  background-image: url("../img/img_outline4_2.jpg");
}
.outline4-2 .image3{
  background-image: url("../img/img_outline4_3.jpg");
}
.outline4-2 .image4{
  background-image: url("../img/img_outline4_4.jpg");
}
@media print, screen and (min-width: 781px) {
  #outline-sec2 .right-wrap{
    padding-bottom: 60px;
  }
}
@media screen and (max-width: 780px) {
  .outline2-1 .swiper-slide figure{
    margin-left: -13%;
    margin-right: -13%;
    margin-top: 25px;
  }
  .outline2-2{
    margin-top: 25px;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
  }
  #outline-sec2 .thumbnail,
  #outline-sec4 .thumbnail{
    margin-bottom: 50px;
  }
}
