@charset "utf-8";

/** ▼▼▼▼▼▼ main ▼▼▼▼▼▼ **/
#main {
    width: 100%;
    height: 760px;
    margin: 100px auto 0 auto;
    padding: 0;
    background: url(../images/main_bg.png) no-repeat center center / cover;
}

#main h2 {
    position: relative;
    width: 1200px;
    margin: 0 auto;
    padding: 566px 0 0 0;
    font-family: "Noto Serif JP", serif;
    font-size: 1.62em;
    font-weight: 200;
    font-style: normal;
    line-height: 190%;
    text-align: center;
    background: url(../images/h2_bg.png) no-repeat left -90px top -5px / 53%;
    z-index: 10;
}

#main h2 div {
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}

#main div {
    width: 872px;
    margin: 0 auto;
    padding: 0;
    text-align: center;
}

#main div.bg {
    position: absolute;
    top: 100px;
    right: 0;
    left: 0;
    margin: 0 auto;
    padding: 445px 0 0 0;
}

#main div img.mac {
    position: absolute;
    top: -80px;
    right: 0;
    left: 0;
    width: 872px;
    margin: 0 auto;
}

#main div img.bocrm {
    width: 390px;
    height: auto;
}

#main p {
    font-family: "EB Garamond", serif;
    font-size: 1.06em;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#main a {
    width: 480px;
    margin: 30px auto 0 auto;
    padding: 12px 0;
    transition: .3s;
    transform: scale(1);
    display: block;
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    color: #FFFFFF;
    background: #FFAF00 url(../common/images/right_footer.svg) no-repeat right 21px center;
    border-radius: 30px;
}

#main a:hover {
    background: #FFC74C url(../common/images/right_footer.svg) no-repeat right 13px center;
}
/** ▲▲▲▲▲▲ main ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ main ▼▼▼▼▼▼ **/
/** #main {
    width: 720px;
    height: 760px;
    margin: 100px auto 0 auto;
    padding: 0 720px 0 0;
    background: url(../images/main_bg.png) no-repeat right 40px top 40px / contain;
}

#main h2 {
    width: 720px;
    padding: 415px 0 0 0;
    font-family: "Noto Serif JP", serif;
    font-size: 2.25em;
    font-weight: 200;
    font-style: normal;
    line-height: 190%;
    text-align: center;
    background: url(../images/h2_bg.png) no-repeat center top -50px / 100%;
}

#main h2 div {
    width: 100%;
    margin: 0;
    text-align: center;
}

#main div {
    width: 480px;
    margin: 20px auto 0 auto;
    text-align: center;
}

#main div img {
    width: 390px;
    height: auto;
}

#main a {
    width: 480px;
    margin: 15px auto 0 auto;
    padding: 12px 0;
    transition: .3s;
    transform: scale(1);
    display: block;
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    color: #FFFFFF;
    background: #FFAF00 url(../common/images/right_footer.svg) no-repeat right 21px center;
    border-radius: 30px;
}

#main a:hover {
    background: #FFC74C url(../common/images/right_footer.svg) no-repeat right 13px center;
} **/
/** ▲▲▲▲▲▲ main ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ achievements ▼▼▼▼▼▼ **/
#achievements {
    width: 100%;
    padding: 40px 0 0 0;
}

#achievements h3 {
    width: 100%;
    height: 69px;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 300;
    font-style: normal;
    letter-spacing: 0.05em;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFFFFF;
    background: #FFAF00;
}

#achievements ul.what {
    display: flex;
    justify-content: space-between;
    width: 1130px;
    margin: 110px auto 0 auto;
    padding: 0;
    list-style: none;
}

#achievements ul.what li:nth-child(1) {
    width: 552px;
}

#achievements ul.what li:nth-child(2) {
    width: 530px;
}

#achievements ul.what li p:nth-child(1) {
    font-family: "Noto Serif JP", serif;
    font-size: 1.37em;
    font-weight: 400;
    font-style: normal;
    line-height: 200%;
}

#achievements ul.what li p:nth-child(2) {
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 200%;
}

#achievements ul.what li p:nth-child(3) {
    font-family: "Noto Serif JP", serif;
    font-size: 1.37em;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.2em;
}

/**
#achievements div.what {
    width: 530px;
    margin: 110px auto 0 auto;
    padding: 0 0 0 570px;
    background: url(../images/achievements_bg.png) no-repeat left top 20px / contain;
}

#achievements div.what p:nth-child(1) {
    font-family: "Noto Serif JP", serif;
    font-size: 1.37em;
    font-weight: 400;
    font-style: normal;
    line-height: 200%;
}

#achievements div.what p:nth-child(2) {
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 400;
}

#achievements div.what p:nth-child(3) {
    font-family: "Noto Serif JP", serif;
    font-size: 1.37em;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.2em;
}
**/

#achievements h5 {
    margin: 95px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.87em;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.2em;
    color: #FFAF00;
}

#achievements p:nth-child(5) {
    margin: 40px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 500;
    font-style: normal;
    text-align: center;
}

#achievements ul.problem {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1000px;
    margin: 3px auto 0 auto;
    background: url(../images/bg_problem.png) no-repeat center center;
}

#achievements ul.problem li {
    position: relative;
    display: flex;
    align-items: center;
    width: 310px;
    height: 100px;
    margin: 7px 0;
    padding: 0 20px;
    border-radius: 5px;
    background: #FDF2DA;
}

#achievements ul.problem li:nth-child(1)::before {
    content: "　";
    position: absolute;
    top: 70%;
    left: 100%;
    background: url(../images/arr_right.png) no-repeat;
}

#achievements ul.problem li:nth-child(2)::before {
    content: "　";
    position: absolute;
    top: 70%;
    left: -16px;
    background: url(../images/arr_left.png) no-repeat;
}

#achievements ul.problem li:nth-child(3)::before {
    content: "　";
    position: absolute;
    top: 50%;
    left: 100%;
    background: url(../images/arr_right.png) no-repeat;
}

#achievements ul.problem li:nth-child(4)::before {
    content: "　";
    position: absolute;
    top: 50%;
    left: -16px;
    background: url(../images/arr_left.png) no-repeat;
}

#achievements ul.problem li:nth-child(5)::before {
    content: "　";
    position: absolute;
    top: 20%;
    left: 100%;
    background: url(../images/arr_right.png) no-repeat;
}

#achievements ul.problem li:nth-child(6)::before {
    content: "　";
    position: absolute;
    top: 20%;
    left: -16px;
    background: url(../images/arr_left.png) no-repeat;
}

#achievements ul.problem li p {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    line-height: 200%;
}

#achievements p:nth-child(7) {
    margin: 73px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 200;
    font-style: normal;
    text-align: center;
    color: #FFAF00;
}

#achievements img.bocrm {
    display: block;
    width: 460px;
    margin: 21px auto 0 auto;
}

/**#achievements p:nth-child(9) {
    margin: 73px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 200;
    font-style: normal;
    text-align: center;
}**/

#achievements p:nth-child(9) {
    margin: 50px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.875em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    color: #FFAF00;
}

#achievements img.clienteling {
    display: block;
    width: 846px;
    margin: 33px auto 0 auto;
}

#achievements p:nth-child(12) {
    margin: 60px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#achievements div.basic {
    width: 1000px;
    margin: 70px auto 0 auto;
    padding: 33px 0 29px 0;
    border: #FFAF00 solid 1px;
    border-radius: 15px;
}

#achievements div.basic h4 {
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    line-height: 187.5%;
    color: #FFAF00;

}

#achievements div.basic p {
    margin: 15px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.25em;
    font-weight: 300;
    font-style: normal;
    text-align: center;
    line-height: 220%;
}

#achievements div.basic ul {
    width: 940px;
    margin: 42px auto 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
}

#achievements div.basic ul li:nth-child(odd) {
    width: 420px;
    padding: 150px 0 26px 0;
    border: #D9D9D9 solid 1px;
    border-radius: 10px;
}

#achievements div.basic ul li:nth-child(1) {
    background: url(../images/bg_crm.png) no-repeat top 17px center / 48%;
}

#achievements div.basic ul li:nth-child(3) {
    background: url(../images/bg_clienteling.png) no-repeat top 50px center / 28%;
}

#achievements div.basic ul li h5 {
    margin: 15px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.375em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    line-height: 218%;
}

#achievements div.basic ul li p {
    margin: 6px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 0.875em;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#achievements div.value {
    width: 1000px;
    margin: 80px auto 0 auto;
}

#achievements div.value h5 {
    margin: 80px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.87em;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.2em;
    color: #FFAF00;
}

#achievements div.value p {
    margin: 40px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 500;
    font-style: normal;
    text-align: center;
}

#achievements div.value ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    margin: 55px auto 0 auto;
    list-style: none;
}

#achievements div.value ul li {
    width: 410px;
    padding: 33px 35px;
    border-radius: 10px;
    background: rgba(253, 242, 218, 0.4);
}

#achievements div.value ul li:nth-child(3) {
    margin: 40px 0 0 0;
}

#achievements div.value ul li:nth-child(4) {
    margin: 40px 0 0 0;
}

#achievements div.value ul li h5 {
    margin: 0;
    font-family: "Noto Serif JP", serif;
    font-size: 1.62em;
    font-weight: 400;
    text-align: left;
    letter-spacing: 0;
    color: #FFAF00;
}

#achievements div.value ul li p {
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    text-align: left;
    letter-spacing: 0;
    line-height: 200%;
}

#achievements div.value ul li p strong {
    display: block;
    margin: 15px 0 10px 0;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
}
/** ▲▲▲▲▲▲ achievements ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ service ▼▼▼▼▼▼ **/
#service {
    margin: 130px auto 0 auto;
    padding: 130px 0 95px 0;
}

#service p {
    margin: 22px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#service ul {
    width: 1200px;
    margin: 44px auto 0 auto;
    display: flex;
    justify-content: space-between;
    list-style: none;
}

#service ul li {
    width: 280px;
    padding: 23px 0 45px 0;
    background: #FFFFFF;
    border-radius: 10px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

#service ul li h5 {
    font-family: "trajan-pro-3", serif;
    font-size: 1.25em;
    font-weight: 300;
    font-style: normal;
    text-align: center;
    color: #FFAF00;
}

#service ul li h5 span {
    display: block;
    margin: 45px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;
    color: #222222;
}

#service ul li p {
    width: 240px;
    margin: 40px auto 0 auto;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    line-height: 200%;
}

#service ul li p strong {
    display: block;
    margin: 0 auto 20px auto;
    font-family: "Noto Serif JP", serif;
    font-size: 1.25em;
    font-weight: 300;
    font-style: normal;
    text-align: center;
    line-height: 170%;
}

#service ul li p span {
    display: block;
}

#service ul li ul {
    width: 260px;
    margin: 20px auto 0 auto;
    padding: 32px 0 0 0;
    display: flex;
    flex-direction: column;
    border-top: #FFAF00 solid 2px;
}

#service ul li ul li:nth-child(1) {
    margin: 0 auto;
}

#service ul li ul li:nth-child(n+2) {
    margin: 21px auto 0 auto;
}

#service ul li ul li {
    width: 205px;
    padding: 0 0 0 35px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    line-height: 175%;
    background: url(../images/icn_service.svg) no-repeat left top 3px;
    box-shadow: none;
    border-radius: 0;
}

#service ul li ul span {
    margin: 5px 0 0 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.812em;
    font-weight: 400;
    font-style: normal;
}

#service ul li ul li span {
    font-size: 0.812em;
}
/** ▲▲▲▲▲▲ service ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ reason ▼▼▼▼▼▼ **/
#reason {
    margin: 0 auto;
    padding: 130px 0 0 0;
}

#reason p {
    margin: 22px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#reason div {
    width: 373px;
    margin: 45px auto 0 auto;
    padding: 0 0 0 627px;
    border: #D9D9D9 solid 1px;
    border-radius: 5px;
    background: url(../images/bg_reason.svg) no-repeat left 10px center;
}

#reason div p {
    margin: 20px 0;
    padding: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.75em;
    font-weight: 400;
    font-style: normal;
    line-height: 200%;
    text-align: left;
}

#reason ul.common_retsu3 li {
    padding: 10px 10px 15px 10px;
    border-radius: 10px;
    background: #FFFFFF;
    /**box-shadow: 0 4px 6px 2px rgba(0, 0, 0, 0.20);**/
}

#reason ul.common_retsu3 li:nth-child(2) {
    width: 300px;
    padding: 10px 10px 15px 10px;
}

#reason ul.common_retsu3 li img.variable {
    position: relative;
    left: -31px;
    width: auto;
    height: 200px;
}
/** ▲▲▲▲▲▲ reason ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ flow ▼▼▼▼▼▼ **/
#flow {
    margin: 130px auto 0 auto;
    padding: 130px 0 95px 0;
}

#flow h4 {
    margin-bottom: 40px;
}

#flow ul {
    width: 970px;
    margin: 0 auto;
    /**padding: 20px;**/
    display: flex;
    justify-content: space-between;
    list-style: none;
}

#flow ul li:nth-child(1) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 390px;
    padding: 20px 30px 20px 20px;
    border-radius: 10px 0 0 10px;
    background: #FFAF00;
}

#flow ul li:nth-child(2) {
    width: 484px;
    padding: 13px 28px;
    /**font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;**/
    border-radius: 0 10px 10px 0;
    background: #FFFFFF;
}

#flow ul li div {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 170px;
    height: 100%;
    border-radius: 5px;
    background: #FDF2DA;
    font-family: "Noto Serif JP", serif;
    font-size: 2em;
    font-weight: 400;
    font-style: normal;
    color: #FFAF00;
}

#flow ul li div strong {
    display: inline-block;
    width: initial;
    margin: 0 5px 0 0;
    font-size: 0.62em;
    text-decoration: underline;
}

#flow ul li strong {
    display: inline-block;
    width: 200px;
    font-size: 1.25em;
    font-weight: 500;
    text-align: center;
    line-height: 170%;
}

#flow ul li p {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.87em;
    font-weight: 400;
    line-height: 200%;
}

#flow .triangle {
    width: 43px;
    height: 28px;
    margin: 10px auto;
}
/** ▲▲▲▲▲▲ flow ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ package ▼▼▼▼▼▼ **/
/**
#package {
    margin: 130px auto 0 auto;
    padding: 130px 0 95px 0;
}

#package p {
    margin: 22px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#package ul {
    width: 960px;
    margin: 60px auto 0 auto;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    background: #FFFFFF;
    border-radius: 5px;
    list-style: none;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

#package ul li:nth-child(1) {
    width: 180px;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;
}

#package ul li ul {
    width: 747px;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    list-style: none;
    background: none;
    box-shadow: none;
}

#package ul li ul li {
    margin: 10px 0 0 0;
    padding: 0 0 0 35px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    line-height: 175%;
    background: url(../images/icn_service.svg) no-repeat left top 3px;
}

#package ul li ul li:nth-child(1) {
    margin: 0;
    width: 100%;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    line-height: 175%;
}

#package div {
    width: 38px;
    height: 38px;
    margin: 10px auto 0 auto;
}

#package ul.system {
    width: 960px;
    margin: 10px auto 0 auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    border-radius: 5px;
    list-style: none;
}

#package ul.system li:nth-child(2) {
    margin: 15px 0 0 0;
}

#package ul.system li ul {
    width: 960px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    list-style: none;
    background: none;
}

#package ul.system li ul li:nth-child(1) {
    width: 213px;
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    padding: 0;
    background: none;
}

#package ul.system li ul li:nth-child(2) {
    margin: 0;
}

#package ul.system li ul li {
    width: 747px;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0 0 0 35px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.666em;
    font-weight: 400;
    font-style: normal;
    line-height: 100%;
    background: url(../images/icn_service.svg) no-repeat left top;
}

#package div.ttl:nth-child(5) {
    margin: 40px auto 0 auto;
}**/

/** _/_/_/_/_/_/_/_/_/_/_/ **/
/** #package ul.packaging:nth-child(1) {
    margin: 60px auto 0 auto;
}

#package ul.packaging:nth-child(2) {
    margin: 30px auto 0 auto;
}

#package ul.packaging {
    width: 1000px;
    padding: 0;
    display: flex;
    flex-direction: column;
    list-style: none;
    background: none;
    box-shadow: none;
}

#package ul.packaging li {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    font-size: 1em;
    list-style: none;
} **/
/** _/_/_/_/_/_/_/_/_/_/_/ **/

/** #package ul.packaging li div.ttl_package {
    width: 1000px;
    height: 40px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.25em;
    color: #FFFFFF;
    background: #6A6968;
    border-radius: 10px;
}

#package div.ttl_option {
    width: 1000px;
    height: 40px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.25em;
    color: #FFFFFF;
    background: #6A6968;
    border-radius: 10px;
}

#package ul.detail {
    width: 1000px;
    margin: 10px auto 0 auto;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    background: #6A6968;
    border-radius: 10px;
    list-style: none;
}

#package ul.detail li:nth-child(1) {
    width: 220px;
    display: flex;
    align-items: center;
    font-size: 1.25em;
    text-align: center;
    line-height: 116%;
    color: #FFFFFF;
    background: #6A6968;
    border-radius: 10px 0 0 10px;
}

#package ul.detail li:nth-child(2) {
    width: 780px;
    display: flex;
    justify-content: center;
    background: #FFFFFF;
    border-radius: 0 10px 10px 0;
}

#package ul.detail li {
    padding: 30px 0;
}

#package ul.detail li span {
    display: block;
    margin: 10px 0 0 0;
    font-size: 0.8em;
}

#package ul.detail li ul {
    width: 770px;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
    background: none;
    list-style: none;
}

#package ul.detail li ul li {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    line-height: 100%;
    background: none;
}

#package ul.detail li ul li:nth-child(1) {
    width: 105%;
    margin: 0;
    padding: 0;
    font-size: 1em;
    background: none;
}

#package ul.detail li ul li:nth-child(2) {
    width: 95%;
}

#package ul.detail li ul li.option:nth-child(1) {
    width: 90%;
    margin: 0;
    padding: 0;
    font-size: 1em;
    background: none;
}

#package ul.detail li ul li.option:nth-child(2) {
    width: 110%;
}

#package ul.detail li ul li strong {
    width: 100%;
    font-family: "Noto Serif JP", serif;
    font-size: 1.25em;
    font-weight: 300;
    font-style: normal;
    text-align: left;
    color: #222222;
}

#package ul.detail li ul li p:nth-child(2) {
    margin: 30px 0 0 0;
}

#package ul.detail li ul li p {
    width: 100%;
    margin: 16px 0 0 0;
    padding: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.85em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    line-height: 142%;
    color: #222222;
}

#package ul.detail li ul li.option p:nth-child(1) {
    margin: 0;
}

#package ul.detail li ul li.option p:nth-child(2) {
    margin: 16px 0 0 0;
}

#package ul.detail li ul li.option span {
    width: 100%;
    margin: 3px 0 0 20px;
    padding: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.75em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    line-height: 150%;
    color: #222222;
}

#package p.square:before {
    content: "■";
    margin: 0 0 0 0;
    padding: 0 5px 0 10px;
}
**/
/** ▲▲▲▲▲▲ package ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ support ▼▼▼▼▼▼ **/
#support {
    margin: 0 auto;
    padding: 130px 0 0 0;
}

#support p {
    margin: 22px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#support ul.common_retsu3 {
    margin: 30px auto 0 auto;
}

#support ul.common_retsu3 li {
    padding: 10px 10px 15px 10px;
    border-radius: 10px;
    /**box-shadow: 0 4px 6px 2px rgba(0, 0, 0, 0.20);**/
}

#support ul.common_retsu3 li:nth-child(2) {
    width: 300px;
}

#support ul.common_retsu3 li img {
    width: 46px;
    height: auto;
    margin: 0 auto;
    display: block;
}

#support ul.common_retsu3 li h5 {
    margin: 17px auto 0 auto;
    font-family: "Noto Serif JP", serif;
    font-weight: 300;
}

#support ul.common_retsu3 li h6 {
    margin: 6px auto 0 auto;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    line-height: 170%;
    text-align: center;
    color: #FFAF00;
}

#support ul.common_retsu3 li h6 span {
    letter-spacing: -0.02em;
}

#support ul.common_retsu3 li p span {
    letter-spacing: -0.03em;
}
/** ▲▲▲▲▲▲ support ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ case ▼▼▼▼▼▼ **/
#case {
    margin: 130px auto 0 auto;
    padding: 130px 0 95px 0;
}

#case ul.common_retsu3 {
    margin: 40px auto 0 auto;
}

#case ul.common_retsu3 li {
    border-radius: 10px;
    /**background: #FFFFFF;**/
    padding: 10px 10px 15px 10px;
    /**box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);**/
}

#case ul.common_retsu3 li:nth-child(2) {
    width: 300px;
}

#case ul.common_retsu3 img:nth-child(2) {
    margin: 18px auto 0 auto;
}

#case ul.common_retsu3 h5 {
    margin: 23px 0 0 0;
    padding: 4px 9px;
    display: inline-block;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.75em;
    font-weight: 500;
    font-style: normal;
    line-height: 100%;
    color: #FFFFFF;
    background: #FFAF00;
    border-radius: 5px;
}

#case ul.common_retsu3 h6 {
    margin: 10px 0 0 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    line-height: 200%;
}

#case ul.common_retsu3 p {
    margin: 20px auto 15px auto;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    font-style: normal;
}

#case ul.common_retsu3 div {
    margin: 5px 5px 0 0;
    padding: 4px 8px;
    display: inline-block;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.75em;
    font-weight: 500;
    font-style: normal;
    line-height: 100%;
    color: #FFAF00;
    border: #FFAF00 solid 1px;
    border-radius: 5px;
    background: #FFFFFF;
}
/** ▲▲▲▲▲▲ case ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ seminar ▼▼▼▼▼▼ **/
#seminar {
    margin: 0 auto;
    padding: 130px 0 0 0;
}

#seminar ul.webinar {
    /**width: 705px;**/
    width: 940px;
    height: 280px;
    margin: 40px auto 0 auto;
    /**padding: 0 0 0 295px;**/
    padding: 30px;
    display: flex;
    align-items: center;
    /**background: #F3F3F3 url(../images/img_seminar_01.png) no-repeat 30px 30px / 22%;**/
    background: #FFAF00;
    border-radius: 5px;
    list-style: none;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

#seminar ul.webinar li h4 {
    margin: 0;
    padding: 0;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 1.5em;
    font-weight: 500;
    font-style: normal;
    text-align: left;
}

#seminar ul.webinar li ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

#seminar ul.webinar li ul li {
   margin: 20px 0 0 0;
}

#seminar ul.webinar li ul li:nth-child(even) {
    width: 90%;
}

#seminar ul.webinar li ul li {
    font-family: "Noto Serif JP", serif;
    font-weight: 400;
    font-size: 1em;
    font-style: normal;
    line-height: 200%;
}

#seminar ul.webinar li ul li span {
    margin: 0 0 0 15px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.75em;
    font-weight: 400;
    font-style: normal;
}

#seminar ul.webinar li a.contact {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s;
    transform: scale(1);
    width: 400px;
    height: 60px;
    margin: 25px 0 0 274px;
    padding: 0;
    border-radius: 30px;
    background: #FFAF00 url(../common/images/right_footer.svg) no-repeat right 28px center;
    font-size: 1em;
    font-weight: 400;
    font-style: normal;
    color: #FFFFFF;
}

#seminar ul.webinar li a.contact:hover {
    background: #FFC74C url(../common/images/right_footer.svg) no-repeat right 20px center;
}

#seminar ul.seminar:nth-child(3) {
    margin: 50px auto 0 auto;
    background: url(../images/img_seminar_02.png) no-repeat 20px 25px / 17.2%;
}

#seminar ul.seminar:nth-child(4) {
    margin: 30px auto 0 auto;
    background: url(../images/img_seminar_03.svg) no-repeat 25px 20px;
}

#seminar ul.seminar {
    width: 786px;
    padding: 25px 0 25px 214px;
    display: flex;
    align-items: center;
    border: #C6C6C6 solid 1px;
    border-radius: 5px;
    list-style: none;
}

#seminar ul.seminar h4 {
    margin: 0;
    padding: 0;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    color: #FFAF00;
}

#seminar ul.seminar h5 {
    margin: 15px 0 0 0;
    padding: 0;
    font-family: "Noto Serif JP", serif;
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    letter-spacing: 0.1em;
}

#seminar ul.seminar p {
    margin: 20px 0 0 0;
    font-weight: 400;
    line-height: 200%;
}

#seminar ul.seminar p span {
    margin: 35px 0 0 0;
    display: block;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.875em;
    font-weight: 400;
    font-style: normal;
}
/** ▲▲▲▲▲▲ seminar ▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼ topics ▼▼▼▼▼▼ **/
#topics {
    margin: 0 auto;
    padding: 130px 0 0 0;
}

#topics ul:nth-child(2) {
    margin: 40px auto 0 auto;
    border-top: #000000 solid 1px;
}

#topics ul {
    width: 1000px;
    height: 60px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: #000000 solid 1px;
    list-style: none;
}

#topics ul li:nth-child(1) {
    width: 200px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 500;
    color: #FFAF00;
}

#topics ul li:nth-child(2) {
    width: 800px;
}

#topics ul li {
    display: flex;
}

#topics ul li div {
    height: 20px;
    margin: 0 0 0 25px;
    padding: 0 9px;
    display: flex;
    align-items: center;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 0.75em;
    font-weight: 500;
    color: #FFFFFF;
    background: #5A5757;
    border-radius: 5px;
}

#topics ul li a {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    color: #222222;
    transition: .3s;
}

#topics ul li a:hover {
    color: #FFAF00;
}
/** ▲▲▲▲▲▲ topics ▲▲▲▲▲▲ **/

@media (max-width: 640px) {
    /** ▼▼▼▼▼▼ main ▼▼▼▼▼▼ **/
    #main {
        width: 100%;
        height: 100%;
        margin: 25px auto 0 auto;
        padding: 0;
        background: url(../images/main-sp_bg.png) no-repeat 0 0 / contain;
    }
    
    #main h2 {
        width: 100%;
        padding: 400px 0 0 0;
        font-size: 135%;
        line-height: 180%;
        background: url(../images/h2_bg.png) no-repeat left -50px  top 75px / 90%;
    }
    
    #main div {
        width: 78%;
    }
    
    /**#main div img {
        width: 80%;
        height: auto;
    }**/

    #main div.bg {
        position: absolute;
        top: 80px;
        right: 0;
        left: 0;
        margin: 0 auto;
        padding: 250px 0 0 0;
    }
    
    #main div img.mac {
        /**position: absolute;**/
        top: -80px;
        right: -110px;
        /**left: 0;**/
        width: 250px;
        /**margin: 0 auto;**/
    }

    #main div img.bocrm {
        width: 290px;
        height: auto;
        margin: 20px auto 0 auto;
    }

    #main p {
        font-size: 0.9em;
        margin: 0 auto;
        /**font-family: "EB Garamond", serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        text-align: center;**/
    }
    
    #main a {
        width: 100%;
        padding: 6px 0;
        font-size: 95%;
    }
    /** ▲▲▲▲▲▲ main ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ achievements ▼▼▼▼▼▼ **/
    #achievements {
        width: 100%;
        padding: 40px 0 0 0;
    }

    #achievements h3 {
        height: 60px;
        font-size: 120%;
    }

    #achievements ul.what {
        flex-direction: column;
        width: 92%;
        margin: 20px auto 0 auto;
        padding: 0;
        /**background: url(../images/achievements_bg.png) no-repeat center 0 / 66%;**/
    }

    #achievements ul.what li:nth-child(1) {
        width: 100%;
    }
    
    #achievements ul.what li:nth-child(2) {
        width: 100%;
    }

    #achievements ul.what li p:nth-child(1) {
        font-size: 100%;
        text-align: center;
    }

    #achievements ul.what li p:nth-child(2) {
        font-size: 77%;
        line-height: 190%;
        text-align: center;
    }

    #achievements ul.what li p:nth-child(3) {
        font-size: 120%;
        text-align: center;
    }

    #achievements h5 {
        margin: 50px auto 0 auto;
        /**font-family: "Noto Serif JP", serif;**/
        font-size: 120%;
        line-height: 185%;
        /**font-weight: 500;
        text-align: center;
        letter-spacing: 0.2em;
        color: #FFAF00;**/
    }

    #achievements p:nth-child(5) {
        margin: 20px auto 0 auto;
        font-size: 80%;
        /**font-family: "Noto Serif JP", serif;
        font-weight: 500;
        font-style: normal;
        text-align: center;**/
    }

    #achievements ul.problem {
        /**display: flex;
        justify-content: space-between;
        flex-wrap: wrap;**/
        width: 90%;
        margin: 0 auto;
        padding: 0 0 160px 0;
        background: url(../images/bg_problem.png) no-repeat center bottom / 40%;
    }

    #achievements ul.problem li {
        /**position: relative;
        display: flex;
        align-items: center;**/
        width: 40%;
        height: initial;
        margin: 20px 0 0 0;
        padding: 10px 15px;
        /**border-radius: 5px;**/
        /**background: #FDF2DA;**/
    }

    #achievements ul.problem li:nth-child(1)::before {
        content: "　";
        position: absolute;
        top: 100%;
        left: 90%;
        margin-left: -15px;
        background: url(../images/arr_down.png) no-repeat;
    }

    #achievements ul.problem li:nth-child(2)::before {
        content: "　";
        position: absolute;
        top: 100%;
        left: 90%;
        margin-left: -15px;
        background: url(../images/arr_down.png) no-repeat;
    }

    #achievements ul.problem li:nth-child(3)::before {
        content: "　";
        position: absolute;
        top: 100%;
        left: 90%;
        margin-left: -15px;
        background: url(../images/arr_down.png) no-repeat;
    }

    #achievements ul.problem li:nth-child(4)::before {
        content: "　";
        position: absolute;
        top: 100%;
        left: 90%;
        margin-left: -15px;
        background: url(../images/arr_down.png) no-repeat;
    }

    #achievements ul.problem li:nth-child(5)::before {
        content: "　";
        position: absolute;
        top: 100%;
        left: 90%;
        margin-left: -15px;
        background: url(../images/arr_down.png) no-repeat;
    }

    #achievements ul.problem li:nth-child(6)::before {
        content: "　";
        position: absolute;
        top: 100%;
        left: 90%;
        margin-left: -15px;
        background: url(../images/arr_down.png) no-repeat;
    }

    #achievements ul.problem li p {
        margin: 0;
        padding: 0;
        font-size: 77%;
        /**font-family: "Noto Sans JP", sans-serif;
        font-weight: 400;
        font-style: normal;
        line-height: 200%;**/
    }

    #achievements p:nth-child(7) {
        margin: 50px auto 0 auto;
        font-size: 110%;
    }

    #achievements img.bocrm {
        width: 76%;
        margin: 10px auto 0 auto;
    }

    /**#achievements p:nth-child(6) {
        margin: 20px auto 0 auto;
        font-size: 100%;
    }**/

    #achievements p:nth-child(9) {
        margin: 10px auto 0 auto;
        font-size: 130%;
    }

    #achievements img.clienteling {
        width: 90%;
    }

    #achievements p:nth-child(12) {
        margin: 40px auto 0 auto;
        font-size: 82%;
        letter-spacing: -0.05em;
        line-height: 190%;
        text-align: center;
    }

    #achievements div.basic {
        width: 92%;
        margin: 40px auto 0 auto;
        padding: 0 0 15px 0;
    }

    #achievements div.basic h4 {
        margin: 20px 0 0 0;
        font-size: 110%;
        line-height: 187.5%;
    }

    #achievements div.basic p {
        margin: 15px auto 0 auto;
        font-size: 110%;
        line-height: 200%;
    }

    #achievements div.basic ul {
        width: 91%;
        margin: 30px auto 0 auto;
        flex-direction: column;
    }

    #achievements div.basic ul li:nth-child(odd) {
        width: 60%;
        padding: 15px 0 10px 40%;
    }

    #achievements div.basic ul li:nth-child(1) {
        background: url(../images/bg_crm.png) no-repeat 10px center / 33%;
    }

    #achievements div.basic ul li:nth-child(3) {
        background: url(../images/bg_clienteling.png) no-repeat 15px center / 28%;
    }

    #achievements div.basic ul li img {
        width: 50px;
        height: auto;
    }

    #achievements div.basic ul li h5 {
        margin: 0 auto;
        font-size: 110%;
        text-align: left;
        line-height: 100%;
        letter-spacing: 0;
        color: #000000;
    }

    #achievements div.basic ul li p {
        margin: 10px auto 0 auto;
        font-size: 0.75em;
        line-height: 180%;
        text-align: left;
    }

    #achievements div.value {
        width: 90%;
        margin: 40px auto 0 auto;
    }
    
    #achievements div.value h5 {
        margin: 20px auto 0 auto;
        /**font-family: "Noto Serif JP", serif;**/
        font-size: 130%;
        /**font-weight: 500;
        text-align: center;
        letter-spacing: 0.2em;
        color: #FFAF00;**/
    }
    
    #achievements div.value p {
        margin: 20px auto 0 auto;
        /**font-family: "Noto Serif JP", serif;**/
        font-size: 77%;
        /**font-weight: 500;
        font-style: normal;
        text-align: center;**/
    }
    
    #achievements div.value ul {
        flex-direction: column;
        margin: 20px auto 0 auto;
        /**display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: 100%;
        list-style: none;**/
    }
    
    #achievements div.value ul li {
        width: 100%;
        padding: 5px 0 10px 0;
        /**border-radius: 10px;
        background: rgba(253, 242, 218, 0.4);**/
    }
    
    #achievements div.value ul li:nth-child(2) {
        margin: 10px 0 0 0;
    }
    
    #achievements div.value ul li:nth-child(3) {
        margin: 10px 0 0 0;
    }
    
    #achievements div.value ul li:nth-child(4) {
        margin: 10px 0 0 0;
    }
    
    #achievements div.value ul li h5 {
        font-size: 1em;
        /**margin: 0;
        font-family: "Noto Serif JP", serif;
        font-weight: 400;**/
        text-align: center;
        /**letter-spacing: 0;
        color: #FFAF00;**/
    }
    
    #achievements div.value ul li p {
        font-size: 77%;
        /**margin: 0;
        font-family: "Noto Sans JP", sans-serif;
        font-weight: 400;**/
        text-align: center;
        /**letter-spacing: 0;
        line-height: 200%;**/
    }
    
    #achievements div.value ul li p strong {
        font-size: 1.4em;
        /**display: block;
        margin: 15px 0 10px 0;
        font-family: "Noto Serif JP", serif;
        font-weight: 400;**/
    }
    /** ▲▲▲▲▲▲ achievements ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ service ▼▼▼▼▼▼ **/
    #service {
        margin: 70px auto 0 auto;
        padding: 70px 0 30px 0;
    }

    #service p {
        margin: 15px auto 0 auto;
        font-size: 85%;
        line-height: 190%;
    }

    #service ul {
        width: 92%;
        margin: 40px auto 0 auto;
        flex-direction: column;
    }

    #service ul li:nth-child(n+2) {
        margin: 15px 0 0 0;
    }

    #service ul li {
        width: 100%;
        padding: 15px 0 20px 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
    }

    #service ul li h5 {
        display: block;
        width: 30%;
    }

    #service ul li p {
        display: block;
        width: 60%;
        margin: 0 auto;
        font-size: 90%;
    }

    #service ul li p strong {
        display: block;
        margin: 0 auto 18px auto;
        font-size: 120%;
        text-align: left;
        line-height: 180%;
    }

    #service ul li p span {
        display: none;
    }

    #service ul li ul {
        width: 90%;
        padding: 15px 0 0 0;
    }

    #service ul li ul li:nth-child(1) {
        margin: 0 auto;
    }

    #service ul li ul li:nth-child(n+2) {
        margin: 15px auto 0 auto;
    }

    #service ul li ul li {
        width: 100%;
        padding: 0 0 0 8%;
        font-size: 87%;
        background: url(../images/icn_service.svg) no-repeat left top 3px / 5%;
    }

    #service ul li ul span {
        margin: 5px 0 0 6%;
        font-size: 80%;
    }

    #service ul li ul li span {
        margin: 0 15% 0 0;
        padding: 0;
        font-size: 80%;
    }
    /** ▲▲▲▲▲▲ service ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ reason ▼▼▼▼▼▼ **/
    #reason {
        margin: 0 auto;
        padding: 80px 0 0 0;
    }

    #reason ul.common_retsu3 li {
        margin-left: -3%;
    }

    #reason ul.common_retsu3 li:nth-child(2) {
        width: 100%;
    }
    
    #reason ul.common_retsu3 li img.variable {
        width: 71%;
        height: auto;
        margin: 0 0 0 -6%;
        position: static;
    }

    #reason p {
        margin: 15px auto 0 auto;
        width: 92%;
        font-size: 85%;
        line-height: 190%;
    }

    #reason div {
        width: 92%;
        margin: 35px auto 0 auto;
        padding: 55% 0 5px 0;
        background: url(../images/bg_reason-sp.svg) no-repeat center 20px / 85%;
    }

    #reason div p {
        width: 93%;
        margin: 0 auto;
        padding: 0;
        font-size: 70%;
        text-align: center;
    }
    /** ▲▲▲▲▲▲ reason ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ package ▼▼▼▼▼▼ **/
    #package {
        margin: 70px auto 0 auto;
        padding: 70px 0 30px 0;
    }

    #package p {
        width: 85%;
        margin: 15px auto 0 auto;
        font-size: 85%;
        line-height: 190%;
    }

    #package ul {
        width: 92%;
        margin: 40px auto 0 auto;
        padding: 20px 0 ;
        flex-direction: column;
    }

    #package ul li:nth-child(1) {
        width:90%;
        margin: 0 auto;
        font-size: 120%;
    }

    #package ul li ul {
        width: 90%;
        margin: 20px auto 0 auto;
    }

    #package ul li ul li {
        margin: 10px 0 0 0;
        padding: 0 0 0 8%;
        font-size: 87%;
        background: url(../images/icn_service.svg) no-repeat left top 3px / 5%;
    }

    #package ul li ul li:nth-child(1) {
        font-size: 87%;
    }

    #package ul.system {
        width: 92%;
        margin: 0 auto;
        padding: 0 0 20px 0;
    }

    #package ul.system li ul {
        width: 100%;
        flex-direction: column;
    }

    #package ul.system li ul li:nth-child(1) {
        width: 100%;
    }

    #package ul.system li ul li:nth-child(2) {
        margin: 20px 0 0 0;
    }

    #package ul.system li ul li {
        width: 92%;
        padding: 0 0 0 8%;
        font-size: 70%;
        line-height: 170%;
        background: url(../images/icn_service.svg) no-repeat left top 3px / 5%;
    }

    #package ul.system li img {
        width: 90%;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    #package div.ttl:nth-child(5) {
        margin: 40px auto 0 auto;
    }

    /** _/_/_/_/_/_/_/_/_/_/_/ **/
    #package ul.packaging:nth-child(9) {
        margin: 25px auto 0 auto;
    }
    #package ul.packaging {
        width: 92%;
        flex-direction: row;
        justify-content: space-between;
        background: none;
        border-radius: 0;
    }
    
    #package ul.packaging li:nth-child(1) {
        width: 8%;
        background: #6A6968;
        border-radius: 5px;
    }
    
    #package ul.packaging li:nth-child(2) {
        width: 89%;
    }
    
    #package ul.packaging li {
        margin: 0 !important;
        flex-direction: colmun;
        font-size: 1em;
        justify-content: space-between;
    }
    /** _/_/_/_/_/_/_/_/_/_/_/ **/

    #package ul.packaging li div.ttl_package {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 15px 0 0 0;
        justify-content: flex-start;
        align-items: center;
        font-size: 90%;
        border-radius: 5px;
        writing-mode: vertical-rl;
    }

    #package ul.packaging li div.ttl_option {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 15px 0 0 0;
        justify-content: flex-start;
        align-items: center;
        font-size: 90%;
        border-radius: 5px;
        writing-mode: vertical-rl;
    }

    #package ul.packaging li ul.detail:nth-child(2) {
        margin: 15px 0 0 0;
    }

    #package ul.packaging li ul.detail {
        width: 100%;
        margin: 0;
        flex-direction: column;
    }

    #package ul.packaging li ul.detail li:nth-child(1) {
        width: 100%;
        padding: 0;
        display: flex;
        border-radius: 5px 5px 0 0;
    }

    #package ul.packaging li ul.detail li:nth-child(2) {
        width: 100%;
        border-radius: 0 0 5px 5px;
    }

    #package ul.packaging li ul.detail li {
        padding: 0 0 20px 0;
    }

    #package ul.packaging li ul.detail li p {
        margin: 0;
        padding: 10px 0;
        line-height: 100%;
    }

    #package ul.packaging li ul.detail li span {
        display: inline;
        font-size: 0.666em;
    }

    #package ul.packaging li ul.detail li ul {
        width: 100%;
        flex-direction: column;
    }

    #package ul.packaging li ul.detail li ul li:nth-child(1) {
        width: 100%;
    }

    #package ul.packaging li ul.detail li ul li:nth-child(2) {
        width: 100%;
        padding: 15px 0 0 0;
    }

    #package ul.detail li ul li.option:nth-child(1) {
        width: 90%;
        margin: 0;
        padding: 0;
        font-size: 1em;
        background: none;
    }

    #package ul.detail li ul li.option:nth-child(2) {
        width: 110%;
    }

    #package ul.packaging li ul.detail li ul li strong {
        margin: 20px 0 0 0;
        font-size: 1.15em;
    }

    #package ul.packaging li ul.detail li ul li p:nth-child(2) {
        margin: 16px 0 0 0;
    }

    #package ul.packaging li ul.detail li ul li p {
        width: 100%;
        margin: 16px 0 0 0;
        padding: 0;
        font-family: "Noto Sans JP", sans-serif;
        font-size: 0.85em;
        font-weight: 400;
        font-style: normal;
        text-align: left;
        line-height: 142%;
        color: #222222;
    }

    #package ul.detail li ul li.option:nth-child(1) {
        padding: 16px 0 0 0;
    }

    #package ul.detail li ul li.option p:nth-child(1) {
        margin: 0;
    }

    #package ul.detail li ul li.option p:nth-child(2) {
        margin: 16px 0 0 0;
    }

    #package ul.detail li ul li.option span {
        width: 100%;
        margin: 3px 0 0 20px;
        padding: 0;
        font-family: "Noto Sans JP", sans-serif;
        font-size: 0.7em;
        font-weight: 400;
        font-style: normal;
        text-align: left;
        line-height: 150%;
        color: #222222;
    }

    #package p.square:before {
        content: "■";
        margin: 0 0 0 0;
        padding: 0 5px 0 10px;
    }  
    /** ▲▲▲▲▲▲ package ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ flow ▼▼▼▼▼▼ **/
    #flow {
        margin: 50px auto 0 auto;
        padding: 80px 0 50px 0;
    }

    #flow h4 {
        margin-bottom: 40px;
    }

    #flow ul {
        width: 90%;
        flex-direction: column;
        /**margin: 0 auto;**/
        /**padding: 20px;**/
        /**display: flex;
        justify-content: space-between;
        list-style: none;**/
    }

    #flow ul li:nth-child(1) {
        width: 94%;
        padding: 10px 3%;
        border-radius: 10px 10px 0 0;
        /**display: flex;
        align-items: center;
        justify-content: space-between;
        background: #FFAF00;**/
    }

    #flow ul li:nth-child(2) {
        width: 94%;
        padding: 0 3%;
        /**font-family: "Noto Serif JP", serif;
        font-size: 1.5em;
        font-weight: 400;
        font-style: normal;**/
        border-radius: 0 0 10px 10px;
        /**background: #FFFFFF;**/
    }

    #flow ul li div {
        width: 90px;
        height: 35px;
        font-size: 1.1em;
        /**display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 5px;
        background: #FDF2DA;
        font-family: "Noto Serif JP", serif;
        font-weight: 400;
        font-style: normal;
        color: #FFAF00;**/
    }

    #flow ul li div strong {
        font-size: 0.62em;
        /**display: inline-block;
        width: initial;
        margin: 0 5px 0 0;
        text-decoration: underline;**/
    }

    #flow ul li strong {
        width: 220px;
        font-size: 1em;
        text-align: left;
        /**display: inline-block;
        font-weight: 500;
        line-height: 170%;**/
    }

    #flow ul li p {
        /**font-family: "Noto Sans JP", sans-serif;**/
        font-size: 73%;
        /**font-weight: 400;
        line-height: 200%;**/
    }

    #flow .triangle {
        width: 43px;
        height: 28px;
        margin: 10px auto;
    }
    /** ▲▲▲▲▲▲ flow ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ support ▼▼▼▼▼▼ **/
    #support {
        margin: 0 auto;
        padding: 80px 0 0 0;
    }

    #support p {
        width: 95%;
        margin: 15px auto 0 auto;
        font-size: 85%;
        line-height: 190%;
    }

    #support ul.common_retsu3 {
        width: 90%;
        margin: 50px auto 0 auto;
        flex-direction: column;
    }

    #support ul.common_retsu3 li:nth-child(2) {
        width: 96%;
    }

    #support ul.common_retsu3 li:nth-child(n+2) {
        margin: 40px 0 0 0;
    }

    #support ul.common_retsu3 li:nth-child(1) {
        background: url(../images/img_support_01.svg) no-repeat 2% center / 18%;
    }

    #support ul.common_retsu3 li:nth-child(2) {
        background: url(../images/img_support_02.svg) no-repeat 2% center / 18%;
    }

    #support ul.common_retsu3 li:nth-child(3) {
        background: url(../images/img_support_03.svg) no-repeat 2% center / 18%;
    }

    #support ul.common_retsu3 li {
        width: 96%;
        padding: 2%;
        display: flex;
        justify-content: flex-end;
    }

    #support ul.common_retsu3 li img {
        display: none;
    }
    
    #support ul.common_retsu3 li h5 {
        width: 80%;
        margin: 0;
        font-size: 105%;
        text-align: left;
    }
    
    #support ul.common_retsu3 li h6 {
        width: 80% !important;
        margin: 10px 0 0 0;
        text-align: left;
        font-size: 90%;
    }
    
    #support ul.common_retsu3 li p {
        width: 80%!important;
        margin: 5px 0 0 0;
        font-size: 85%;
    }
    /** ▲▲▲▲▲▲ support ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ case ▼▼▼▼▼▼ **/
    #case {
        margin: 70px auto 0 auto;
        padding: 70px 0 30px 0;
    }

    #case ul.common_retsu3 {
        margin: 30px auto 0 auto;
    }

    #case ul.common_retsu3 li {
        width: 94%;
        padding: 3%;
        justify-content: flex-start;
    }

    #case ul.common_retsu3 li img {
        width: 100%;
        height: auto;
    }

    #case ul.common_retsu3 li:nth-child(2) {
        width: 94%;
    }

    #case ul.common_retsu3 h5 {
        width: initial;
        margin: 23px 0 0 0;
        padding: 4px 9px;
        display: inline-block;
        font-size: 75%;
    }

    #case ul.common_retsu3 h6 {
        font-size: 91%;
    }

    #case ul.common_retsu3 div {
        font-size: 66%;
        padding: 3px 5px;
    }
    /** ▲▲▲▲▲▲ case ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ seminar ▼▼▼▼▼▼ **/
    #seminar {
        margin: 0 auto;
        padding: 80px 0 0 0;
    }

    #seminar ul.webinar {
        width: 90%;
        height: 100%;
        padding: 4% 0 3% 0;
        align-items: center;
        justify-content: center;
        /**background: #F3F3F3 url(../images/img_seminar_01.png) no-repeat 7% 7% / 30%;**/
        background: #FFAF00;
    }

    #seminar ul.webinar li {
        display: flex;
        justify-content: center;
        flex-direction: column;
        width: 95%;
    }

    #seminar ul.webinar li h4 {
        margin: 0;
        padding: 0 0 0 40%;
        font-size: 100%;
        line-height: 150%;
    }

    #seminar ul.webinar li ul {
        width: 90%;
        margin: 13% auto 0 auto;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    #seminar ul.webinar li ul li:nth-child(even) {
        width: 80%;
    }

    #seminar ul.webinar li ul li {
        font-size: 80%;
        line-height: 180%;
    }

    #seminar ul.webinar li a.contact {
        margin: 25px auto 0 auto !important;
        width: 90%;
        height: 40px;
        font-size: 90%;
    }

    #seminar ul.seminar:nth-child(3) {
        margin: 20px auto 0 auto;
        background: url(../images/img_seminar_02.png) no-repeat bottom 10px left 10px / 20%;
    }

    #seminar ul.seminar:nth-child(4) {
        margin: 30px auto 0 auto;
        background: url(../images/img_seminar_03.svg) no-repeat 20px 10px / 20%;
    }

    #seminar ul.seminar {
        width: 90%;
        padding: 25px 0;
        justify-content: center;
    }

    #seminar ul.seminar h4 {
        font-size: 100%;
        text-align: center;
    }

    #seminar ul.seminar h5 {
        margin: 15px 0 0 0;
        font-size: 100%;
        text-align: center;
    }

    #seminar ul.seminar p {
        width: 85%;
        margin: 20px auto 0 auto;
        font-size: 80%;
        text-align: center;
    }

    #seminar ul.seminar p span {
        margin: 35px 0 0 22%;
        text-align: left;
    }
    /** ▲▲▲▲▲▲ seminar ▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼ topics ▼▼▼▼▼▼ **/
    #topics {
        margin: 0 auto;
        padding: 80px 0 0 0;
    }

    #topics ul:nth-child(2) {
        margin: 30px auto 0 auto;
        border-top: #000000 solid 1px;
    }

    #topics ul {
        width: 90%;
        height: auto;
        padding: 15px 0;
        flex-direction: column;
    }

    #topics ul li:nth-child(1) {
        width: 100%;
        font-size: 75%;
    }

    #topics ul li:nth-child(2) {
        width: 100%;
        margin: 10px 0 0 0;
        font-size: 75%;
        line-height: 170%;
    }

    #topics ul li div {
        height: auto;
        margin: 0 0 0 10px;
        padding: 2px 5px;
        font-size: 70%;
    }
    /** ▲▲▲▲▲▲ topics ▲▲▲▲▲▲ **/
}