@charset "utf-8";
/* CSS Document */

/* aboutページ専用のスタイル
----------------------------------------------------------- */
.page_title {
  height: 350px;
  background: url(../images/page_title.jpg) no-repeat center center;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_title h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #FFF;
  padding-top: 60px;
}
.page_title h3 span ,
.page_title h3 em {
  display: block;
  line-height: 1.1;
}
.page_title h3 span {
  font-size: 6.0rem;
}
.page_title h3 em {
  font-size: 2.5rem;
}


.about main {
   /*background: url(../images/bg.jpg) no-repeat center center;*/
  background-size: cover;
  padding-bottom: 70px;
}


.about main .logo {
  width: 350px;
  margin: 0 auto;
  margin-bottom: 70px;
}
.about main .greeting {
  padding: 30px 30px 100px 100px;
}
.about main .greeting .box {
  position: relative;
  display: flex;
}
.about main .greeting .box .box_l {
  width: cakc(100% - (390px + 60px));
  margin-right: 60px;
}
/*.about main .greeting .box .box_l {
  display: contents;
}
.about main .greeting .box .title01 {
  order: 1;
}
.about main .greeting .box .comment {
  order: 2;
}*/
.about main .greeting .box .comment p:not(:last-of-type) {
  margin-bottom: 1.2em;
}
.about main .greeting .box .img {
  margin-left: auto;
  width: 390px;
}
.about main .aboutus {
  padding: 100px;
}
.about main .aboutus .box dl {
  display: flex;
  align-items: center;
}
.about main .aboutus .box dl:not(:last-of-type) {
  margin-bottom: 5px;
}
.about main .aboutus .box dl dt {
  width: 145px;
  background: #006fd0;
  color: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: .2em;
  color: #FFF;
  padding: .8em .4em;
}
.about main .aboutus .box dl dt span {
  display: block;
}
.about main .aboutus .box dl dt span::first-letter {
  letter-spacing: 2.4em;
}
.about main .aboutus .box dl dt em {
  display: block;
}
.about main .aboutus .box dl dt em {
  letter-spacing: .6em;
  text-indent: .6em;
}
.about main .aboutus .box dl dd {
  width: calc(100% - 145px);
  padding: .8em 1em;
  background: #FFF;
}
.about main .aboutus .box dl dd span {
  margin-right: .5em;
}
.about main .map {
  padding-bottom: 100px;
}
.about main .map .box {
  display: flex;
}
.about main .map .box section {
  width: 47%;
}
.about main .map .box section:first-of-type {
  margin-right: 6%;
}
.about main .map .box section h4 {
  display: flex;
  justify-content: center;
  margin-bottom: .8em;
  font-size: 1.8rem;
}
.about main .map .box section h4 span ,
.about main .map .box section h4 em {
  display: block;
}
.about main .map .box section h4 span::first-letter {
  letter-spacing: 2.2em;
}
.about main .map .box section h4 em {
  letter-spacing: .2em;
  text-indent: .2em;
}
.about main .map .box section .gmap iframe {
  width: 100%;
  height: 210px;
}



.mw800ab {
  max-width: 650px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}/**/


@media screen and (max-width: 1000px) {
  .about main .greeting {
    padding: 30px 30px 100px 30px;
  }
  

}




/* sp
----------------------------------------------------------- */
@media screen and (max-width: 767px) {

  .page_title {
    height: 40vh;
  }
  .page_title h3 {
    padding-top: 5vw;
  }
  .page_title h3 span {
    font-size: 4.0rem;
  }
  .page_title h3 em {
    font-size: 2.5rem;
  }
  
  
  .about main {
     /*background: url(../images/bg_sp.jpg) no-repeat center center;*/
    background-size: cover;
    padding-bottom: 20vw;
  }
  
  
  .about main .logo {
    width: 40vw;
    margin-bottom: 10vw;
  }
  .about main .greeting {
    padding: 5vw 4vw 20vw 4vw;
  }
  .about main .greeting .box {
    position: relative;
    display: flex;
    flex-direction: column;
  }
  .about main .greeting .box .box_l {
    width: 100%;
    margin-right: 0;
    display: contents;
  }
  .about main .greeting .box .title01 {
    order: 1;
  }
  .about main .greeting .box .comment {
    order: 3;
  }
  .about main .greeting .box .comment p:not(:last-of-type) {
    margin-bottom: 1.2em;
  }
  .about main .greeting .box .img {
    order: 2;
    margin-left: 0;
    width: 100%;
    margin-bottom: 5vw;
  }
  .about main .aboutus {
    padding-bottom: 15vw;
  }
  .about main .aboutus .box dl {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
  }
  .about main .aboutus .box dl:not(:last-of-type) {
    margin-bottom: 4vw;
  }
  .about main .aboutus .box dl dt {
    width: 50vw;
    padding: .4em .4em;
    margin-bottom: 2vw;
  }
  .about main .aboutus .box dl dd {
    width: 100%;
    padding: .4em .4em;
    background: #FFF;
  }
  .about main .aboutus .box dl dd span {
    display: block;
    margin-right: 0;
  }
  .about main .map {
    padding-bottom: 10vw;
  }
  .about main .map .box {
    display: flex;
    flex-direction: column;
  }
  .about main .map .box section {
    width: 100%;
  }
  .about main .map .box section:first-of-type {
    margin-right: 0;
    margin-bottom: 10vw;
  }
  .about main .map .box section h4 {
    font-size: 1.6rem;
  }
  .about main .map .box section .gmap iframe {
    width: 100%;
    height: 60vh;
  }


}