/* _setting CSS */
/*
* index
*/
/* ------------------------------------------------------------------------- */
/*------------------######################################### 
----------------------------
----------------------------
min-width: 768px
----------------------------
--------------------#########################################*/
@media screen and (min-width: 768px) {
  main#contents #main {
    padding-top: 67px;
    background: url(../images/service/service_bg.jpg) center/cover no-repeat;
  }
  main#contents #sec01 {
    padding-bottom: 80px;
    /*--block-------------------*/
  }
  main#contents #sec01 h3 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 22px;
  }
  main#contents #sec01 h3:after, main#contents #sec01 h3:before {
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    margin: 0 20px;
    background: #9D9D9D;
  }
  main#contents #sec01 .block_wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 22px auto 57px;
  }
  main#contents #sec01 .block_wrap a, main#contents #sec01 .block_wrap .a_div {
    display: block;
    background: #fff;
    color: #333;
    transition: .2s;
  }
  main#contents #sec01 .block_wrap a:hover {
    opacity: .7;
  }
  main#contents #sec01 .block_wrap .block {
    width: 490px;
  }
  main#contents #sec01 .block_wrap .block.block05 {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 20px;
    background: #fff;
  }
  main#contents #sec01 .block_wrap .block.block05 .logo_text {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 15px;
    margin-right: 15px;
    border-right: 1px dotted #707070;
    font-size: 2.4rem;
  }
  main#contents #sec01 .block_wrap .block.block05 .logo_text span {
    color: #3889F6;
  }
  main#contents #sec01 .block_wrap .block.block05 .text01 {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  main#contents #sec01 .block_wrap img {
    display: block;
    margin: 0 auto;
  }
  main#contents #sec01 .block_wrap .img_block {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 88px;
    border-bottom: 1px solid #eee;
  }
  main#contents #sec01 .block_wrap .img_block .logo_text {
    font-size: 2rem;
  }
  main#contents #sec01 .block_wrap .img_block .logo_text span {
    color: #3889F6;
  }
  main#contents #sec01 .block_wrap .text_block {
    min-height: 140px;
    padding: 25px 70px;
  }
  main#contents #sec01 .block_wrap .logo.logo01 {
    width: 180px;
  }
  main#contents #sec01 .block_wrap .logo.logo02 {
    width: 200px;
  }
  main#contents #sec01 .block_wrap .logo.logo03 {
    width: 200px;
  }
  main#contents #sec01 .block_wrap .logo.logo04 {
    width: 114px;
  }
  main#contents #sec01 .block_wrap .logo.logo05 {
    width: 55px;
    margin: 0 10px 0 0;
  }
  main#contents #sec01 .block_wrap .logo.logo06 {
    width: 75px;
    margin: 0 10px 0 0;
  }
  main#contents #sec01 .block_wrap .logo.logo07 {
    width: 65px;
    margin: 0 10px 0 0;
  }
  main#contents #sec01 .block_wrap .btn01 i {
    position: absolute;
    top: 12px;
    right: 8px;
    font-size: 1.2rem;
    opacity: .7;
  }
  main#contents #sec01 .block_wrap:last-of-type {
    margin-bottom: 0;
  }
}
/*------------------######################################### 
----------------------------
----------------------------
max-width: 767px
----------------------------
--------------------#########################################*/
@media screen and (max-width: 767px) {
  main#contents #main {
    padding-top: 10vw;
    background: url(../images/service/sp_service_bg.jpg) center/100% repeat-y;
  }
  main#contents #sec01 {
    padding-bottom: 10vw;
    /*--block-------------------*/
  }
  main#contents #sec01 h3 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5vw;
  }
  main#contents #sec01 h3:after, main#contents #sec01 h3:before {
    content: "";
    display: block;
    width: 5vw;
    height: 2px;
    margin: 0 5vw;
    background: #9D9D9D;
  }
  main#contents #sec01 .block_wrap {
    margin: 5vw auto 8vw;
  }
  main#contents #sec01 .block_wrap a {
    display: block;
    color: #333;
  }
  main#contents #sec01 .block_wrap .block {
    margin-bottom: 5vw;
  }
  main#contents #sec01 .block_wrap .block a, main#contents #sec01 .block_wrap .block .a_div {
    background: #fff;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
  }
  main#contents #sec01 .block_wrap img {
    display: block;
    margin: 0 auto;
  }
  main#contents #sec01 .block_wrap .img_block {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 24vw;
    border-bottom: 1px solid #eee;
  }
  main#contents #sec01 .block_wrap .img_block .logo_text {
    font-size: 1.8rem;
  }
  main#contents #sec01 .block_wrap .img_block .logo_text span {
    color: #3889F6;
  }
  main#contents #sec01 .block_wrap .text_block {
    padding: 7vw 5vw;
  }
  main#contents #sec01 .block_wrap .text_block p {
    font-size: 1.5rem;
  }
  main#contents #sec01 .block_wrap .logo.logo01 {
    width: 39vw;
  }
  main#contents #sec01 .block_wrap .logo.logo02 {
    width: 49vw;
  }
  main#contents #sec01 .block_wrap .logo.logo03 {
    width: 49vw;
  }
  main#contents #sec01 .block_wrap .logo.logo04 {
    width: 29vw;
  }
  main#contents #sec01 .block_wrap .logo.logo05 {
    width: 15vw;
    margin: 0 3vw 0 0;
  }
  main#contents #sec01 .block_wrap .logo.logo06 {
    width: 18vw;
    margin: 0 3vw 0 0;
  }
  main#contents #sec01 .block_wrap .logo.logo07 {
    width: 15vw;
    margin: 0 0vw 0 0;
  }
  main#contents #sec01 .block_wrap .logo.logo08 {
    width: 80vw;
    margin: 0 0vw 0 0;
  }
  main#contents #sec01 .block_wrap .btn01 i {
    position: absolute;
    top: 12px;
    right: 8px;
    font-size: 1.2rem;
    opacity: .7;
  }
  main#contents #sec01 .block_wrap:last-of-type {
    margin-bottom: 0;
  }
}