@charset "UTF-8";
/* _setting CSS */
/*
* outsourcing
*/
/* ------------------------------------------------------------------------- */
/*------------------######################################### 
----------------------------
----------------------------
min-width: 768px
----------------------------
--------------------#########################################*/
@media screen and (min-width: 768px) {
  main#contents #main {
    margin: 50px auto 100px;
  }
  main#contents #main h3 {
    margin-bottom: 25px;
    padding-bottom: 3px;
    border-bottom: 1px solid #265796;
    font-size: 2.8rem;
    font-weight: bold;
  }
  main#contents #main h4 {
    margin-bottom: 15px;
    border-bottom: 1px dotted #707070;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main img {
    max-width: 100%;
  }
  main#contents #main .text01 {
    margin-bottom: 25px;
  }
  main#contents #main .top_text {
    margin-bottom: 40px;
  }
  main#contents #main .c_text01 {
    color: #3889F6;
  }
  main#contents #main .img_block {
    display: flex;
    justify-content: space-between;
    width: 1000px;
    margin: 0 auto;
    position: relative;
  }
  main#contents #main .img_block .arrow {
    width: 170px;
    margin-top: 90px;
  }
  main#contents #main .img_block .arrow img {
    display: block;
    width: 70px;
    margin: 0 auto;
  }
  main#contents #main ul {
    margin-top: 20px;
  }
  main#contents #main ul li {
    position: relative;
    padding-left: 14px;
  }
  main#contents #main ul li:before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: #235598;
  }
  main#contents #main .btn_block {
    margin-top: 60px;
  }
  main#contents #main .btn_block .text01 {
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main.outsourcing_top {
    margin: 0 auto;
    padding-top: 67px;
    background: url(../images/service/service_bg.jpg) center/cover no-repeat;
  }
  main#contents #main.outsourcing_top #sec01 {
    padding-bottom: 80px;
  }
  main#contents #main.outsourcing_top #sec01 h3 {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
    font-weight: normal;
    border: none;
  }
  main#contents #main.outsourcing_top #sec01 h3:after, main#contents #main.outsourcing_top #sec01 h3:before {
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    margin: 0 20px;
    background: #9D9D9D;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 22px auto 57px;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 320px;
    height: 160px;
    padding: 25px;
    background: #fff;
    color: #333;
    transition: .2s;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a:after {
    content: "\f105";
    position: absolute;
    top: 72px;
    right: 7px;
    width: 13px;
    text-align: center;
    font-family: "Font Awesome 5 Free";
    font-size: 1.2rem;
    font-weight: 900;
    color: #60A1F8;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a p {
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a:hover {
    opacity: .7;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a .bpo_img1 {
    width: 60px;
    margin-right: 10px;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a .bpo_img2 {
    width: 48px;
    margin-right: 10px;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a .bpo_img3 {
    width: 48px;
    margin-right: 10px;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap .block {
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
  }
  main#contents #main.damageinsurance #sec02 {
    margin-bottom: 80px;
  }
  main#contents #main.damageinsurance #sec02 .img_block .img {
    width: 405px;
  }
  main#contents #main.damageinsurance #sec02 .img_block .img h5 {
    margin-bottom: 15px;
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main.damageinsurance #sec02 .img_block .img img {
    width: 100%;
  }
  main#contents #main.damageinsurance #sec02 .img_block .img .img01 {
    display: block;
    width: 405px;
    margin: 0 auto;
    padding-top: 287px;
    background: url(../images/service/outsourcing/sol01/damageinsurance/bpo_damage_img1_1.jpg) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.damageinsurance #sec02 .img_block .img .img02 {
    display: block;
    width: 405px;
    margin: 0 auto;
    padding-top: 287px;
    background: url(../images/service/outsourcing/sol01/damageinsurance/bpo_damage_img1_2.jpg) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.damageinsurance #sec02 .img_block .arrow .text01 {
    font-weight: bold;
  }
  main#contents #main.damageinsurance #sec03 .img01 {
    display: block;
    width: 1000px;
    margin: 0 auto;
    padding-top: 817px;
    background: url(../images/service/outsourcing/sol01/damageinsurance/bpo_damage_img2.png) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.lifeinsurance #sec01 {
    margin-bottom: 60px;
  }
  main#contents #main.lifeinsurance ul {
    margin-bottom: 30px;
  }
  main#contents #main.lifeinsurance #sec02 .img01 {
    display: block;
    width: 1000px;
    margin: 0 auto;
    padding-top: 817px;
    background: url(../images/service/outsourcing/sol01/damageinsurance/bpo_damage_img2.png) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.bank .img_flex {
    display: flex;
    justify-content: space-between;
    margin-bottom: 60px;
  }
  main#contents #main.bank .img_flex .img01 {
    width: 320px;
  }
  main#contents #main.bank .img_flex .img_block {
    display: block;
    width: 490px;
    flex-shrink: 0;
  }
  main#contents #main.bank .img_flex .img_block h5 {
    text-align: center;
    margin-bottom: 15px;
    font-size: 1.8rem;
    color: #235598;
  }
  main#contents #main.bank .img_flex .text_block {
    margin-left: 20px;
  }
  main#contents #main.bank .img_flex .text_block .link01 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  main#contents #main.bank .img_flex .text_block .link01:before {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    margin-right: 6px;
    background: url(../images/service/outsourcing/sol01/bank/arrow02.png) center/100% no-repeat;
  }
  main#contents #main.bank .img_flex .text_block ul li {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 5px;
    padding: 0;
  }
  main#contents #main.bank .img_flex .text_block ul li span {
    margin-right: 8px;
    font-size: 2rem;
    font-weight: bold;
    line-height: 1.1;
  }
  main#contents #main.bank .img_flex .text_block ul li:before {
    content: none;
  }
  main#contents #main.bank .img_flex.img_flex02 {
    width: 1000px;
    margin: 0 auto 60px;
    position: relative;
    align-items: center;
  }
  main#contents #main.bank #sec01 ul {
    margin-bottom: 25px;
  }
  main#contents #main.bank #sec03 {
    margin-bottom: 65px;
  }
  main#contents #main.bank #sec03 table ul {
    margin: 0;
    padding-left: 20px;
  }
  main#contents #main.bank #sec03 table ul li {
    margin-bottom: 5px;
    padding: 0;
    list-style: decimal;
  }
  main#contents #main.bank #sec03 table ul li:before {
    content: none;
  }
  main#contents #main.bank #sec03 table ul li:last-child {
    margin-bottom: 0;
  }
  main#contents #main.bank #sec04 table {
    margin-top: 10px;
  }
  main#contents #main.bank #sec04 table ul.figure {
    width: 960px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
  }
  main#contents #main.bank #sec04 table ul.figure > li {
    width: 225px;
    padding: 0;
    border: 1px solid #5a77a8;
    border-radius: 6px;
    background: #fff;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl {
    position: relative;
    padding: 15px;
    background: #CFDAE8;
    border-bottom: 1px solid #5a77a8;
    border-radius: 6px 6px 0 0;
    text-align: center;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl:before {
    content: "";
    position: absolute;
    top: -56px;
    left: 83px;
    display: block;
    width: 49px;
    height: 49px;
    margin-bottom: 6px;
    background: url(../images/service/outsourcing/sol01/bank/arrow03.png) center/100% no-repeat;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl h4 {
    margin-bottom: 0;
    border: none;
    font-size: 1.8rem;
    color: #235598;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl p {
    margin-top: 3px;
    line-height: 1.6;
    font-size: 1.4rem;
    font-weight: bold;
    color: #555;
  }
  main#contents #main.bank #sec04 table ul.figure > li ul {
    margin-top: 0;
    padding: 15px;
  }
  main#contents #main.bank #sec04 table ul.figure > li ul li {
    line-height: 1.8;
    font-size: 1.5rem;
  }
  main#contents #main.bank #sec04 table ul.figure > li:before {
    content: none;
  }
  main#contents #main.bank .h3_2 {
    font-size: 2rem;
  }
  main#contents #main.bank .h4_2 {
    border-bottom: 1px solid #265796;
  }
  main#contents #main.bank .img02 {
    display: block;
    width: 1000px;
    margin: 0 auto 60px;
    padding-top: 194px;
    background: url(../images/service/outsourcing/sol01/bank/bpo_bank_img2.png) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.bank .img06 {
    display: block;
    width: 960px;
    margin: 0 auto 0;
    padding-top: 250px;
    background: url(../images/service/outsourcing/sol01/bank/bpo_bank_img6.png) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.bank .img07 {
    display: block;
    width: 960px;
    margin: 0 auto 0;
    padding-top: 290px;
    background: url(../images/service/outsourcing/sol01/bank/bpo_bank_img7.png) center top/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main.bank table {
    width: 100%;
    margin-top: 25px;
  }
  main#contents #main.bank table caption {
    margin-bottom: 10px;
    text-align: left;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main.bank table td, main#contents #main.bank table th {
    padding: 12px 14px;
    line-height: 1.3;
  }
  main#contents #main.bank table th {
    width: 150px;
    background: #95B8F5;
    color: #fff;
    font-weight: bold;
  }
  main#contents #main.bank table .bg_g {
    background: #E3E3E3;
    color: #333;
  }
  main#contents #main.bank table .f_18 {
    font-size: 1.8rem;
  }
  main#contents #main.bank table .bg_b {
    background: #F5F9FF;
  }
  main#contents #main.bank table, main#contents #main.bank td, main#contents #main.bank th {
    border: 1px solid #5E7AAA;
    border-collapse: collapse;
  }
  main#contents #main.bank .arrow {
    margin-top: 10px;
    text-align: center;
  }
  main#contents #main.bank .arrow img {
    width: 41px;
  }
}
/*------------------######################################### 
----------------------------
----------------------------
max-width: 767px
----------------------------
--------------------#########################################*/
@media screen and (max-width: 767px) {
  main#contents #main {
    margin: 10vw auto 13vw;
  }
  main#contents #main h3 {
    margin-bottom: 4vw;
    padding-bottom: 3vw;
    border-bottom: 1px solid #265796;
    font-size: 2rem;
    font-weight: bold;
  }
  main#contents #main h4 {
    margin-bottom: 4vw;
    border-bottom: 1px dotted #707070;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main img {
    max-width: 100%;
  }
  main#contents #main .text01 {
    margin-bottom: 4vw;
  }
  main#contents #main .top_text {
    margin-bottom: 10vw;
  }
  main#contents #main .c_text01 {
    color: #3889F6;
  }
  main#contents #main .img_block .img {
    border-top: 1px solid #D6D6D6;
  }
  main#contents #main .img_block .img h5 {
    margin: 2vw 0;
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main .img_block .img img {
    width: 100%;
  }
  main#contents #main .img_block .arrow {
    display: flex;
    justify-content: center;
    width: 67vw;
    margin: 5vw auto;
  }
  main#contents #main .img_block .arrow img {
    display: block;
    width: 14vw;
    margin-right: 3vw;
    padding-top: 21vw;
    background: url(../images/service/outsourcing/sol01/damageinsurance/arrow_sp.png) center/100% no-repeat;
    display: block;
    height: 0;
    line-height: 200;
    overflow: hidden;
    background-repeat: no-repeat;
  }
  main#contents #main .img_block .arrow .text01 {
    width: 41vw;
  }
  main#contents #main ul {
    padding: 0 4.66667vw 0 0;
    margin: 0 auto;
    position: relative;
    margin-top: 3vw;
  }
  main#contents #main ul li {
    position: relative;
    padding-left: 14px;
  }
  main#contents #main ul li:before {
    content: "";
    position: absolute;
    top: 0.8rem;
    left: 0;
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: #235598;
  }
  main#contents #main .btn_block {
    margin-top: 30vw;
  }
  main#contents #main .btn_block .text01 {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
  }
  main#contents #main.outsourcing_top {
    margin: 0 auto;
    padding-top: 10vw;
    background: url(../images/service/sp_service_bg.jpg) center/cover no-repeat;
  }
  main#contents #main.outsourcing_top #sec01 {
    padding-bottom: 10vw;
  }
  main#contents #main.outsourcing_top #sec01 h3 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2vw;
    font-size: 2rem;
    font-weight: normal;
    border: none;
  }
  main#contents #main.outsourcing_top #sec01 h3:after, main#contents #main.outsourcing_top #sec01 h3:before {
    content: "";
    display: block;
    width: 5vw;
    height: 2px;
    margin: 0 0 0 5vw;
    background: #9D9D9D;
  }
  main#contents #main.outsourcing_top #sec01 h3:before {
    margin: 0 5vw 0 0;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap {
    margin: 3vw auto 8vw;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 20vw;
    padding: 25px;
    background: #fff;
    font-weight: bold;
    color: #333;
    transition: .2s;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a:after {
    content: "\f105";
    position: absolute;
    top: 39%;
    right: 7px;
    text-align: center;
    font-family: "Font Awesome 5 Free";
    font-size: 1.7rem;
    font-weight: 900;
    color: #60A1F8;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a:hover {
    opacity: .7;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a .bpo_img1 {
    width: 11vw;
    margin-right: 3vw;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a .bpo_img2 {
    width: 9vw;
    margin-right: 3vw;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap a .bpo_img3 {
    width: 9vw;
    margin-right: 3vw;
  }
  main#contents #main.outsourcing_top #sec01 .block_wrap .block {
    margin-bottom: 5vw;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
  }
  main#contents #main.damageinsurance #sec02 {
    margin-bottom: 10vw;
  }
  main#contents #main.damageinsurance #sec02 ul {
    padding: 0 4.66667vw;
  }
  main#contents #main.lifeinsurance #sec01 {
    margin-bottom: 10vw;
  }
  main#contents #main.lifeinsurance ul {
    margin-bottom: 30px;
  }
  main#contents #main.bank .img_flex {
    margin-bottom: 12vw;
  }
  main#contents #main.bank .img_flex .img_block {
    display: block;
  }
  main#contents #main.bank .img_flex .img_block h5 {
    text-align: left;
    margin-bottom: 2vw;
    font-size: 1.8rem;
    color: #235598;
  }
  main#contents #main.bank .img_flex .img_block.img_block02 {
    margin-bottom: 8vw;
  }
  main#contents #main.bank .img_flex .text_block {
    margin-top: 3vw;
  }
  main#contents #main.bank .img_flex .text_block .link01 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  main#contents #main.bank .img_flex .text_block .link01:before {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    margin-right: 6px;
    background: url(../images/service/outsourcing/sol01/bank/arrow02.png) center/100% no-repeat;
  }
  main#contents #main.bank .img_flex .text_block ul li {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 2vw;
    padding: 0;
  }
  main#contents #main.bank .img_flex .text_block ul li span {
    margin-right: 2vw;
    font-size: 2rem;
    font-weight: bold;
    line-height: 1.1;
  }
  main#contents #main.bank .img_flex .text_block ul li:before {
    content: none;
  }
  main#contents #main.bank .img_flex.img_flex02 h5, main#contents #main.bank .img_flex.img_flex02 .text_block {
    padding: 0 4.66667vw;
  }
  main#contents #main.bank ul {
    margin-bottom: 7vw;
    padding: 0;
  }
  main#contents #main.bank #sec01 {
    margin-bottom: 7vw;
  }
  main#contents #main.bank #sec03 {
    margin-bottom: 10vw;
  }
  main#contents #main.bank #sec03 table ul {
    margin: 0;
    padding-left: 5vw;
  }
  main#contents #main.bank #sec03 table ul li {
    margin-bottom: 2vw;
    padding: 0;
    list-style: decimal;
  }
  main#contents #main.bank #sec03 table ul li:before {
    content: none;
  }
  main#contents #main.bank #sec03 table ul li:last-child {
    margin-bottom: 0;
  }
  main#contents #main.bank #sec04 table {
    margin-top: 3vw;
  }
  main#contents #main.bank #sec04 table ul.figure {
    position: relative;
    margin: 1vw auto 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
  }
  main#contents #main.bank #sec04 table ul.figure > li {
    width: 49%;
    margin-top: 2vw;
    padding: 0;
    border: 1px solid #5a77a8;
    border-radius: 6px;
    background: #fff;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl {
    padding: 2.3vw 2vw;
    background: #CFDAE8;
    border-bottom: 1px solid #5a77a8;
    border-radius: 6px 6px 0 0;
    line-height: 1.3;
    text-align: center;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl h4 {
    margin-bottom: 0;
    border: none;
    font-size: 1.5rem;
    color: #235598;
  }
  main#contents #main.bank #sec04 table ul.figure > li .li_ttl p {
    line-height: 1.3;
    font-size: 1.3rem;
    font-weight: bold;
    color: #555555;
  }
  main#contents #main.bank #sec04 table ul.figure > li ul {
    margin: 0;
    padding: 2.3vw;
  }
  main#contents #main.bank #sec04 table ul.figure > li ul li {
    margin-bottom: 1.2vw;
    font-size: 1.5rem;
    line-height: 1.3;
  }
  main#contents #main.bank #sec04 table ul.figure > li:before {
    content: none;
  }
  main#contents #main.bank .h3_2 {
    font-size: 2rem;
  }
  main#contents #main.bank .h4_2 {
    border-bottom: 1px solid #265796;
    font-size: 2rem;
  }
  main#contents #main.bank .img02 {
    margin-bottom: 13vw;
  }
  main#contents #main.bank .img06 {
    margin-bottom: 3vw;
  }
  main#contents #main.bank table {
    width: 100%;
    margin-top: 25px;
    border-bottom: 1px solid #5E7AAA;
  }
  main#contents #main.bank table tbody {
    width: 100%;
  }
  main#contents #main.bank table caption {
    margin-bottom: 10px;
    text-align: left;
    font-size: 1.8rem;
    font-weight: bold;
  }
  main#contents #main.bank table td, main#contents #main.bank table th {
    display: block;
    width: 100%;
    padding: 2vw 4vw;
    line-height: 1.5;
    border: 1px solid #5E7AAA;
    border-bottom: none;
  }
  main#contents #main.bank table th {
    line-height: 1.3;
    background: #95B8F5;
    color: #fff;
    font-weight: bold;
  }
  main#contents #main.bank table tr {
    display: flex;
    flex-wrap: wrap;
  }
  main#contents #main.bank table .bg_g {
    background: #E3E3E3;
    color: #333;
  }
  main#contents #main.bank table .f_18 {
    font-size: 1.8rem;
  }
  main#contents #main.bank table .bg_b {
    background: #F5F9FF;
  }
  main#contents #main.bank table, main#contents #main.bank td, main#contents #main.bank th {
    border-collapse: collapse;
  }
  main#contents #main.bank .arrow {
    margin-top: 10px;
    text-align: center;
  }
  main#contents #main.bank .arrow img {
    width: 7vw;
  }
}