/**************** PAGE INDEX ****************//**************** PAGE INDEX ****************//**************** PAGE INDEX ****************/

#page.index {}
#page.index .scrollpad {width: 100%; overflow: hidden;}

#page.index .main-section {width: 100%; padding: 66px 18px 72px 18px;}
#page.index .main-section .text-box {width: 50%; padding: 0px 0px 0px 48px;}
#page.index .main-section .text-box.help {padding: 0px 48px 0px 0px; border-right: solid 1px var(--br-grey);}
#page.index .main-section .text-box .division-name {font-weight: 700; font-size: 20px; line-height: 26px; text-align: center;}
#page.index .main-section .text-box h4 {width: 100%; padding: 12px 0px 18px 0px; font-size: 30px; line-height: 39px; text-align: center; color: var(--black);}
#page.index .main-section .text-box .list {width: 100%;}
#page.index .main-section .text-box .list .li {width: 100%; max-width: 460px; padding: 0px 0px 12px 0px; font-weight: 400; font-size: 18px; line-height: 24px; text-align: center; color: var(--black);}
#page.index .main-section .text-box .list .li i {color: var(--main);}
#page.index .main-section .text-box.help .list .li i {color: var(--green);}
#page.index .main-section .text-box .more-box {padding: 24px 0px 0px 0px;}

#page.index .page-section {padding-bottom: 36px;}
#page.index .page-bottom-text {margin: 0px 0px 0px 0px !important; padding-bottom: 0px;}

@media screen and (max-width: 1600px) {
    #page.index .main-section .text-box h4 {max-width: 420px;}
}

@media screen and (max-width: 1300px) {
    #page.index .main-section .text-box {padding: 0px 0px 0px 24px;}
    #page.index .main-section .text-box.help {padding: 0px 24px 0px 0px;}
}

@media screen and (max-width: 750px) {
    #page.index .main-section {width: 100%; padding: 30px 18px 72px 18px;}
    #page.index .main-section .text-box {width: 100%; padding: 0px 0px 0px 0px;}
    #page.index .main-section .text-box.help {padding: 0px 0px 60px 0px; border-right: none;}
    #page.index .main-section .text-box h1 {font-size: 24px; line-height: 33px;}
    #page.index .main-section .text-box .list .li {font-size: 16px; line-height: 22px;}
}



/**************** PAGE HELP ONLINE ****************//**************** PAGE HELP ONLINE ****************//**************** PAGE HELP ONLINE ****************/

#page.help-online {}
#page.help-online .scrollpad {width: 100%; overflow: hidden;}


#page.help-online .main-section {
    align-items: center; -webkit-align-items: center; align-content: center; -webkit-align-content: center;
    width: 100%; padding: 90px 18px 90px 18px;
}

#page.help-online .main-section .text-box {width: 65%; padding: 0px 36px 0px 0px;}
#page.help-online .main-section .text-box h1 {width: 100%; padding: 0px 0px 24px 0px; font-size: 30px; line-height: 39px; color: var(--black);}
#page.help-online .main-section .text-box h2 {width: 100%; padding: 0px 0px 24px 0px; font-size: 30px; line-height: 39px; color: var(--black);}
#page.help-online .main-section .text-box .sub {width: 100%; padding: 0px 0px 18px 0px; font-weight: 700; font-size: 24px; line-height: 33px; color: var(--green);}
#page.help-online .main-section .text-box .li {width: 100%; padding: 0px 0px 18px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--grey);}
#page.help-online .main-section .text-box .li span {color: var(--green);}
#page.help-online .main-section .text-box .bbox {width: 100%; padding: 24px 0px 0px 0px;}
#page.help-online .main-section .main-img-box {width: 70%; margin: 0px -35% 0px 0px;}
#page.help-online .main-section .main-img-pad {width: 100%; padding-top: 58.06451%;}
#page.help-online .main-section .main-img-box img {display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
#page.help-online .main-section .main-img-box img.sub-img {top: 5%; width: auto; height: 80%;}


@media screen and (max-width: 1000px) {
    #page.help-online .main-section {padding: 54px 18px 60px 18px;}
    #page.help-online .main-section .text-box {width: 100%; padding: 0px 0px 48px 0px; text-align: center;}
    #page.help-online .main-section .text-box .text {padding: 0px 0px 24px 0px;}
    #page.help-online .main-section .text-box .bbox {justify-content: center; -webkit-justify-content: center;}
    #page.help-online .main-section .main-img-box {width: 80%; margin: 0px 7.5% 0px 12.5%;}
}

@media screen and (max-width: 750px) {
    #page.help-online .main-section {padding: 30px 18px 48px 18px;}
    #page.help-online .main-section .text-box h1 {font-size: 24px; line-height: 33px;}
    #page.help-online .main-section .text-box .sub {width: 100%; padding: 0px 0px 12px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--green);}
    #page.help-online .main-section .text-box .li {width: 100%; padding: 0px 0px 12px 0px; font-weight: 700; font-size: 16px; line-height: 22px; color: var(--grey);}
    #page.help-online .main-section .main-img-box {width: 97.5%; margin: 0px 0% 0px 2.5%;}
}



#page.help-online .psyhos-section {padding: 54px 18px 60px 18px;}
#page.help-online .psyhos-section:after {content: ''; display: block; position: absolute; top: 0px; left: 18px; right: 18px; height: 1px; background-color: var(--br-grey);}
#page.help-online .psyhos-section .main-box {width: 100%;}
#page.help-online .psyhos-section .main-box .ttl {width: 100%; padding: 0px 0px 48px 0px; color: var(--black);}
#page.help-online .psyhos-section .main-box .ttl h2 {font-size: 30px; line-height: 39px; text-align: center;}
#page.help-online .psyhos-section .main-box .psyhos-list {}
#page.help-online .psyhos-section .main-box .psyhos-list .mbox {margin: -12px;}
#page.help-online .psyhos-section .main-box .psyhos-list .lipad {width: 16.666666%; max-width: 270px; padding: 12px;}
#page.help-online .psyhos-section .main-box .psyhos-list .psyho {display: block; position: relative; width: 100%; padding-top: 100%; background: var(--white); border-radius: 12px; overflow: hidden; box-sizing: border-box;}
#page.help-online .psyhos-section .main-box .psyhos-list .psyho img {display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: cover;}
#page.help-online .psyhos-section .main-box .psyhos-list .psyho .flex-acenter {position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
#page.help-online .psyhos-section .main-box .psyhos-list .psyho .flex-acenter b {display: block; width: 100%; font-weight: 800; font-size: 40px; line-height: 42px; text-align: center; color: var(--green);}
#page.help-online .psyhos-section .main-box .psyhos-list .psyho .flex-acenter b.all {margin-bottom: 18px; font-weight: 700; font-size: 20px; line-height: 26px;}

#page.help-online .psyhos-section .list-box {width: 100%; padding: 60px 0px 0px 0px;}
#page.help-online .psyhos-section .list-box .lipad {width: 25%; max-width: 360px; padding: 0px 24px 24px 24px;}
#page.help-online .psyhos-section .list-box .li {padding: 0px 0px 0px 42px;}
#page.help-online .psyhos-section .list-box .li .fa-badge-check {display: block; position: absolute; top: 0px; left: 0px; width: 30px; height: 30px; font-size: 30px; line-height: 30px; text-align: center; color: var(--green);}
#page.help-online .psyhos-section .list-box .li .number {display: block; position: absolute; top: 0px; left: 0px; width: 30px; height: 30px; font-size: 30px; line-height: 30px; text-align: center; color: var(--green);}
#page.help-online .psyhos-section .list-box .li .lttl {padding: 2px 0px 6px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--black);}
#page.help-online .psyhos-section .list-box .li .ltxt {font-size: 16px; line-height: 22px; color: var(--black);}

#page.help-online .psyhos-section .more-box {width: 100%; padding: 24px 0px 0px 0px;}

#page.help-online .psyhos-section .bottom-box {width: 100%; padding: 36px 0px 0px 0px; text-align: center;}
#page.help-online .psyhos-section .bottom-box .ttl {width: 100%; padding: 2px 0px 6px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--black);}
#page.help-online .psyhos-section .bottom-box .txt {width: 100%; max-width: 720px; font-size: 16px; line-height: 22px; color: var(--black);}


@media screen and (max-width: 1400px) {
    #page.help-online .psyhos-section .list-box .lipad {width: 50%;}
}

@media screen and (max-width: 1300px) {
    #page.help-online .psyhos-section .list-box .lipad {width: 25%;}
}

@media screen and (max-width: 1000px) {
    #page.help-online .psyhos-section {padding: 48px 18px 48px 18px;}
    #page.help-online .psyhos-section .list-box .lipad {width: 50%;}
}

@media screen and (max-width: 750px) {
    #page.help-online .psyhos-section {padding: 30px 18px 30px 18px;}
    #page.help-online .psyhos-section .main-box .ttl {padding: 0px 0px 24px 0px;}
    #page.help-online .psyhos-section .main-box .ttl h2 {font-size: 24px; line-height: 33px;}
    #page.help-online .psyhos-section .main-box .psyhos-list .mbox {margin: -6px;}
    #page.help-online .psyhos-section .main-box .psyhos-list .lipad {width: 33.333333%; padding: 6px;}
    #page.help-online .psyhos-section .list-box {padding: 36px 0px 0px 0px;}
    #page.help-online .psyhos-section .list-box .lipad {width: 100%; max-width: 100%; padding: 0px 0px 24px 12px;}
}



#page.help-online .steps-section {padding: 54px 18px 60px 18px;}
#page.help-online .steps-section:after {content: ''; display: block; position: absolute; top: 0px; left: 18px; right: 18px; height: 1px; background-color: var(--br-grey);}
#page.help-online .steps-section .main-box {width: 100%;}
#page.help-online .steps-section .main-box .ttl {width: 100%; padding: 0px 0px 48px 0px; color: var(--black);}
#page.help-online .steps-section .main-box .ttl h2 {font-size: 30px; line-height: 39px; text-align: center;}

#page.help-online .steps-section .list-box {width: 100%; padding: 0px 0px 0px 0px;}
#page.help-online .steps-section .list-box .lipad {width: 25%; max-width: 360px; padding: 0px 24px 24px 24px;}
#page.help-online .steps-section .list-box .li {padding: 0px 0px 0px 42px;}
#page.help-online .steps-section .list-box .li .number {display: block; position: absolute; top: 0px; left: 0px; width: 30px; height: 30px; font-weight: 700; font-size: 30px; line-height: 30px; text-align: center; color: var(--green);}
#page.help-online .steps-section .list-box .li .lttl {padding: 2px 0px 6px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--black);}
#page.help-online .steps-section .list-box .li .ltxt {font-size: 16px; line-height: 22px; color: var(--black);}

#page.help-online .steps-section .more-box {width: 100%; padding: 24px 0px 0px 0px;}


@media screen and (max-width: 1400px) {
    #page.help-online .steps-section .list-box .lipad {width: 50%;}
}

@media screen and (max-width: 1300px) {
    #page.help-online .steps-section .list-box .lipad {width: 25%;}
}

@media screen and (max-width: 1000px) {
    #page.help-online .steps-section {padding: 48px 18px 48px 18px;}
    #page.help-online .steps-section .list-box .lipad {width: 50%;}
}

@media screen and (max-width: 750px) {
    #page.help-online .steps-section {padding: 30px 18px 42px 18px;}
    #page.help-online .steps-section .main-box .ttl {padding: 0px 0px 24px 0px;}
    #page.help-online .steps-section .main-box .ttl h2 {font-size: 24px; line-height: 33px;}
    #page.help-online .steps-section .main-box .psyhos-list .mbox {margin: -6px;}
    #page.help-online .steps-section .main-box .psyhos-list .lipad {width: 33.333333%; padding: 6px;}
    #page.help-online .steps-section .list-box .lipad {width: 100%; max-width: 100%; padding: 0px 0px 24px 12px;}
    #page.help-online .steps-section .more-box {width: 100%; padding: 12px 0px 0px 0px;}
}



#page.help-online .imgs-section {padding: 54px 18px 60px 18px;}
#page.help-online .imgs-section:after {content: ''; display: block; position: absolute; top: 0px; left: 18px; right: 18px; height: 1px; background-color: var(--br-grey);}
#page.help-online .imgs-section .ttl {padding: 0px 0px 24px 0px; color: var(--black);}
#page.help-online .imgs-section .ttl h2 {font-size: 30px; line-height: 39px; text-align: center;}
#page.help-online .imgs-section .mbox {margin: 0px -18px 0px -18px;}
#page.help-online .imgs-section .lipad {width: 25%; padding: 0px 18px 0px 18px;}
#page.help-online .imgs-section .img-li {width: 100%;}
#page.help-online .imgs-section .img-pad {width: 100%; padding-top: 100%; overflow: hidden;}
#page.help-online .imgs-section .img-pad img.img {display: block; position: absolute; top: 0px; left: 0%; width: 100%; height: 100%;}
#page.help-online .imgs-section .img-txt {width: 100%; min-height: 48px; font-weight: 700; font-size: 18px; line-height: 24px; text-align: center; color: var(--black);}
#page.help-online .imgs-section .img-txt span {display: block; max-width: 100%;}
#page.help-online .imgs-section .bbox {width: 100%; padding: 54px 0px 0px 0px;}


@media screen and (max-width: 1500px) {
    #page.help-online .imgs-section .img-txt {min-height: 48px; font-size: 18px; line-height: 24px;}
}

@media screen and (max-width: 1000px) {
    #page.help-online .imgs-section {padding: 54px 18px 54px 18px;}
    #page.help-online .imgs-section .lipad {width: 33.333333%;}
}

@media screen and (max-width: 750px) {
    #page.help-online .imgs-section {padding: 30px 18px 42px 18px;}
    #page.help-online .imgs-section .ttl h2 {font-size: 24px; line-height: 33px;}
    #page.help-online .imgs-section .bbox {width: 100%; padding: 30px 0px 0px 0px;}
}

@media screen and (max-width: 500px) {
    #page.help-online .imgs-section .lipad {width: 50%;}
    #page.help-online .imgs-section .img-txt {min-height: 40px; font-weight: 400; font-size: 14px; line-height: 20px;}
}



#page.help-online .faq-lnk-section {padding: 0px 18px 0px 18px;}
#page.help-online .faq-lnk-section .border {padding: 54px 0px 54px 0px; border-top: solid 1px var(--br-grey); border-bottom: solid 1px var(--br-grey);}
#page.help-online .faq-lnk-section .ttl {width: 100%; padding: 0px 0px 24px 0px; font-size: 30px; line-height: 39px; text-align: center; color: var(--black);}
#page.help-online .faq-lnk-section .txt {width: 100%; padding: 0px 0px 0px 0px; font-weight: 700; font-size: 20px; line-height: 26px; text-align: center; color: var(--black);}


@media screen and (max-width: 750px) {
    #page.help-online .faq-lnk-section .border {padding: 30px 0px 30px 0px;}
    #page.help-online .faq-lnk-section .ttl {font-size: 24px; line-height: 33px;}
}



#page.help-online .articles-section {padding: 54px 18px 30px 18px;}
#page.help-online .articles-section .border {border-bottom: solid 1px var(--br-grey);}
#page.help-online .articles-section .ttl {width: 100%; padding: 0px 0px 48px 0px; color: var(--black);}
#page.help-online .articles-section .ttl h4 {font-size: 30px; line-height: 39px; text-align: center;}
#page.help-online .articles-section .page-content-list {padding: 0px 0px 0px 0px;}
#page.help-online .articles-section .page-content-list .swiper {padding: 0px 0px 36px 0px;}


@media screen and (max-width: 750px) {
    #page.help-online .articles-section {padding: 30px 18px 0px 18px;}
    #page.help-online .articles-section .ttl h4 {font-size: 24px; line-height: 33px;}
    #page.help-online .articles-section .ttl {padding: 0px 0px 24px 0px;}
}




/**************** PAGE EMERGENCY HELP ****************//**************** PAGE EMERGENCY HELP ****************//**************** PAGE EMERGENCY HELP ****************/

.helpline-list-box {width: 100%; padding: 0px 0px 60px 0px;}
.helpline-list-box .helpline-ttl {padding: 0px 0px 6px 0px; font-weight: 700; font-size: 20px; line-height: 26px; text-align: center; color: var(--black);}
.helpline-list-box .helpline-text {padding: 0px 0px 18px 0px; font-weight: 400; font-size: 14px; line-height: 20px; text-align: center; color: var(--black);}
.helpline-list-box .helpline-list {width: 100%;}
.helpline-list-box .helpline-list .margin-box {margin: -18px;}
.helpline-list-box .helpline-pad {width: 33.333333%; padding: 18px;}
.helpline-list-box .helpline-box {margin: 0px; padding: 18px 18px 18px 18px; font-weight: 700; font-size: 18px; line-height: 24px; text-align: center; color: var(--black);}
.helpline-list-box .helpline-box .phone {padding: 12px 18px 0px 18px; font-weight: 800; font-size: 20px; line-height: 26px;}
.helpline-list-box .helpline-box .phone a {color: var(--orange);}


@media screen and (max-width: 900px) {
    .helpline-list-box .helpline-list .margin-box {margin: -12px;}
    .helpline-list-box .helpline-pad {width: 50%; padding: 12px;}
}

@media screen and (max-width: 650px) {
    .helpline-list-box .helpline-list .margin-box {margin: -9px;}
    .helpline-list-box .helpline-pad {width: 100%; padding: 9px;}
}







/**************** PAGE HELP SUPERVISION ****************//**************** PAGE HELP SUPERVISION ****************//**************** PAGE HELP SUPERVISION ****************/

#page.help-supervision {}
#page.help-supervision .scrollpad {width: 100%; overflow: hidden;}


#page.help-supervision .main-section {
    align-items: center; -webkit-align-items: center; align-content: center; -webkit-align-content: center;
    width: 100%; padding: 90px 18px 90px 18px;
}

#page.help-supervision .main-section .text-box {width: 60%; padding: 0px 36px 0px 0px;}
#page.help-supervision .main-section .text-box h1 {width: 100%; padding: 0px 0px 12px 0px; font-size: 30px; line-height: 39px; color: var(--black);}
#page.help-supervision .main-section .text-box .sub {width: 100%; padding: 0px 0px 18px 0px; font-weight: 700; font-size: 24px; line-height: 33px; color: var(--green);}
#page.help-supervision .main-section .text-box .li {width: 100%; padding: 0px 0px 18px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--grey);}
#page.help-supervision .main-section .text-box .li:last-child {padding: 0px 0px 0px 0px !important;}
#page.help-supervision .main-section .text-box .li span {color: var(--green);}
#page.help-supervision .main-section .main-img-box {width: 40%; padding-top: 1.5%;}
#page.help-supervision .main-section .main-img-pad {width: 100%; padding-top: 70%;}
#page.help-supervision .main-section .main-img-box img {display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
#page.help-supervision .main-section .main-img-box img.sub-img {top: 5%; width: auto; height: 80%;}


@media screen and (max-width: 1000px) {
    #page.help-supervision .main-section {padding: 54px 18px 54px 18px;}
    #page.help-supervision .main-section .text-box {width: 100%; padding: 0px 0px 48px 0px; text-align: center;}
    #page.help-supervision .main-section .text-box .text {padding: 0px 0px 24px 0px;}
    #page.help-supervision .main-section .main-img-box {width: 80%; margin: 0px 10% 0px 10%; padding: 0% !important;}
}

@media screen and (max-width: 750px) {
    #page.help-supervision .main-section {padding: 30px 18px 30px 18px;}
    #page.help-supervision .main-section .text-box {padding: 0px 0px 24px 0px;}
    #page.help-supervision .main-section .text-box h1 {padding: 0px 0px 6px 0px; font-size: 24px; line-height: 33px;}
    #page.help-supervision .main-section .text-box .sub {width: 100%; padding: 0px 0px 12px 0px; font-weight: 700; font-size: 20px; line-height: 26px; color: var(--green);}
    #page.help-supervision .main-section .text-box .li {width: 100%; padding: 0px 0px 12px 0px; font-weight: 700; font-size: 16px; line-height: 22px; color: var(--grey);}
}



#page.help-supervision .supervisors-section {padding: 0px 18px 60px 18px;}
#page.help-supervision .supervisors-section .main-box {width: 100%;}
#page.help-supervision .supervisors-section .main-box .ttl {width: 100%; padding: 0px 0px 48px 0px; color: var(--black);}
#page.help-supervision .supervisors-section .main-box .ttl h2 {font-size: 30px; line-height: 39px; text-align: center;}
#page.help-supervision .supervisors-section .main-box .supervisors-list {}
#page.help-supervision .supervisors-section .main-box .supervisors-list .mbox {margin: -12px;}
#page.help-supervision .supervisors-section .main-box .supervisors-list .lipad {width: 25%; padding: 12px;}

#page.help-supervision .supervisors-section .supervisor {display: block; position: relative; padding: 18px 0px 0px 0px; box-sizing: border-box;}
#page.help-supervision .supervisors-section .supervisor span {display: block; position: relative; box-sizing: border-box;}
#page.help-supervision .supervisors-section .supervisor .cbox {margin: 0px !important; padding: 18px 18px 18px 18px; cursor: pointer; box-sizing: border-box;}
#page.help-supervision .supervisors-section .supervisor .cbox .img-box {width: 100%; margin-top: -36px; transform: translate(0px,0px); transition: transform ease 240ms; overflow: hidden;}
#page.help-supervision .supervisors-section .supervisor .cbox .img-box .img {width: 100%; padding-top: 100%; border-radius: 12px; overflow: hidden;}
#page.help-supervision .supervisors-section .supervisor .cbox .img-box .img img {display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: cover;}
#page.help-supervision .supervisors-section .supervisor:hover .cbox .img-box {transform: translate(0px,-6px);}

#page.help-supervision .supervisors-section .supervisor .cbox .txt {padding: 12px 0px 0px 0px;}
#page.help-supervision .supervisors-section .supervisor .cbox .txt .name {max-width: 100%; font-size: 18px; line-height: 25px; text-align: center; color: var(--black);}
#page.help-supervision .supervisors-section .supervisor .cbox .txt .methods {width: 100%; padding: 6px 0px 12px 0px; font-size: 14px; line-height: 20px; text-align: center; color: var(--grey);}

#page.help-supervision .supervisors-section .supervisor .cbox .price-box {
    display: flex; display: -webkit-flex; flex-direction: row; -webkit-flex-direction: row; flex-wrap: nowrap; -webkit-flex-wrap: nowrap;
    justify-content: space-between; -webkit-justify-content: space-between; align-items: flex-start; -webkit-align-items: flex-start; align-content: flex-start; -webkit-align-content: flex-start;
    width: 100%; margin: 0px 0px -5px 0px; border-top: solid 1px var(--br-grey);
}
#page.help-supervision .supervisors-section .supervisor .cbox .ptxt {padding: 12px 0px 0px 0px; font-size: 10px; line-height: 16px; text-transform: uppercase; letter-spacing: 1px; color: var(--grey);}
#page.help-supervision .supervisors-section .supervisor .cbox .pval {padding: 12px 0px 0px 0px; font-weight: 700; font-size: 24px; line-height: 32px; color: var(--black);}


@media screen and (max-width: 1400px) {
    #page.help-supervision .supervisors-section .main-box .supervisors-list .lipad {width: 33.333333%;}
}

@media screen and (max-width: 1300px) {
    #page.help-supervision .supervisors-section .main-box .supervisors-list .lipad {width: 25%;}
}

@media screen and (max-width: 1000px) {
    #page.help-supervision .supervisors-section {padding: 48px 18px 48px 18px;}
    #page.help-supervision .supervisors-section .main-box .supervisors-list .lipad {width: 33.333333%;}
}

@media screen and (max-width: 800px) {
    #page.help-supervision .supervisors-section .main-box .supervisors-list .lipad {width: 50%;}
}

@media screen and (max-width: 750px) {
    #page.help-supervision .supervisors-section {padding: 30px 18px 30px 18px;}
    #page.help-supervision .supervisors-section .main-box .ttl {padding: 0px 0px 24px 0px;}
    #page.help-supervision .supervisors-section .main-box .ttl h2 {font-size: 24px; line-height: 33px;}
}

@media screen and (max-width: 500px) {
    #page.help-supervision .supervisors-section .main-box .supervisors-list .lipad {width: 100%;}
}


























/**************** PAGE FOR PSYCHOLOGISTS ****************//**************** PAGE FOR PSYCHOLOGISTS ****************//**************** PAGE FOR PSYCHOLOGISTS ****************/

#page.for-psychologists {}
#page.for-psychologists article.article.nobg {max-width: 660px; margin: -6px auto 0px auto; padding: 0px 36px 18px 36px;}
#page.for-psychologists article.article.nobg p.list {padding-bottom: 6px;}
#page.for-psychologists .from-btn-box {padding: 0px 0px 36px 0px;}
#page.for-psychologists .section-ttl {margin-top: 36px; padding: 21px 0px 24px 0px; font-size: 30px; line-height: 39px; text-align: center; color: var(--black); border-top: solid 1px var(--br-grey);}
#page.for-psychologists .section-ttl.no-border {margin-top: 0px; padding: 27px 0px 24px 0px; border-top: none;}


@media screen and (max-width: 750px) {
    #page.for-psychologists article.article.nobg {padding: 0px 0px 18px 0px;}
    #page.for-psychologists .section-ttl {font-size: 24px; line-height: 33px;}
}



/**************** PAGE RESEARCH PROMO ****************//**************** PAGE RESEARCH PROMO ****************//**************** PAGE RESEARCH PROMO ****************/

#page.research-promo section {padding: 36px 18px 36px 18px;}

#page.research-promo .section-ttl {padding: 21px 0px 24px 0px; color: var(--black); border-top: solid 1px var(--br-grey);}
#page.research-promo .section-ttl.center {text-align: center;}
#page.research-promo .section-ttl h4 {font-size: 30px; line-height: 39px;}
#page.research-promo .section-ttl.mini {padding: 15px 0px 18px 0px;}
#page.research-promo .section-ttl.mini h4 {font-size: 21px; line-height: 28px;}


@media screen and (max-width: 750px) {
    #page.research-promo .section-ttl {padding: 21px 0px 24px 0px;}
    #page.research-promo .section-ttl h4 {font-size: 24px; line-height: 30px;}
    #page.research-promo .section-ttl .btn {display: none !important;}
    #page.research-promo .section-ttl .btn.mobi {display: flex !important;}
}



/*** PROMO SECTION ***/

#page.research-promo .promo-section {padding-top: 0px;}
#page.research-promo .promo-section .promo-menu {padding: 12px 0px 12px 0px; border-top: solid 1px var(--br-grey); border-bottom: solid 1px var(--br-grey);}
#page.research-promo .promo-section .promo-menu .mbox {margin: 0px -12px 0px -12px;}
#page.research-promo .promo-section .promo-menu .btn {margin: 0px 24px 0px 24px;}
#page.research-promo .promo-section .promo-menu .btn.mobi {display: none !important;}
#page.research-promo .promo-section .promo-list {padding: 36px 0px 0px 0px;}
#page.research-promo .promo-section .promo-list-box {width: 50%; padding: 0px 0px 0px 36px;}
#page.research-promo .promo-section .promo-list-box:first-child {padding: 0px 36px 0px 0px; border-right: solid 1px var(--br-grey);}

#page.research-promo .promo-section .promo-list-title {width: 100%; padding: 0px 0px 18px 0px; font-size: 21px; line-height: 28px; text-align: center; color: var(--black);}
#page.research-promo .promo-section .promo-list-box .mbox {margin: 0px -18px -12px -18px;}
#page.research-promo .promo-section .promo-list-box .lipad {width: 50%; padding: 12px 18px 12px 18px;}
#page.research-promo .promo-section .promo-list-box .lipad .li {width: 100%; padding: 0px 0px 0px 30px;}
#page.research-promo .promo-section .promo-list-box .lipad .li i {
    display: block; position: absolute; top: 0px; left: 0px; width: 20px; height: 20px;
    font-size: 20px; line-height: 20px; text-align: center; color: var(--green);
}
#page.research-promo .promo-section .promo-list-box:first-child .lipad .li i {color: var(--purple);}
#page.research-promo .promo-section .promo-list-box .lipad .li p {font-size: 16px; line-height: 22px;}
#page.research-promo .promo-section .promo-list-bbox {width: 100%; padding: 48px 0px 0px 0px;}
#page.research-promo .promo-section .promo-list-bbox .mobi {display: none !important;}


@media screen and (max-width: 1000px) {
    #page.research-promo .promo-section .promo-title {font-size: 24px; line-height: 33px;}
    #page.research-promo .promo-section .promo-menu .btn {margin: 0px 12px 0px 12px;}
    #page.research-promo .promo-section .promo-menu .btn.nomobi {display: none !important;}
    #page.research-promo .promo-section .promo-menu .btn.mobi {display: flex !important;}
    #page.research-promo .promo-section .promo-list {padding: 0px 0px 0px 0px;}
    #page.research-promo .promo-section .promo-list-box {width: 100% !important; padding: 36px 0px 0px 0px;}
    #page.research-promo .promo-section .promo-list-box:first-child {padding: 36px 0px 36px 0px; border-right: none; border-bottom: solid 1px var(--br-grey-mdark);}
}

@media screen and (max-width: 600px) {
    #page.research-promo .promo-section .promo-list-box .lipad {width: 100% !important;}
}



/*** TARRIFS SECTION ***/

#page.research-promo .tariffs-section {width: 100%;}
#page.research-promo .tariffs-section .mbox {margin: 0px -12px -24px -12px;}
#page.research-promo .tariffs-section .slider-box {width: 100%;}
#page.research-promo .tariffs-section .slider-line {width: 100%;}
#page.research-promo .tariffs-section .lipad {width: 25%; padding: 0px 12px 24px 12px;}
#page.research-promo .tariffs-section .tariff-li {padding: 0px 0px 0px 0px; text-align: center; overflow: hidden;}
#page.research-promo .tariffs-section .tariff-li .cbox-ttl.green {background-color: var(--bg-green);}
#page.research-promo .tariffs-section .tariff-li .cbox-ttl.orange {background-color: var(--bg-orange);}
#page.research-promo .tariffs-section .tariff-li .cbox-ttl.purple {background-color: var(--bg-purple);}
#page.research-promo .tariffs-section .tariff-li .cbox-ttl.pink {background-color: var(--bg-pink);}
#page.research-promo .tariffs-section .tariff-li .box {
    display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; flex-wrap: nowrap; -webkit-flex-wrap: nowrap;
    justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; align-content: center; -webkit-align-content: center;
    
    min-height: 90px; padding: 12px 4px 12px 6px;
}
#page.research-promo .tariffs-section .tariff-li .box .ttl {font-weight: 700; font-size: 12px; line-height: 18px; text-transform: uppercase; letter-spacing: 1px; color: var(--grey-ow);}
#page.research-promo .tariffs-section .tariff-li .box .val {font-weight: 700; font-size: 20px; line-height: 26px;}
#page.research-promo .tariffs-section .tariff-li .box .com {font-size: 14px; line-height: 20px; color: var(--grey-ow);}

#page.research-promo .tariffs-section .tariff-li .box.price {padding: 24px 24px 24px 24px;}
#page.research-promo .tariffs-section .tariff-li .box.price .val {font-size: 24px; line-height: 30px;}
#page.research-promo .tariffs-section .tariff-li .box.price .btn {margin: 24px 0px 0px 0px;}

#page.research-promo .tariffs-section .tariff-li .box:nth-child(2n+1) {background-color: var(--bg-grey-light);}
#page.research-promo .tariffs-section .tariff-li .box:nth-child(2n+1) .ttl {color: var(--grey);}
#page.research-promo .tariffs-section .tariff-li .box:nth-child(2n+1) .com {color: var(--grey);}


@media screen and (max-width: 1000px) {
    #page.research-promo .tariffs-section .mbox {margin: 0px -24px -24px -24px;}
    #page.research-promo .tariffs-section .slider-box {overflow-x: scroll;}
    #page.research-promo .tariffs-section .slider-line {width: 1200px; padding: 0px 12px 0px 12px;}
}

@media screen and (max-width: 500px) {
    #page.research-promo .tariffs-section .slider-line {width: 360%;}
}



/*** HELP SECTION ***/

#page.research-promo .help-section {flex-wrap: nowrap; -webkit-flex-wrap: nowrap;}
#page.research-promo .help-section .faq-list {flex: 1 1 auto; -webkit-flex: 1 1 auto; padding: 0px 0px 0px 0px;}
#page.research-promo .help-section .faq-list .faq-box {max-width: 100% !important;}
#page.research-promo .help-section .faq-list .faq-box:last-child {margin: 0px !important;}

#page.research-promo .help-section .science-list {width: 396px; padding: 0px 0px 0px 36px;}
#page.research-promo .help-section .science-list .lipad {width: 100%; padding: 0px 0px 24px 0px;}
#page.research-promo .help-section .science-list .bbox {padding: 12px 0px 0px 0px;}


@media screen and (max-width: 1000px) {
    #page.research-promo .help-section {flex-wrap: wrap; -webkit-flex-wrap: wrap;}
    #page.research-promo .help-section .faq-list {width: 100%; padding: 0px 0px 72px 0px;}
    #page.research-promo .help-section .science-list {width: 100%; padding: 0px 0px 0px 0px;}
}



/*** REVIEWS SECTION ***/

#page.research-promo .reviews-section .mbox {margin: -24px -24px -24px -24px;}
#page.research-promo .reviews-section .lipad {width: 50%; padding: 24px 24px 24px 24px;}
#page.research-promo .reviews-section .review-li {padding: 0px 0px 0px 0px;}
#page.research-promo .reviews-section .review-li .iname {flex-wrap: nowrap; -webkit-flex-wrap: nowrap;}
#page.research-promo .reviews-section .review-li .img {width: 120px; height: 120px; border-radius: 12px; overflow: hidden;}
#page.research-promo .reviews-section .review-li .img img {display: block; width: 100%;}
#page.research-promo .reviews-section .review-li .name-box {flex: 1 1 auto; -webkit-flex: 1 1 auto; margin: -6px 0px -6px 24px;}
#page.research-promo .reviews-section .review-li .name-box .name {display: block; padding: 0px 0px 6px 0px; font-size: 18px; line-height: 24px; color: var(--black);}
#page.research-promo .reviews-section .review-li .name-box .data {display: block; font-size: 14px; line-height: 20px; color: var(--grey);}
#page.research-promo .reviews-section .review-li .text {padding: 18px 0px 0px 0px; font-size: 16px; line-height: 22px; color: var(--black);}
#page.research-promo .reviews-section .review-li .text p {padding: 0px 0px 12px 0px;}
#page.research-promo .reviews-section .review-li .text p:last-child {padding: 0px 0px 0px 0px;}


@media screen and (max-width: 1000px) {
    #page.research-promo .reviews-section .lipad {width: 100%;}
}

@media screen and (max-width: 500px) {
    #page.research-promo .reviews-section .review-li .img {width: 90px; height: 90px;}
}



/**************** PAGE USER RESEARCH RESULT ****************//**************** PAGE RESEARCH PROMO ****************//**************** PAGE RESEARCH PROMO ****************/

#page.user-research-result .page-side {width: 280px; min-width: 280px;}

.page-user-research-result-selection-box {width: 100%; padding: 12px 12px 12px 12px;}
.page-user-research-result-selection-box {flex-wrap: nowrap; -webkit-flex-wrap: nowrap; align-items: center; -webkit-align-items: center; align-content: center; -webkit-align-content: center;}
.page-user-research-result-selection-box .name {flex: 1 1 auto; -webkit-flex: 1 1 auto; padding: 0px 12px 0px 12px;}
.page-user-research-result-selection-box .name p {max-width: 600px; padding: 9px 0px 9px 0px;}
.page-user-research-result-selection-box .name p b {display: inline; margin: 0px 6px 0px 0px; font-weight: 400; font-size: 16px; line-height: 22px;}
.page-user-research-result-selection-box .name p b:after {content: ":";}
.page-user-research-result-selection-box .name p i {display: inline; font-style: normal; font-weight: 700; font-size: 16px; line-height: 22px;}

.page-user-research-result-selection-box .resp {flex: 0 0 auto; -webkit-flex: 0 0 auto; padding: 12px 12px 12px 12px;}
.page-user-research-result-selection-box .resp .btn > b {flex: 0 0 auto; -webkit-flex: 0 0 auto; width: 36px; margin-left: 9px;}
.page-user-research-result-selection-box .bbox {flex: 0 0 auto; -webkit-flex: 0 0 auto; padding: 12px 12px 12px 12px;}
.page-user-research-result-selection-box .bbox .btn {width: 132px;}

#page.user-research-result .selection-warning {padding: 0px 24px 24px 24px; font-weight: 700; font-size: 16px; line-height: 22px; color: #FF3B30;}
#page.user-research-result .selection-warning.center {text-align: center;}
#page.user-research-result .selection-warning .bg {padding: 3px 18px 15px 18px; background-color: hsla(0,0%,96%,1); border-radius: 9px;}
#page.user-research-result .selection-warning p {padding-top: 12px;}

#page.user-research-result .selection-download {padding: 21px 0px 21px 0px; border-top: solid 1px hsla(0,0%,90%,1);}
#page.user-research-result .selection-download .btn {width: 50%; padding: 0px 24px 0px 24px; font-size: 16px; line-height: 22px; text-transform: none; letter-spacing: 0px; text-align: left; border-radius: 0px;}
#page.user-research-result .selection-download .btn:first-child {border-right: solid 1px hsla(0,0%,90%,1);}
#page.user-research-result .selection-download .btn > b {margin-bottom: 0px;}
#page.user-research-result .selection-download .btn > [class*='fa-'] + b {margin-left: 18px;}

#page.user-research-result .menu {padding: 0px 24px 0px 24px;}
#page.user-research-result .menu .mlnk {border-bottom: solid 1px hsla(0,0%,90%,1);}
#page.user-research-result .menu .mlnk:last-child {border-bottom: none;}
#page.user-research-result .menu .mlnk {font-size: 16px; line-height: 22px; text-transform: none; letter-spacing: 0px; text-align: left; border-radius: 0px;}
#page.user-research-result .menu .mlnk > b {margin-bottom: 0px;}
#page.user-research-result .menu .mlnk > [class*='fa-'] + b {margin-left: 18px;}

#page.user-research-result .research-table {width: 100%; padding: 0px;} 
#page.user-research-result .research-table table {width: 100%; border-top: solid 1px hsla(0,0%,90%,1);}
#page.user-research-result .research-table table th, #page.user-research-result .research-table table td {
    width: 30px; padding: 6px 9px 6px 9px; font-size: 12px; line-height: 18px; text-align: center; vertical-align: middle; color: hsla(0,0%,0%,1);
}
#page.user-research-result .research-table table th {padding: 6px 0px 6px 0px; font-weight: 700; font-size: 12px; background-color: hsla(0,0%,96%,1);}
#page.user-research-result .research-table table th.test, #page.user-research-result .research-table table td.test {min-width: 120px; padding: 6px 0px 6px 24px; font-size: 12px; text-align: left;}
#page.user-research-result .research-table table th.scale, #page.user-research-result .research-table table td.scale {min-width: 120px; padding: 6px 12px 6px 12px; font-size: 12px; text-align: left;}
#page.user-research-result .research-table table th.last, #page.user-research-result .research-table table td.last {padding-right: 24px;}
#page.user-research-result .research-table table tr:nth-child(2n+1) td {background-color: hsla(0,0%,96%,1);}
#page.user-research-result .research-table table tr:last-child td {padding-bottom: 24px;}

#page.user-research-result .research-scales-select .rss-box {padding: 21px 24px 24px 24px;}
#page.user-research-result .research-scales-select .rss-box .sbox-wrap {flex: 1 1 auto; -webkit-flex: 1 1 auto; width: 648px;}
#page.user-research-result .research-scales-select .rss-box .sbox {flex: 1 1 auto; -webkit-flex: 1 1 auto; width: 300px; padding: 0px 24px 0px 0px;}
#page.user-research-result .research-scales-select .rss-box .sbox.nopad {padding: 0px 0px 0px 0px;}
#page.user-research-result .research-scales-select .rss-box .sbox .name {width: 100%; min-height: 24px; padding: 0px 0px 6px 0px; font-size: 12px; line-height: 16px; text-transform: uppercase; letter-spacing: 1px; color: hsla(0,0%,54%,1);}
#page.user-research-result .research-scales-select .rss-box .sbox select {width: 100%;}
#page.user-research-result .research-scales-select .rss-box .bbox {flex: 0 0 auto; -webkit-flex: 0 0 auto; padding: 21px 0px 0px 0px;}

#page.user-research-result .research-chart {width: 100%; padding: 0px 24px 0px 24px;}
#page.user-research-result .research-chart img {display: block; width: 100%;}
#page.user-research-result .research-chart-download {width: 100%; padding: 21px 24px 30px 24px;}


/*** POPUP ***/

#user-research-result-pp .popup.selections .page-user-research-result-selection-box:nth-child(2n) {background-color: hsla(0,0%,96%,1);}