@charset "utf-8";

.ifPc { display: block;}
.ifSc { display: none;}

#main .box-btn-anc {
    display: flex;
    width: 100%;
    margin: 56px 0 0;
    justify-content: space-between;
}
#main .box-btn-anc .btn-howTo1,
#main .box-btn-anc .btn-howTo2 {
    width: 50%;
}
#main .box-btn-anc .btn-howTo1 {
    text-align: left;
    padding-right: 12px;
}
#main .box-btn-anc .btn-howTo2 {
    text-align: right;
    padding-left: 12px;
}


#main .box-btn-anc .btn-howTo1,
#main .box-btn-anc .btn-howTo2 {
    width: calc(50% - 12px);
}
#main .box-btn-anc .btn-howTo1 {
    text-align: left;
    padding-right: 0px;
}
#main .box-btn-anc .btn-howTo2 {
    text-align: right;
    padding-left: 0px;
    /* padding-top: 16px; */
}
#main .box-btn-anc > div {
    border-radius: 8px;
    position: relative;
    overflow: hidden;
}
#main .box-btn-anc .btn-howTo1 a::before,
#main .box-btn-anc .btn-howTo2 a::before {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: 3px;
    width: 32px;
    height: 32px;
    right: 22px;
    /* z-index: -1; */
}
#main .box-btn-anc .btn-howTo1 a::before {
    background-image:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiByeD0iMTYiIGZpbGw9IiMwMDZDQjYiLz4KPHBhdGggZD0iTTExIDE0LjVMMTYgMTkuNUwyMSAxNC41IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K');
}
#main .box-btn-anc .btn-howTo2 a::before {
    background-image:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiByeD0iMTYiIGZpbGw9IiM3M0IxM0IiLz4KPHBhdGggZD0iTTExIDE0LjVMMTYgMTkuNUwyMSAxNC41IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K');
}
#main .box-btn-anc .btn-howTo1 {
    border: solid 2px #006CB6;}
#main .box-btn-anc .btn-howTo2 {
    border: 2px solid #5FAA1C;}
    #main .box-btn-anc .btn-howTo1 a,
#main .box-btn-anc .btn-howTo2 a {
    width: 100%;
    display: block;
    padding: 0px 0 20px;
    position: relative;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(1),
#main .box-btn-anc .btn-howTo2 a div:nth-child(1) {
    /* width: 100px; */
    display: block;
    color: #FFF;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px; /* 150% */
    letter-spacing: 0.48px;
    padding: 3px 0 5px;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(1) {
    background: #006CB6;

}
#main .box-btn-anc .btn-howTo2 a div:nth-child(1) {
    background: #5FAA1C;

}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2),
#main .box-btn-anc .btn-howTo2 a div:nth-child(2) {
    color: #000;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    margin-top: 20px;
    padding-right: 52px;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) br,
#main .box-btn-anc .btn-howTo2 a div:nth-child(2) br {
    display: none;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) {
    padding-right: 52px;
}
#main .box-btn-anc .btn-howTo2 a div:nth-child(2) {
    padding-right: 25px;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) span,
#main .box-btn-anc .btn-howTo2 a div:nth-child(2) span {
    color: #F19E38;
    text-align: center;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 170%; /* 37.4px */
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) span span {
    padding: 0 0.5em;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(3),
#main .box-btn-anc .btn-howTo2 a div:nth-child(3) {
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 170%;
    text-align: center;
    margin-top: -4px;
    padding-right: 32px;
}


#main h2.type1-2 {
    width: 100%;
    max-width: 1200px;
    color: #fff;
    font-size: 39px;
    margin: 0 auto;
    padding: 10px 0 25px;
    text-align: left;
    display: block;
    letter-spacing: 1px;
  }

#main span.type1 {
    width: 100%;
    max-width: 1200px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    margin: 0 auto;
    padding: 68px 0 0px;
    text-align: left;
    display: block;
    letter-spacing: 1px;
  }

#main span.txt--color--green {
    color: #78a612;
}
#main span.txt--color--blue {
    color: #1b6cb6;
}
#main span.txt--font-wb {
    font-weight: bold;
}

.flow-no{
    color: #fff;
    padding: 5px 10px;
    display: inline-block;
    text-align: center;
    width: 107px;
    font-size: 20px;
    font-weight: bold;
} 
.type--blue{
    background-color: #1b6cb6;
}
.type--green{
    background-color: #6ab82d;
}
.bg--green {
    background-color: #e2f0d9 !important;
}
.annotation {
    color: #f00;
    font-size: 14px !important;
    line-height: 1.5em !important;
}

.annotation-h {
    font-weight: bold;
    font-size: 20px;
    line-height: 24px;
    text-align: left;
    color: #000;
    position: relative;
    padding-left: 17px;
    margin-bottom: 15px;
    border-radius: 3px;
    border-left: 6px solid #006cb6;
  }
  /*
.annotation-h::before {
    content: "";
    position: absolute;
    left: 0;
    width: 6px;
    height: 25px;
    border-radius: 3px;
    background: #006cb6;
  }
    */
.theEndTxt {
    font-size: 16px !important;
    font-weight: bold;
    line-height: 1.5em !important;
    margin-top: 40px !important;
}

#main .img-in .img-wrap {
    margin-top: 5px;
    margin-bottom: 10px;
    min-width: 450px;
    width: 450px;
  }

#main .main--01.katsuyo .img-in.img-r .img-wrap {
    margin-top: 0px;
  }
#main .main--01.katsuyo .img-in.img-r .img-big {
    width: 100%;
  }
#main .main--01.katsuyo .img-in.img-r .img-big img {
    margin: 0 !important;
  }

#main .title--02 .title-contents-guid {
    background: #F2FBFE;
    padding: 0px 50px 30px 0px;
  }
  
#main .title--02 .title-contents-guid .title-title,
#main .title--02 .title-contents-guid .title-title>*,
#main .title--02 .title-contents-guid .title-index {
    display: block;
    color: #006CB6;
    font-size: 30px;
    letter-spacing: .05rem;
    line-height: 1.34;
    margin-left: 15px;
    margin-top: 20px;
    margin-right: 0;
    margin-bottom: 20px;
}
  
#main .title--02 .title-contents-guid .title-title {
    padding: 0;
    position: relative;
    z-index: 1;
}
  
#main .title--02 .title-contents-guid .title-title .title-index+strong {
    padding: 0 0 0 35px;
}
  
#main .title--02 .title-contents-guid .title-index {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;
  }


#main .txt-img-2clm {
    display: flex;
    flex-direction: row-reverse;
}
#main .txt-img-2clm .img-wrap {
    margin: 0px 0 0 20px;
}
#main .txt-img-2clm .text-wrap p:first-child {
    margin-top: 0;
}

#main .cts-box .cts-box8 {
    margin: 14px 0;
    padding: 22px 55px 65px;
    border-radius: 10px;
    background-color: #F4F2EE;
  }
#main .cts-box .cts-box8.admin {
    background-color: #F2FBFE !important;
  }
#main .cts-box .cts-box8.user {
    background-color: #EAF6DF !important;
  }
#main .cts-box .cts-box8.admin .boxx-contents .text span { background-color: #1b6cb6 !important; }
#main .cts-box .cts-box8.user .boxx-contents .text span { background-color: #6ab82d !important; }

#main .cts-box .cts-box8 .boxx-contents .text {
    margin: 29px 0 10px;
}
#main .cts-box .cts-box8 .boxx-list {
    margin-bottom: 0px;
}
#main .cts-box .cts-box8 .boxx-list:last-child {
    margin-bottom: 0px;
}

#main .cts-box .cts-box8 .boxx-list ul {
    margin-top: 15px;
    margin-bottom: 20px;
}
#main .cts-box .cts-box8 .boxx-list ul li {
    margin: 5px 0;
}

#main .cts-box .cts-box8 .boxx-list .img-in .text-wrap {
    margin: 5px 0 0;
}

#main .cts-box .cts-box8 .list-img {
    margin-bottom: 0px !important;
}
#main .cts-box .cts-box8 .list-img ul li {
    /*list-style-position: inside;
    list-style-image: url(/resource/images/setup_guide/arrow.png);*/
    list-style-type:none;
    background-image:url(/resource/images/setup_guide/arrow.png);
    background-repeat:no-repeat;
    background-position:left 0.2em;
    padding-left:25px;
}
#main .cts-box .cts-box8 .list-normal {
    
}
#main .cts-box .cts-box8 .list-normal ul {
    list-style:  none;
    margin:  0;
    padding: 0;
}
#main .cts-box .cts-box8 .list-normal ul li {
    display: flex;
    font-size: 14px;
}
#main .cts-box .cts-box8 .list-normal ul li:before  {
    content: "⚫︎";
    color: #006CB6;
    font-size: 0.6em;
    margin-right: 1em;
    margin-top: 5px;
}
/*
#main .cts-box .cts-box8 .list-normal ul li::marker {
    content: "・ ";
    font-size: 1.2em;
}*/
#main .cts-box .cts-box8 .list-kome {
    margin-bottom: 0px !important;
    margin-top: 20px;
}
#main .cts-box .cts-box8 .list-kome ul li {
    /*margin-left: 30px;*/
}
#main .cts-box .cts-box8 .list-kome ul li::before {
    content: "※ ";
    font-size: 1.2em;
}
#main .cts-box .cts-box8 .box-block2 {
    display: flex;
    width: 290px;
    text-align: left;
    margin: 10px 0 20px 0;
}
#main .cts-box .cts-box8 .box-block2 img {
    margin: 0  10px 0 0 !important;
    width: 100%;
    max-width: 56px;
}
#main .cts-box .cts-box8 .box-block2 .box-block2-text {
    display: flex;
    align-items: center;
}
#main .cts-box .cts-box8 .box-block2 .box-block2-text a {
    color: #006cb6;
    text-decoration: underline;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta {
    border: 1px solid #006CB6;
    background: #fff;
    padding: 24px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 30px;
}

#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-left {
    text-align: center;
    padding-top: 10px;
    width: 50%;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-left .box1{
    display: block;
    font-size: 16px;
    font-weight: bold;
    color: #006CB6;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-left .box2{
    display: block;
    font-size: 12px;
    font-weight: bold;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-center{
    display: block;
    background: #006CB6;
    width: 1px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-right {
    text-align: center;
    width: 50%;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-right .box1{
    
    font-size: 30px;
    font-weight: bold;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-right .box1 a{
    color: #006CB6;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-right .box2{
    color: #FF0000;
    font-size: 14px;
    font-weight: bold;
    padding-left: 10px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-right .box3{
    font-size: 14px;
    display: block;
}
#main .cts-box .cts-box8 .boxx-item .boxx-inner-2 {
    display: flex;
    margin-top: 15px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list {
    display: block;
    width: 25%;
    /* min-width: 95px; */
    max-width: 164px;
    margin-right: 31px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list:last-child {
    margin-right: 0px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list .mb-img {
    width: 100%;
}
#main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list .mb-img img {
    width: 100%;
}
#main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list .text {
    margin: 5px 0 10px 0;
    width: 100%;
}
#main .cts-box .cts-box8 .boxx-item .boxx-img-2clm {
    display: flex;
    margin-top: 15px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list:first-child {
    margin-right: 20px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list:last-child {
    margin-left: 20px;
}
#main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list .text-att {
    max-width: 650px;
    display: block;
    margin-bottom: 5px;
}

@media screen and (max-width: 1200px) {
    #main .main--01.katsuyo .img-in.img-r .img-big img {
        width: 90%;
      }

    #main .title--02 .title-contents-guid {
        padding: 0px 20px 30px 0px;
    }

    #main .txt-img-2clm {
        display: block;
    }

    #main .txt-img-2clm .img-wrap {
        margin: 15px 0 10px 0;
    }

    #main .title--02 .title-contents-guid .title-title,
    #main .title--02 .title-contents-guid .title-title>*,
    #main .title--02 .title-contents-guid .title-index {
        font-size: 22px;
        margin-left: 10px;
    }
    #main .cts-box .cts-box8 .boxx-contents .boxx-item.bi2 .boxx-list img {
        width: 100%;
      }
    #main .img-in {
        margin-top: 20px;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta {
        display: block;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-left {
        width: 100%;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-center{
        width: 100%;
        height: 1px;
        margin: 20px 0;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-list .box-cta .flex-right {
        width: 100%;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2-wrap {
        
max-width: 620px;
        
width: 82%;
        
margin: 0 auto;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 {
        display: flex;
        flex-wrap: wrap;
        justify-content:flex-start;
    }

    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list {
        /*margin-right: 10px;*/
        max-width: 186px;
        width: calc(33% - 21px);
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list:nth-child(3n) {
        margin-right: 0;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-img-2clm {
        display: block;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list:first-child {
        margin-right: 0px;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list:last-child {
        margin-left: 0px;
    }

    #main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list .img-sp{
        max-width: 176px;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-img-2clm .boxx-list .text-att {
        max-width: 100%;
    }


    #main .box-btn-anc .btn-howTo1 a div:nth-child(2),
    #main .box-btn-anc .btn-howTo2 a div:nth-child(2) {
        padding-right: 0;
    }
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) br,
#main .box-btn-anc .btn-howTo2 a div:nth-child(2) br {
    display: block;
}
    #main .box-btn-anc .btn-howTo1 a div:nth-child(3),
    #main .box-btn-anc .btn-howTo2 a div:nth-child(3) {
        padding-right: 0;
        margin-top: 10px;
        font-size: 13px;
    }
}
@media screen and (max-width: 1000px) {
    #main .box-btn-anc .btn-howTo1 a div:nth-child(1), #main .box-btn-anc .btn-howTo2 a div:nth-child(1) {
        font-size: 16px;
    }
    #main .box-btn-anc .btn-howTo1 a div:nth-child(2), #main .box-btn-anc .btn-howTo2 a div:nth-child(2) {
        font-size: 16px;
    }
    #main .box-btn-anc .btn-howTo1 a div:nth-child(2) span, #main .box-btn-anc .btn-howTo2 a div:nth-child(2) span {
        font-size: 16px;
    
    }
    #main .box-btn-anc .btn-howTo1 a::before, #main .box-btn-anc .btn-howTo2 a::before {
        width: 24px;
        height: 24px;
        background-size: 100%;
        right: 6px;
    }
    #main .box-btn-anc .btn-howTo1, #main .box-btn-anc .btn-howTo2 {
        width: calc(50% - 6px);
    }
}
@media screen and (max-width: 940px) {
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list {
        margin-right: 10px;
        width: calc(33% - 7px);
    }
 }
@media screen and (max-width: 768px) { 
    .ifPc { display: none;}
    .ifSc { display: block;}

    #main .main--01.katsuyo .img-in.img-r .img-big img {
        width: 70%;
      }

    #main span.type1 {
        padding: 2px 20px 3px;
        font-size: 16px;
    }

    #main h2.type1-2 {
        padding: 2px 20px 3px;
        font-size: 32px;
        line-height: 1.2;
        letter-spacing: 0;
      }

    #main .box-btn-anc {
        display: block;
    }
    

    #main .title--02 .title-contents-guid .title-title,
    #main .title--02 .title-contents-guid .title-title>*,
    #main .title--02 .title-contents-guid .title-index {
        margin-left: 10px;
    }

    #main .cts-box .cts-box8 {
        padding: 1px 20px 15px 20px;
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list {
        margin-right: 19px;
        width: calc(33% - 13px);
    }

    
#main .box-btn-anc .btn-howTo1,
#main .box-btn-anc .btn-howTo2 {
    width: 100%;
}
#main .box-btn-anc .btn-howTo2 {
    margin-top: 16px;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) br,
#main .box-btn-anc .btn-howTo2 a div:nth-child(2) br {
    display: none;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(1), #main .box-btn-anc .btn-howTo2 a div:nth-child(1) {
    font-size: 16px;
    padding: 1px 0 3px;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2), #main .box-btn-anc .btn-howTo2 a div:nth-child(2) {
    font-size: 16px;
    margin-top: 12px;
    margin-right: 26px;
}
#main .box-btn-anc .btn-howTo1 a div:nth-child(2) span, #main .box-btn-anc .btn-howTo2 a div:nth-child(2) span {
    font-size: 16px;

}
#main .box-btn-anc .btn-howTo1 a div:nth-child(3),
#main .box-btn-anc .btn-howTo2 a div:nth-child(3) {margin-top: 0;padding-right: 24px;}
#main .box-btn-anc .btn-howTo1 a, #main .box-btn-anc .btn-howTo2 a {
    padding: 0px 0 10px;
}
#main .box-btn-anc .btn-howTo1 a::before, #main .box-btn-anc .btn-howTo2 a::before {
    width: 24px;
    height: 24px;
    background-size: 100%;
    right: 14px;
    margin-top: 7px;
}

}
@media screen and (max-width: 490px) {
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list {
        margin-right: 19px;
        width: calc(50% - 19px);
    }
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list:nth-child(3n) {
        margin-right: 19px;
    }
    
    
}
@media screen and (max-width: 440px) {
    #main .cts-box .cts-box8 .boxx-item .boxx-inner-2 .boxx-list:nth-child(3) {
        /*margin-right: 31px;*/
    }
}


@media (pointer: fine), (hover: hover) {
    a:where([href^="tel:"]) {
      pointer-events: none;
    }
  }