/*
###################################################################################################################################

visual

###################################################################################################################################
*/
@media (min-width:768px), print {
  /*visual pc ------------------------------------------------------------------------------------*/
  #visual {
    padding: 177px 0;
    background-image: url(../../images/about/mv_about_01_pc.png);
  }
  #visual .subttl {
    margin-bottom: 50px;
  }
}
@media (max-width: 767px) {
  /*visual sp ------------------------------------------------------------------------------------*/
  #visual {
    background-image: url(../../images/about/mv_about_01_sp.png);
  }
  #visual .lead p {
    text-align: center;
  }
}
/*
###################################################################################################################################

common

###################################################################################################################################
*/
#contents .cntttl {
  text-align: center;
  letter-spacing: 0.08em;
  font-weight: 300;
}
@media (min-width:768px), print {
  /*common pc ------------------------------------------------------------------------------------*/
  #sec02 .container, #sec03 .container {
    max-width: 1460px;
  }
  #contents .cntttl {
    font-size: 3.5rem;
    line-height: 1.1;
    margin-bottom: 60px;
  }
  #sec02 .picbox + .picbox, #sec03 .picbox + .picbox {
    margin-top: 100px;
  }
  #sec02 .picbox .pic, #sec03 .picbox .pic {
    flex-basis: 46.5%;
  }
  #sec02 .picbox .txtbox, #sec03 .picbox .txtbox {
    flex-basis: 46.5%;
  }
  #sec02 .picbox .txtbox .inner, #sec03 .picbox .txtbox .inner {
    margin-right: 19%;
  }
  #sec02 .picbox.reverse .txtbox .inner, #sec03 .picbox.reverse .txtbox .inner {
    margin-left: 110px;
    margin-right: 0px;
  }
  #sec02 .picbox .txtbox h3, #sec03 .picbox .txtbox h3 {
    font-size: 2.5rem;
    line-height: 1.2;
    margin-bottom: 35px;
  }
  #sec02 .picbox .lead, #sec03 .picbox .lead {
    margin-bottom: 45px;
  }
  #sec02 .picbox .lead .ttl, #sec03 .picbox .lead .ttl {
    font-size: 1.5rem;
  }
  #sec02 .picbox .lead p, #sec03 .picbox .lead p {
    /*font-size: 1.3rem;*/
    line-height: 2.3;
  }
  #sec02 .picbox .lead p + p, #sec03 .picbox .lead p + p {
    margin-top: 35px;
  }
}
@media (min-width: 768px) and (max-width: 1460px) {
  /*tab ------------------------------------------------------------------------------------*/
  #sec02 .container, #sec02 .btn_wrap {}
  #sec02 .container, #sec02 .btn_wrap .btn {
    flex-basis: 48%;
  }
}
@media (max-width: 767px) {
  /*common sp ------------------------------------------------------------------------------------*/
  #sec02 .container, #sec03 .container {}
  #contents .cntttl {
    font-size: 6.2vw;
    margin-bottom: 7.6vw;
  }
  #sec02 .picbox + .picbox, #sec03 .picbox + .picbox {
    margin-top: 9.7vw;
  }
  #sec02 .picbox .pic, #sec03 .picbox .pic {
    margin-bottom: 7.6vw;
    flex-basis: 100%;
  }
  #sec02 .picbox .txtbox, #sec03 .picbox .txtbox {
    flex-basis: 100%;
  }
  #sec02 .picbox .txtbox .inner, #sec03 .picbox .txtbox .inner {}
  #sec02 .picbox.reverse, #sec03 .picbox.reverse {
    flex-flow: wrap-reverse;
  }
  #sec02 .picbox.reverse .txtbox .inner, #sec03 .picbox.reverse .txtbox .inner {}
  #sec02 .picbox .txtbox h3, #sec03 .picbox .txtbox h3 {
    margin-bottom: 9vw;
    font-size: 4.8vw;
  }
  #sec02 .picbox.reverse .lead, #sec03 .picbox.reverse .lead {}
  #sec02 .picbox .lead .ttl, #sec03 .picbox .lead .ttl {
    margin-bottom: 6.9vw;
  }
  #sec02 .picbox .lead p, #sec03 .picbox .lead p {
    font-size: 3vw;
  }
  #sec02 .picbox .lead p + p, #sec03 .picbox .lead p + p {
    margin-top: 6.2vw;
  }
}
/*
###################################################################################################################################

sec01

###################################################################################################################################
*/
#sec01 .lead {}
#sec01 .lead p {}
#sec01 .pic_list {
  justify-content: center;
}
#sec01 .pic_list > li {
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: wrap;
  color: #FFFFFF;
  text-align: center;
  position: relative;
}
#sec01 .pic_list > li + li:before, #sec01 .pic_list > li + li:after {
  content: "";
  position: absolute;
  display: block;
  border-top: 4px solid #fff;
  transform: translateX(-50%);
  margin: auto 0;
  background-color: #8b8b8b;
  bottom: 0px;
  top: 0;
  transition: all 300ms ease-in-out;
}
#sec01 .pic_list > li + li:after {
  transform: rotate(90deg);
}
#sec01 .pic_list > li.no1 {
  background-image: url(../../images/about/bg_about_01.png);
}
#sec01 .pic_list > li.no2 {
  background-image: url(../../images/about/bg_about_02.png);
}
#sec01 .list {
  justify-content: center;
}
#sec01 .list > li {
  position: relative;
  border: 1px solid #B6B6B6;
}
#sec01 .list > li + li:before, #sec01 .list > li + li:after {
  content: "";
  position: absolute;
  display: block;
  border-top: 2px solid #fff;
  transform: translateX(-50%);
  margin: auto 0;
  background-color: #8b8b8b;
  bottom: 0px;
  top: 0;
  transition: all 300ms ease-in-out;
}
#sec01 .list > li + li:after {
  transform: rotate(90deg);
}
#sec01 .txtbox {
  text-align: center;
}
@media (min-width:768px), print {
  /*sec01 pc ------------------------------------------------------------------------------------*/
  #sec01 {
    padding: 0 0 85px;
  }
  #sec01 .pic_list {
    margin-top: 50px;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 30px;
  }
  #sec01 .lead p {
    /*font-size: 1.3rem;*/
    line-height: 2.3;
    text-align: center;
  }
  #sec01 .pic_list > li {
    flex-basis: 247px;
    height: 247px;
  }
  #sec01 .pic_list > li + li {
    margin-left: 130px;
  }
  #sec01 .pic_list > li dt {
    font-size: 2rem;
    line-height: 1.5;
    margin-bottom: 15px;
  }
  #sec01 .pic_list > li dd {
    line-height: 2;
  }
  #sec01 .pic_list > li + li:before, #sec01 .pic_list > li + li:after {
    width: 4px;
    height: 50px;
    left: -65px;
  }
  #sec01 .list > li + li:before, #sec01 .list > li + li:after {
    width: 2px;
    height: 22px;
    left: -30px;
  }
  #sec01 .list {
    padding: 20px 0 15px;
  }
  #sec01 .list > li {
    font-size: 1.8rem;
    padding: 3px 0;
    width: 228px;
  }
  #sec01 .list > li + li {
    margin-left: 60px;
  }
  #sec01 .txtbox {
    margin-bottom: 45px;
  }
  #sec01 .txtbox .txt {
    font-size: 2rem;
  }
}
@media (max-width: 767px) {
  /*sec01 sp ------------------------------------------------------------------------------------*/
  #sec01 {
    padding: 6.9vw 0;
  }
  #sec01 .container {}
  #sec01 .lead {
    margin-bottom: 3.4vw;
  }
  #sec01 .lead p {}
  #sec02 .container, #sec03 .container {}
  #sec01 .pic_list > li {
    flex-basis: 37.5vw;
    height: 37.5vw;
  }
  #sec01 .pic_list {
    margin-bottom: 7.6vw;
  }
  #sec01 .pic_list > li + li {
    margin-left: 12.5vw;
  }
  #sec01 .pic_list > li dt {
    margin-bottom: 2vw;
    font-size: 4.1vw;
    letter-spacing: -0.05em;
  }
  #sec01 .pic_list > li dd {
    letter-spacing: -0.02em;
  }
  #sec01 .pic_list > li + li:before, #sec01 .pic_list > li + li:after {
    height: 9vw;
    width: 4px;
    left: -6.2vw;
  }
  #sec01 .list > li + li:before, #sec01 .list > li + li:after {
    height: 3.4vw;
    width: 2px;
    left: -5.5vw;
  }
  #sec01 .list {
    margin: 3.4vw 0;
  }
  #sec01 .list > li {
    padding: 0.6vw 2vw;
    font-size: 3.8vw;
  }
  #sec01 .list > li + li {
    margin-left: 9.7vw;
  }
  #sec01 .txtbox {
    margin-bottom: 7.6vw;
  }
  #sec01 .txtbox .txt {
    font-size: 4.1vw;
  }
}
/*
###################################################################################################################################

sec02

###################################################################################################################################
*/
#sec02 {
  background-color: #F8F6F6;
}
#sec02 .btn {
  text-align: left;
}
#sec02 .btn > a {
  background-color: #FFFFFF;
  min-width: auto;
}
#sec02 .picbox, #sec03 .picbox {
  justify-content: space-between;
}
#sec02 .picbox .txtbox h3, #sec03 .picbox .txtbox h3 {
  letter-spacing: 0.08em;
}
#sec02 .picbox .lead .ttl, #sec03 .picbox .lead .ttl {
  font-weight: 700;
}
@media (min-width:768px), print {
  /*sec02 pc ------------------------------------------------------------------------------------*/
  #sec02 {
    padding: 90px 0;
  }
  #sec02 .btn_wrap .btn + .btn {
    margin-left: 15px;
  }
  #sec02 .btn > a {
    padding: 20px 60px 20px 20px;
  }
}
@media (max-width: 767px) {
  /*sec02 sp ------------------------------------------------------------------------------------*/
  #sec02 {
    padding: 8.3vw 0 12.5vw;
  }
  #sec02 .picbox .btn {
    flex-basis: 100%;
  }
  #sec02 .picbox .btn > a {
    display: block;
  }
  #sec02 .btn_wrap .btn + .btn {
    margin-top: 4.1vw;
  }
  #sec02 .picbox .lead {
    margin-bottom: 6.9vw;
  }
}
/*
###################################################################################################################################

sec03

###################################################################################################################################
*/
@media (min-width:768px), print {
  /*sec03 pc ------------------------------------------------------------------------------------*/
  #sec03 {
    padding: 90px 0;
  }
  #sec03 .picbox .txtbox h3 {
    margin-bottom: 20px;
  }
}
@media (max-width: 767px) {
  /*sec03 sp ------------------------------------------------------------------------------------*/
  #sec03 {
    padding: 8.3vw 0 10.4vw;
  }
  #sec03 .picbox .txtbox h3 {}
}
/*
###################################################################################################################################

sec04

###################################################################################################################################
*/
#sec04 {
  background-color: #F8F6F6;
}
#sec04 .lead p {
  text-align: center;
}
#sec04 .performance_list .ttl {
  background-color: #D0D2D0;
  border-radius: 3px;
  font-weight: 700;
  text-align: center;
}
#sec04 .performance_list .list {
  background-color: #FFFFFF;
}
#sec04 .performance_list .list > li:last-child {
  border-bottom: 1px solid #C9C9C9;
}
#sec04 .performance_list .list > li {
  border-top: 1px solid #C9C9C9;
}
@media (min-width:768px), print {
  /*sec04 pc ------------------------------------------------------------------------------------*/
  #sec04 {
    padding: 75px 0 100px;
  }
  #sec04 .container {
    max-width: 1200px;
  }
  #sec04 .cntttl {
    margin-bottom: 30px;
  }
  #sec04 .lead {
    margin-bottom: 30px;
  }
  #sec04 .lead p {
    /*font-size: 1.3rem;*/
    line-height: 2.3;
  }
  #sec04 .performance_list .box_list {
    flex-basis: 570px;
  }
  #sec04 .performance_list .box_list .box {
    flex-basis: 280px;
  }
  #sec04 .performance_list .ttl, #sec04 .performance_list .list > li {
    padding: 10px;
    font-size: 1.3rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  /*tab ------------------------------------------------------------------------------------*/
  #sec04 .container {
    min-width: 1200px;
  }
}
@media (max-width: 767px) {
  /*sec04 sp ------------------------------------------------------------------------------------*/
  #sec04 {
    padding: 6.9vw 0 10.4vw;
  }
  #sec04 .container {}
  #sec04 .cntttl {}
  #sec04 .lead {
    margin-bottom: 6.2vw;
  }
  #sec04 .lead p {
    text-align: left;
  }
  #sec04 .performance_list .list {
    padding: 2vw 0;
  }
  #sec04 .performance_list .box_list {}
  #sec04 .performance_list .box_list + .box_list {
    margin-top: 11.8vw;
  }
  #sec04 .performance_list .box_list .box {
    flex-basis: 48.5%;
  }
  #sec04 .performance_list .box_list .box:nth-child(2n) .list > li {
    padding: 0 1.3vw;
  }
  #sec04 .performance_list .ttl {
    padding: 1.3vw 0;
    font-size: 3vw;
  }
  #sec04 .performance_list .list > li {
    display: flex;
    padding: 2vw 0;
    align-items: center;
    font-size: 3vw;
  }
}
/*
###################################################################################################################################

sec05

###################################################################################################################################
*/
#sec05 .lead p {
  letter-spacing: 0.03em;
}
#sec05 .cntttl {
  line-height: 1.7;
  text-align: left;
}
#sec05 .name_wrap {
  text-align: right;
}
#sec05 .name {
  font-family: "HG正楷書体-PRO";
  letter-spacing: 0.03em;
}
#sec05 .company_name {
  letter-spacing: 0.03em;
}
@media (min-width:768px), print {
  /*sec05 pc ------------------------------------------------------------------------------------*/
  #sec05 {
    padding: 70px 0 120px;
  }
  #sec05 .container {
    position: relative;
  }
  #sec05 .txtbox {
    margin-right: 350px;
  }
  #sec05 .pic {
    position: absolute;
    right: 0;
    bottom: 60px;
  }
  #sec05 .pic img {
    width: 280px;
    height: auto;
  }
  #sec05 .lead p {
    /*font-size: 1.3rem;*/
    line-height: 2.3;
  }
  #sec05 .lead p + p {
    margin-top: 35px;
  }
  #sec05 .name_wrap {
    margin-top: 30px;
  }
  #sec05 .name {
    font-size: 2.5rem;
  }
}
@media (max-width: 767px) {
  /*sec05 sp ------------------------------------------------------------------------------------*/
  #sec05 {
    padding: 11.8vw 0 9.7vw;
  }
  #sec05 .pic_list {
    flex-flow: wrap-reverse;
  }
  #sec05 .txtbox {}
  #sec05 .pic {
    margin: 0 16vw 7.6vw;
  }
  #sec05 .lead p {
    font-size: 3vw;
  }
  #sec05 .lead p + p {
    margin-top: 6.2vw;
  }
  #sec05 .name_wrap {
    margin-top: 4.8vw;
  }
  #sec05 .company_name {
    font-size: 2.7vw;
  }
  #sec05 .name {
    font-size: 4.8vw;
  }
}
/*
###################################################################################################################################

sec06

###################################################################################################################################
*/
#sec06 {
  background: linear-gradient(to top right, #f5f9ff, #dadbf5);
}
#sec06 .ttl {
  color: #000;
  text-align: center;
  font-weight: 300;
}
#sec06 .cntttl {
  font-weight: 300;
  text-align: center;
  color: #000;
}
#sec06 .lead p {
  text-align: center;
  color: #000;
}
@media (min-width:768px), print {
  /*sec06 pc ------------------------------------------------------------------------------------*/
  #sec06 {
    padding: 80px 0 90px;
  }
  #sec06 .ttl {
    font-size: 2rem;
    margin-bottom: 20px;
  }
  #sec06 .cntttl {
    font-size: 3.5rem;
  }
  #sec06 .lead p {
    line-height: 2.6;
  }
}
@media (max-width: 767px) {
  /*sec06 sp ------------------------------------------------------------------------------------*/
  #sec06 {
    padding: 11.1vw 0;
  }
  #sec06 .ttl {
    font-size: 4.1vw;
    margin-bottom: 2vw;
  }
  #sec06 .cntttl {}
  #sec06 .lead p {}
}