@charset "UTF-8";

@charset "UTF-8";
/* メインコンテンツ */
.main_contents {
    max-width: 970px;
    margin: 0 auto;
    padding: 50px 20px 10px;
    overflow: hidden;
}

.contents {
    padding: 30px 20px 50px;
}

/* ライトエリア */
.contents_right h2 {
    margin-bottom: 20px;
    padding: 18px 20px 15px;
    background-color: #eaeaea;
    font-size: 1.5em;
    line-height: 1;
}

.contents_right dl {
    padding: 0 20px;
    overflow: hidden;
}

.contents_right .dl01 dt {
    width: 180px;
    float: left;
    line-height: 1.9;
}

.contents_right .ptn01 dt {
    width: 90px;
}

.contents_right .ptn02 dt {
    width: 180px;
}

.contents_right .dl01 dd {
    width: 500px;
    float: left;
    line-height: 1.9;
}

.contents_right .ptn01 dd {
    width: 590px;
}

.contents_right .ptn02 dd {
    width: 460px;
}

.contents_right .dl02 {
    width: 340px;
    margin-bottom: 30px;
    padding: 0;
    float: left;
    overflow: hidden;
    text-align: center;
}

.contents_right .dl02 dt {
    height: 20px;
    padding-bottom: 15px;
    font-weight: bold;
}

.contents_right .dl02 dd {
    font-size: 0.9em;
}

.contents_right .dl03 dt {
    font-weight: bold;
    line-height: 1.8;
}

.contents_right .dl03 dd {
    padding-bottom: 10px;
    padding-left: 1.5em;
    line-height: 1.8;
}

.contents_right .note {
    margin: 0 20px;
    background-color: #ededed;
}

.contents_right .note dt {
    padding: 15px 20px;
    float: left;
    background: none;
    color: #333;
}

.contents_right .note dd {
    padding: 10px 20px 10px 0;
    overflow: hidden;
}

.contents_right h3 {
    margin-bottom: 20px;
    padding: 18px 20px 15px;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    font-size: 1.5em;
    line-height: 1;
}

.contents_right h3 span {
    font-size: 0.6em;
    vertical-align: middle;
}

.contents_right h3.h301 {
    margin: 0;
    padding: 10px 20px 20px;
    border: 0;
    font-size: 1.3em;
}

.contents_right h4 {
    margin: 25px 20px 15px;
    padding: 0 0 0 10px;
    border-left: 8px solid #d3d3d3;
    font-size: 1.3em;
}

.contents_right ul.ul01 {
    overflow: hidden;
}

.contents_right ul.ul01 li {
    margin-bottom: 5px;
    padding-left: 1.4em;
    text-indent: -1.4em;
}

.contents_right ul.ul02 {
    display: inline-block;
    width: 300px;
    overflow: hidden;
    font-size: 0.85em;
    text-align: center;
}

.contents_right ul.ul03 {
    font-size: 0.8em;
}

.contents_right ul.ul03 li {
    padding-left: 2.8em;
    text-indent: -2.8em;
}

.contents_right ul.ul02 li {
    padding-bottom: 5px;
    line-height: 1.4;
}

.contents_right ul.even {
    overflow: hidden;
}

.contents_right ul.even li {
    width: 50%;
    margin-right: 0;
    float: left;
}

.contents_right ul.anchor_border {
    margin: 0 20px 30px;
    padding: 0 0 20px;
    border-bottom: 5px solid #eaeaea;
}

.contents_right table {
    width: 100%;
    line-height: 1.5;
}

.contents_right table th {
    padding: 9px 15px 6px;
    border: 1px solid #ccc;
    background: #f3f3f3;
    font-weight: 100;
    text-align: left;
    vertical-align: middle;
}

.contents_right table td {
    padding: 9px 15px 6px;
    border: 1px solid #ccc;
    vertical-align: middle;
}

.contents_right table.table01 th,
.contents_right table.table01 td {
    padding: 9px 8px 6px;
    text-align: center;
}

.contents_right table.table01 tr.even th {
    text-align: left;
}

.contents_right table.table02 th,
.contents_right table.table02 td {
    padding: 8px 7px 5px;
    font-size: 0.9em;
    text-align: center;
}

.contents_right table.table02 tr.even td {
    text-align: left;
}

.contents_right p.p01 {
    margin: 0;
    padding: 0;
    font-size: 0.8em;
}

.contents_right p.p02 {
    font-size: 1.1em;
    font-weight: bold;
    line-height: 1.5;
}

/* 640 */
@media screen and (max-width: 640px) {
    /* メインコンテンツ */
    .main_contents {
        width: 94%;
        margin: 0 auto;
        padding: 6% 0 1%;
        overflow: hidden;
    }
    .contents {
        padding: 0;
    }
    /* ライトエリア */
    .contents_right h2 {
        margin-bottom: 20px;
        padding: 2% 4% 1.8%;
        background-color: #eaeaea;
        font-size: 1.1em;
        line-height: 1.3;
    }
    .contents_right dl {
        padding: 0 3%;
        overflow: hidden;
    }
    .contents_right .dl01 dt {
        width: 100%;
        clear: both;
    }
    .contents_right .ptn01 dt {
        width: 100%;
    }
    .contents_right .ptn02 dt {
        width: 100%;
    }
    .contents_right .dl01 dd {
        width: 100%;
        clear: both;
        line-height: 1.8;
    }
    .contents_right .ptn01 dd {
        width: 100%;
    }
    .contents_right .ptn02 dd {
        width: 100%;
    }
    .contents_right .dl02 {
        width: 100%;
        clear: both;
        overflow: hidden;
        text-align: center;
    }
    .contents_right .dl02 dt {
        height: auto;
        padding-bottom: 2%;
        font-weight: bold;
    }
    .contents_right .dl02 dd {
        font-size: 0.9em;
    }
    .contents_right .dl03 dt {
        font-weight: bold;
        line-height: 1.8;
    }
    .contents_right .dl03 dd {
        padding-bottom: 10px;
        padding-left: 1.5em;
        line-height: 1.8;
    }
    .contents_right .note {
        margin: 0 20px;
        background-color: #ededed;
    }
    .contents_right .note dt {
        padding: 15px 20px;
        float: left;
        background: none;
        color: #333;
    }
    .contents_right .note dd {
        padding: 10px 20px 10px 0;
        overflow: hidden;
    }
    .contents_right h3 {
        margin-bottom: 3%;
        padding: 2.5% 4%;
        border-top: 1px solid #d3d3d3;
        border-bottom: 1px solid #d3d3d3;
        font-size: 1.1em;
        line-height: 1.4;
    }
    .contents_right h3.h301 {
        margin: 0;
        padding: 10px 20px 20px;
        border: 0;
        font-size: 1.3em;
    }
    .contents_right h4 {
        margin: 4% 3% 3%;
        padding: 0 0 0 2%;
        border-left: 8px solid #d3d3d3;
        font-size: 1em;
    }
    .contents_right ul.ul02 {
        display: inline-block;
        width: 80%;
        overflow: hidden;
        font-size: 0.85em;
        text-align: center;
    }
    .contents_right table {
        width: 100%;
        line-height: 1.5;
    }
    .contents_right table th {
        padding: 9px 15px 6px;
        border: 1px solid #ccc;
        background: #f3f3f3;
        font-weight: 100;
        text-align: left;
        vertical-align: middle;
    }
    .contents_right table td {
        padding: 9px 15px 6px;
        border: 1px solid #ccc;
        vertical-align: middle;
    }
    .contents_right table.table01 th,
    .contents_right table.table01 td {
        font-size: 0.9em;
    }
    .contents_right table.table02 th,
    .contents_right table.table02 td {
        font-size: 0.7em;
    }
}

/*contents
-------------------------------------*/
.contents_right_in {
    padding: 0 20px;
}

#lesson {
    position: relative;
}

.contents_right .h4 {
    margin: 25px 20px 15px;
    padding: 0 0 0 10px;
    border-top: 0 none;
    border-bottom: 0 none;
    border-left: 8px solid #d3d3d3;
    background: transparent;
    font-size: 1.3em;
    line-height: 1.4;
}

/*english
-------------------------------------*/
.translation_term .introduction,
.lesson .introduction {
    padding: 18px 30px;
    background: #eaeaea;
}

.translation_term .introduction p,
.lesson .introduction p {
    max-height: 100%;
    padding: 0;
}

.translation_term .introduction p + p,
.lesson .introduction p + p {
    padding-top: 10px;
}

.lesson .conversation {
    padding: 0;
    word-break: break-word;
}

.lesson .conversation dl {
    padding: 0;
}

.dictionary_title {
    font-size: 0.6em;
    vertical-align: middle;
}

.feature .h4 {
    margin: 25px 0 15px;
}

.feature_image,
.feature_image img {
    width: 100%;
}

.description_download p {
    padding-right: 0;
}

.pdf_image img {
    width: 100%;
}

#data_download {
    margin: 25px 0 15px;
}

.chinese_area,
.german_area {
    width: 330px;
    float: left;
}

.german_area {
    margin-left: 20px;
}

.proUserFooterLogInOn {
    margin-top: 30px;
    text-align: center;
}

.registered01 {
    display: inline-block;
}

.btn_text {
    margin-top: 10px;
    font-size: 0.8em;
}

.sentence .title {
    max-height: 100%;
    margin-bottom: 5px;
    padding-bottom: 5px;
    font-size: 1.1em;
    font-weight: bold;
    vertical-align: bottom;
}

.sentence dd {
    max-height: 100%;
    margin-left: 1em;
}

.sentence dd + .title {
    margin-top: 30px;
}

.translation p {
    padding: 0;
}

.translation p,
[class*="translation"] + [class*="translation"] {
    margin-top: 15px;
}

[class*="translation"] span {
    margin-top: 5px;
}

.time_english .translation span {
    margin-left: 20px;
}

.translation_break span {
    display: block;
}

.translation_list {
    display: table;
}

.translation_list dt,
.translation_list dd {
    display: table-cell;
}

.translation_list.conversation_example dt,
.translation_list.conversation_example dd {
    display: block;
    max-height: none;
}

.translation_list.conversation_example dt {
    width: auto;
}

.translation_list ul {
    padding: 0;
}

.translation_list > p ~ ul {
    margin-left: 1em;
}

.translation_list li {
    display: inline-block;
    line-height: 1.9;
}

.translation_list.mid_dots li + li {
    padding-left: 20px;
}

.grey_arrow_right li {
    font-weight: bold;
}

.grey_arrow_right li span {
    font-weight: normal;
}

.sentence .title_description {
    padding: 0;
}

.example {
    display: flex;
    flex-wrap: wrap;
    margin: -20px 0 20px -20px;
}

.example li {
    position: relative;
    margin-top: 20px;
    padding-left: 38px;
}

.example li::before {
    -webkit-clip-path: polygon(0 0, 0 100%, 100% 50%);
    display: block;
    position: absolute;
    top: 8px;
    left: 20px;
    width: 7px;
    height: 9px;
    background-color: #d3d3d3;
    clip-path: polygon(0 0, 0 100%, 100% 50%);
    content: "";
}

.example_break span {
    display: block;
}

.exchange .sentence {
    display: table;
}

.exchange .sentence + .sentence {
    margin-top: 30px;
}

.exchange .sentence p {
    padding: 0;
}

.exchange .sentence .pic,
.exchange .sentence .txt {
    display: table-cell;
}

.exchange .sentence .pic {
    width: 76px;
    text-align: center;
}

.exchange .sentence .txt {
    max-height: 100%;
    padding-left: 18px;
    vertical-align: middle;
}

.exchange .sentence .txt p {
    padding: 0;
}

.exchange .sentence dd {
    margin: 5px 0 0;
}

.exchange .sentence dl + dl {
    margin-top: 30px;
}

.summary p {
    max-height: 100%;
    padding: 0;
}

.cv_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: -20px 0 32px -20px;
}

.cv_list > li {
    margin-top: 20px;
    padding-left: 20px;
}

.cv_list > li > *:last-child {
    margin-bottom: 0;
}

/*main index
-------------------------------*/
.main_index .description p {
    padding: 19px 152px 0 0;
}

.main_index .link_area {
    margin: 46px 0 76px;
}

.main_index .link_area ul {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.main_index .link_area ul > li {
    position: relative;
}

.main_index .link_area ul > li::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    width: 6px;
    height: 6px;
    transform: translateY(-50%) rotate(45deg);
    border: 3px solid #bcbcbc;
    border-bottom: 0;
    border-left: 0;
    content: "";
}

.main_index .link_area li a {
    display: flex;
    position: relative;
    align-items: center;
    height: 100%;
    padding: 28px 28px 28px 23px;
    background: #f2f2f2;
    font-size: 1.1em;
    line-height: 1;
    text-decoration: none;
}

.main_index .link_area li a .arrow_gray {
    position: absolute;
    top: 50%;
    right: 20px;
    width: 6px;
    margin-top: -6px;
}

.lesson_index .link_area {
    margin: 46px 0 76px;
}

.lesson_index #bnUpperTxt + .link_area {
    margin-top: 30px;
}

.lesson_index .link_area ul {
    padding: 0;
}

.lesson_index .link_area li {
    border-top: 1px dotted #e4e5e0;
}

.lesson_index .link_area li:last-child {
    border-bottom: 1px dotted #e4e5e0;
}

.lesson_index .link_area li a {
    display: block;
    padding: 15px 15px 15px 0;
    font-size: 1.6rem;
    text-decoration: none;
}

.link_area span[class*="lesson_"] {
    display: inline-block;
    line-height: 1.4;
}

.lesson_num {
    min-width: 90px;
    padding: 8px 15px;
    background: #f2f2f2;
    white-space: nowrap;
}

.link_area span.lesson_title {
    padding: 8px 15px 8px 17px;
    line-height: 1.4;
}

/* 640 */
@media screen and (max-width: 640px) {
    .contents_right .h4 {
        margin: 4% 3% 3%;
        padding: 0 0 0 2%;
        border-left: 8px solid #d3d3d3;
        font-size: 1em;
    }
    .dictionary_title {
        display: block;
    }
    .feature .h4 {
        margin: 4% 0 3%;
    }
    #bnUpperTxt p {
        padding: 13px 167px 15px 0;
    }
    .description_download p {
        padding: 0 3%;
    }
    .chinese_area,
    .german_area {
        width: 100%;
        float: none;
    }
    .german_area {
        margin: 30px 0 0;
    }
    .main_index .link_area li a {
        box-sizing: border-box;
        padding: 10% 24px 10% 10%;
        line-height: 1.4;
    }
    .main_index .link_area li a .arrow_gray {
        right: 15px;
        width: 9px;
        margin-top: -7px;
    }
    .exchange .sentence dd {
        margin: 15px 0 0;
    }
    .userBtn,
    .userRightBtn02 {
        margin-top: 30px;
        text-align: center;
    }
    .userBtn_area {
        width: 100%;
    }
    .userBtn_area img {
        width: 50%;
    }
    [class*="translation"] span {
        display: block;
    }
    .time_english .translation span {
        margin-left: 0;
    }
    .translation p,
    [class*="translation"] + [class*="translation"] {
        margin-top: 30px;
    }
    .translation_list {
        display: block;
    }
    .translation_list dt,
    .translation_list dd {
        display: block;
    }
    .translation_list.mid_dots li + li {
        padding-left: 0;
    }
    /*fa_link
    -------------------------------------*/
    .contents_right .lesson .conversation .expression_list li + li {
        margin: 0;
    }
    .contents_right .lesson .conversation .expression ul dl {
        margin-left: 0;
    }
    .tech_download .link_contents {
        width: 22%;
    }
    .tech_download .link_contents + .link_contents {
        margin-left: 3%;
    }
    .tech_download .link_contents dt img {
        width: 100%;
        height: auto;
    }
    .lesson_nu {
        min-width: 155px;
        padding: 10px 15px;
    }
    /*backnumber index
    -------------------------------*/
    #bibUpper,
    #bnIndexBox,
    #bibLower {
        background-size: contain;
    }
    #bibUpper {
        background-position: left top;
    }
    #bibLower {
        background-position: left bottom;
    }
    /*main index
    -------------------------------*/
    .main_index .link_area ul {
        grid-gap: 10px;
        width: 100%;
    }
    .main_index .link_area li {
        box-sizing: border-box;
    }
    .main_index .link_area li + li {
        margin-left: 0;
    }
    .main_index .link_area ul > li::after {
        right: 16px;
    }
}

/*backnumber index
-------------------------------*/
/*  */
.bnUpperTxt {
    background: url("../../../../../img/ss/general/fa_english/bn_english.gif") no-repeat top right;
    font-size: 15px;
    line-height: 1.5;
    text-align: left;
}

/*index
-------------------------------*/
/* 640 */
@media screen and (max-width: 640px) {
    /*backnumber index
    -------------------------------*/
    .bnUpperTxt {
        background: url("../../../../../img/ss/general/fa_english/bn_english.gif") no-repeat bottom right;
        background-size: 130px;
        font-size: 15px;
        line-height: 1.5;
        text-align: left;
    }
    /*index
    -------------------------------*/
    .main_index .description p {
        padding: 25px 130px 0 0;
    }
}

.ss-layout-header-content > *:last-child,
.ss-layout-footer-content > *:last-child {
    margin-bottom: 0 !important;
}

.ss-layout-header {
    position: relative;
    width: 100%;
    border: 1px solid #f1f1f1;
    background-color: #fff;
}

@media only screen and (max-width: 640px) {
    .ss-layout-header {
        min-height: 100%;
    }
}

.ss-layout-header-content {
    display: flex;
    align-items: center;
    max-width: 1320px;
    margin: 0 auto;
    padding: 14px 20px;
}

@media only screen and (max-width: 640px) {
    .ss-layout-header-content {
        padding: 18px 20px;
    }
}

.ss-layout-header-logo {
    display: block;
    min-height: 0%;
    margin: 0 auto 0 0;
    line-height: 1;
    text-align: center;
}

@media only screen and (max-width: 640px) {
    .ss-layout-header-logo {
        margin: auto;
    }
}

.ss-layout-header-logo a {
    display: block;
    font-size: 0;
    text-decoration: none;
}

.ss-layout-header-logo img {
    width: 138px;
}

@media only screen and (max-width: 640px) {
    .ss-layout-header-logo img {
        width: 91px;
    }
}

.theme-KC .ss-layout-header-logo img {
    width: 250px;
}

@media only screen and (max-width: 640px) {
    .theme-KC .ss-layout-header-logo img {
        width: 214px;
    }
}

.ss-layout-footer {
    width: 100%;
    overflow: hidden;
    background-color: #24232b;
}

.ss-layout-footer-content {
    max-width: 1280px;
    margin: auto;
    padding: 24px 20px;
}

.ss-layout-footer-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: -8px 0 16px -32px;
    line-height: 1.2;
}

.ss-layout-footer-list > li {
    margin-top: 8px;
    padding-left: 32px;
    color: #f1f1f1;
    font-size: 1.4rem;
}

@media only screen and (max-width: 1023px) {
    .ss-layout-footer-list > li:last-child::before {
        content: none;
    }
}

.ss-layout-footer-list > li > a {
    color: #f1f1f1;
    text-decoration: none;
}

.ss-layout-footer-list > li + li {
    position: relative;
}

.ss-layout-footer-list > li + li::before {
    position: absolute;
    top: 50%;
    left: 14px;
    width: 1px;
    height: 100%;
    transform: translateY(-50%);
    background-color: #f1f1f1;
    content: "";
}

@media only screen and (max-width: 1023px) {
    .ss-layout-footer-copyright {
        width: 100%;
        text-align: center;
    }
}

.ss-textPhoneLink {
    max-width: 100%;
    margin-bottom: 16px;
    text-align: center;
}

.ss-textPhoneLink > *:last-child {
    margin-bottom: 0;
}

.ss-textPhoneLink-numberGroup {
    display: flex;
    align-items: center;
}

@media only screen and (max-width: 640px) {
    .ss-textPhoneLink-numberGroup {
        flex-direction: column;
        justify-content: center;
    }
}

.ss-textPhoneLink-numberGroup.of-vertical {
    flex-direction: column;
}

.ss-textPhoneLink-number {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    font-size: 2.4rem;
    font-weight: 600;
}

@media only screen and (max-width: 640px) {
    .ss-textPhoneLink-number {
        width: 100%;
    }
}

.ss-textPhoneLink-number > .AutoPhoneCall {
    position: relative;
    max-width: 100%;
    padding-left: 3.8rem;
    color: #333;
    text-decoration: none;
    cursor: default;
}

.ss-textPhoneLink-number > .AutoPhoneCall::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 3.8rem;
    height: 3.8rem;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.8459 18.8048C24.0514 19.0103 24.0514 19.3435 23.8459 19.549L21.9896 21.4052C21.6958 21.699 21.3224 21.9075 20.9094 21.9533C17.7281 22.3057 14.2797 20.6242 11.8263 18.1708C9.37433 15.7188 7.69413 12.2717 8.04673 9.09064C8.09251 8.67763 8.30099 8.30421 8.59482 8.01038L10.4511 6.15412C10.6566 5.94863 10.9897 5.94863 11.1952 6.15412L13.7998 8.75867C14.0053 8.96416 14.0053 9.29733 13.7998 9.50282L11.1583 12.1443C11.1452 13.8391 12.0519 15.3826 13.3347 16.6653C14.6182 17.9489 16.1599 18.8556 17.8557 18.8417L20.5604 16.2479C20.767 16.0497 21.0942 16.0531 21.2967 16.2556L23.8459 18.8048Z' fill=''/%3E%3C/svg%3E");
    content: "";
}

.ss-textPhoneLink-number > .TelSlsh {
    display: none;
}

.ss-textPhoneLink-notes {
    max-width: 100%;
}

@media only screen and (max-width: 640px) {
    .ss-textPhoneLink-notes {
        width: 100%;
        margin-bottom: 4px;
    }
}

.ss-textPhone {
    display: block;
    margin-bottom: 24px;
}

.ss-textPhone > *:last-child {
    margin-bottom: 0;
}

.ss-textPhone-body > *:last-child {
    margin-bottom: 0;
}

.ss-textPhone-number {
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1;
}

.ss-textPhone-numberGroup {
    display: flex;
    align-items: flex-start;
    margin-top: 0 !important;
    margin-bottom: 8px;
}

.ss-textPhone-note {
    display: block;
    margin-top: 0 !important;
    margin-bottom: 8px;
    font-size: 1.2rem;
    line-height: 1.2;
}

.ss-textPhone-icon {
    width: 36px;
    min-width: 36px;
    height: 20px;
    min-height: 20px;
    margin-top: 0.2rem;
    margin-right: 8px;
}

.ss-textPhone-icon .of-iconColor-primary {
    fill: #00a23f;
}

.ss-textPhone-icon .of-iconColor-secondary {
    fill: #fe8800;
}

.ss-textPhone-icon .of-iconColor-tertiary {
    fill: #0086b1;
}

.ss-textPhone-icon .of-iconColor-quaternary {
    fill: #838079;
}

.ss-textPhone-icon .of-iconColor-quinary {
    fill: #1e1c1c;
}

.ss-textPhone.of-center {
    text-align: center;
}

.ss-textPhone.of-center .ss-textPhone-numberGroup {
    justify-content: center;
}

a.ss-textPhone-body,
a:hover.ss-textPhone-body {
    display: inline-block;
    color: #333;
    text-decoration: none;
    cursor: default;
    opacity: 1;
}

@media only screen and (max-width: 640px) {
    .ss-smallScreen-hide {
        display: none;
    }
}