html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #FFF;
}

#design_section_1 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 5% 0% 7% 0%;
    clear: both;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

#design_section_1 .x1_content {
    width: 80%;
    height: auto;
    margin: 0 auto;
    padding: 0;
    clear: both;
}

#design_section_1 .x1_content dl {
    margin: 0;
    padding: 0;
    width: 100%;
}

#design_section_1 .x1_content dl dt {
    margin: 0;
    padding: 0;
    float: none;
}

#design_section_1 .x1_content dl dd {
    margin: 0;
    padding: 0;
    float: none;
}

#design_section_1 .x1_content dl dt:nth-of-type(1) {
    height: 10px;
    overflow: hidden;
}

#design_section_1 .x1_content dl dt:nth-of-type(2) {
    height: 40px;
    overflow: hidden;
}

#design_section_1 .x1_content dl dd .em {
    color: #FFF;
    font-size: 60px;
    line-height: 60px;
    text-align: center;
    text-transform: uppercase;
    opacity: 0.2;
    font-family: fangzheng, Times, serif;
}

#design_section_1 .x1_content dl dd .cm {
    color: #FFF;
    font-size: 40px;
    line-height: 40px;
    text-align: center;
}

#design_section_1 .x1_content dl dd .zzz {
    color: #FFF;
    font-size: 16px;
    line-height: 30px;
}

#design_section_1 .x1_content dl dd .zzz p {
    margin: 0;
    padding: 0;
}

#design_section_1 .x1_content dl dd .zzz p + p {
    margin: 10px 0px 0px 0px;
    padding: 0;
}


@media screen and (max-width: 1600px) {

    #design_section_1 {
        padding: 5% 0% 7% 0%;
    }

    #design_section_1 .x1_content {
        width: 90%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 50px;
        line-height: 50px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 40px;
        line-height: 40px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 16px;
        line-height: 30px;
    }

}

@media screen and (max-width: 1400px) {

    #design_section_1 {
        padding: 5% 0% 7% 0%;
    }

    #design_section_1 .x1_content {
        width: 96%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 50px;
        line-height: 50px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 40px;
        line-height: 40px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 16px;
        line-height: 30px;
    }

}

@media screen and (max-width: 1200px) {

    #design_section_1 {
        padding: 7% 0% 7% 0%;
    }

    #design_section_1 .x1_content {
        width: 96%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 50px;
        line-height: 50px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 40px;
        line-height: 40px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 16px;
        line-height: 30px;
    }

}

@media screen and (max-width: 1024px) {

    #design_section_1 {
        padding: 10% 0% 10% 0%;
    }

    #design_section_1 .x1_content {
        width: 90%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 40px;
        line-height: 40px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 40px;
        line-height: 40px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 14px;
        line-height: 26px;
    }

}

@media screen and (max-width: 768px) {

    #design_section_1 {
        padding: 10% 0% 10% 0%;
    }

    #design_section_1 .x1_content {
        width: 90%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 40px;
        line-height: 40px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 36px;
        line-height: 36px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 14px;
        line-height: 24px;
    }

}

@media screen and (max-width: 640px) {

    #design_section_1 {
        padding: 10% 0% 10% 0%;
    }

    #design_section_1 .x1_content {
        width: 90%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 14px;
        line-height: 24px;
    }

}

@media screen and (max-width: 600px) {

    #design_section_1 {
        padding: 10% 0% 13% 0%;
    }

    #design_section_1 .x1_content {
        width: 90%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 26px;
        line-height: 26px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 14px;
        line-height: 24px;
    }

}

@media screen and (max-width: 440px) {

    #design_section_1 {
        padding: 13% 0% 15% 0%;
    }

    #design_section_1 .x1_content {
        width: 90%;
    }

    #design_section_1 .x1_content dl dd .em {
        font-size: 24px;
        line-height: 24px;
    }

    #design_section_1 .x1_content dl dd .cm {
        font-size: 24px;
        line-height: 24px;
    }

    #design_section_1 .x1_content dl dd .zzz {
        font-size: 14px;
        line-height: 24px;
    }

}


#design_section_2 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 5% 0% 5% 0%;
    clear: both;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

#design_section_2 .x2_explain {
    width: 80%;
    height: auto;
    margin: 0 auto;
    padding: 0;
}

#design_section_2 .x2_explain dl {
    margin: 0;
    padding: 0;
    width: 100%;
}

#design_section_2 .x2_explain dl dt {
    margin: 0;
    padding: 0;
    float: none;
    text-align: center;
}

#design_section_2 .x2_explain dl dd {
    margin: 0;
    padding: 0;
    float: none;
    text-align: center;
}

#design_section_2 .x2_explain dl dd time {
    color: #333;
    font-size: 40px;
    line-height: 40px;
    margin: 0;
    padding: 0;
    display: inline-block;
}

#design_section_2 .x2_explain dl dd output {
    color: #666;
    font-size: 16px;
    line-height: 30px;
    margin: 0;
    padding: 0;
    display: block;
}

#design_section_2 .x2_explain dl dt:nth-of-type(1) {
    height: 50px;
    overflow: hidden;
}

#design_section_2 .x2_explain dl dt:nth-of-type(2) {
    height: 100px;
    overflow: hidden;
}


#design_section_2 .x2_content {
    width: 81%;
    height: auto;
    margin: 0 auto;
    padding: 0;
    clear: both;
}

#design_section_2 .x2_content ul {
    margin: 0% 0% 0% -3%;
    padding: 0;
    list-style-type: none;
    width: 103%;
}

#design_section_2 .x2_content ul::after {
    content: "";
    display: block;
    height: 0px;
    line-height: 0px;
    clear: both;
    visibility: hidden;
    overflow: hidden;
}

#design_section_2 .x2_content ul li {
    margin: 0% 0% 5% 3%;
    padding: 0;
    width: 30%;
    float: left;
}

#design_section_2 .x2_content ul li dl {
    margin: 0;
    padding: 0;
    width: 100%;
}

#design_section_2 .x2_content ul li dl dt {
    margin: 0;
    padding: 0;
    float: none;
    text-align: center;
}

#design_section_2 .x2_content ul li dl dd {
    margin: 0;
    padding: 0;
    float: none;
    text-align: center;
}

#design_section_2 .x2_content ul li dl dt img {
    width: 100%;
    height: auto;
    border: 0px;
}

#design_section_2 .x2_content ul li dl dd p {
    font-size: 14px;
    line-height: 14px;
    margin: 0;
    padding: 0;
}


@media screen and (max-width: 1600px) {

    #design_section_2 {
        padding: 5% 0% 5% 0%;
    }

    #design_section_2 .x2_explain {
        width: 90%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 50px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 90px;
    }

    #design_section_2 .x2_content {
        width: 90%;
    }

}

@media screen and (max-width: 1400px) {

    #design_section_2 {
        padding: 5% 0% 5% 0%;
    }

    #design_section_2 .x2_explain {
        width: 96%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 50px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 90px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 38px;
        line-height: 38px;
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 16px;
        line-height: 30px;
    }

    #design_section_2 .x2_content {
        width: 96%;
    }

}

@media screen and (max-width: 1200px) {

    #design_section_2 {
        padding: 7% 0% 5% 0%;
    }

    #design_section_2 .x2_explain {
        width: 96%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 40px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 80px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 36px;
        line-height: 36px;
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 16px;
        line-height: 30px;
    }

    #design_section_2 .x2_content {
        width: 96%;
    }

}

@media screen and (max-width: 1024px) {

    #design_section_2 {
        padding: 10% 0% 5% 0%;
    }

    #design_section_2 .x2_explain {
        width: 90%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 30px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 60px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 36px;
        line-height: 36px;
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 14px;
        line-height: 26px;
    }

    #design_section_2 .x2_content {
        width: 90%;
    }

}

@media screen and (max-width: 768px) {

    #design_section_2 {
        padding: 10% 0% 5% 0%;
    }

    #design_section_2 .x2_explain {
        width: 90%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_2 .x2_content {
        width: 90%;
    }

}

@media screen and (max-width: 640px) {

    #design_section_2 {
        padding: 10% 0% 10% 0%;
    }

    #design_section_2 .x2_explain {
        width: 90%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_2 .x2_content {
        width: 90%;
    }

}

@media screen and (max-width: 600px) {

    #design_section_2 {
        padding: 10% 0% 10% 0%;
    }

    #design_section_2 .x2_explain {
        width: 90%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 26px;
        line-height: 26px
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_2 .x2_content {
        width: 90%;
    }

    #design_section_2 .x2_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_2 .x2_content ul li {
        margin: 0% 0% 5% 5%;
        padding: 0;
        width: 45%;
    }

}

@media screen and (max-width: 440px) {

    #design_section_2 {
        padding: 13% 0% 10% 0%;
    }

    #design_section_2 .x2_explain {
        width: 90%;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_2 .x2_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_2 .x2_explain dl dd time {
        font-size: 24px;
        line-height: 24px
    }

    #design_section_2 .x2_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_2 .x2_content {
        width: 90%;
    }

    #design_section_2 .x2_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_2 .x2_content ul li {
        margin: 0% 0% 5% 5%;
        padding: 0;
        width: 45%;
    }

}


#design_section_3 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 5% 0% 5% 0%;
    clear: both;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

#design_section_3 .x3_explain {
    width: 80%;
    height: auto;
    margin: 0 auto;
    padding: 0;
}

#design_section_3 .x3_explain dl {
    margin: 0;
    padding: 0;
    width: 100%;
}

#design_section_3 .x3_explain dl dt {
    margin: 0;
    padding: 0;
    float: none;
    text-align: center;
}

#design_section_3 .x3_explain dl dd {
    margin: 0;
    padding: 0;
    float: none;
    text-align: center;
}

#design_section_3 .x3_explain dl dd time {
    color: #FFF;
    font-size: 40px;
    line-height: 40px;
    margin: 0;
    padding: 0;
    display: inline-block;
}

#design_section_3 .x3_explain dl dd output {
    color: #FFF;
    font-size: 16px;
    line-height: 30px;
    margin: 0;
    padding: 0;
    display: block;
}

#design_section_3 .x3_explain dl dt:nth-of-type(1) {
    height: 50px;
    overflow: hidden;
}

#design_section_3 .x3_explain dl dt:nth-of-type(2) {
    height: 100px;
    overflow: hidden;
}


#design_section_3 .x3_content {
    width: 81%;
    height: auto;
    margin: 0 auto;
    padding: 0;
    clear: both;
}

#design_section_3 .x3_content ul {
    margin: 0% 0% 0% -5%;
    padding: 0;
    list-style-type: none;
    width: 105%;
    text-align: left;
}

#design_section_3 .x3_content ul::after {
    content: "";
    display: block;
    height: 0px;
    line-height: 0px;
    clear: both;
    visibility: hidden;
    overflow: hidden;
}

#design_section_3 .x3_content ul li {
    margin: 0% 0% 5% 5%;
    padding: 0;
    width: 15%;
    float: left;
}

#design_section_3 .x3_content ul li dl {
    margin: 0;
    padding: 0;
    width: 100%;
    display: block;
}

#design_section_3 .x3_content ul li dl dt {
    margin: 0;
    padding: 0;
    float: none;
    display: block;
    position: relative;
    text-align: center;
    margin-bottom: 20px;
}

#design_section_3 .x3_content ul li dl dd {
    margin: 0;
    padding: 0;
    float: none;
    display: block;
    position: relative;
    text-align: center;
}

#design_section_3 .x3_content ul li dl dt .bbb {
    width: 100%;
    height: auto;
    overflow: hidden;
    position: relative;
}

#design_section_3 .x3_content ul li dl dt .bbb img {
    width: 100%;
    height: auto;
    border: 0px;
}

#design_section_3 .x3_content ul li dl dt .qqq {
    color: #FFF;
    font-size: 48px;
    line-height: 48px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1.0;
    -moz-flex-shrink: 1;
    -webkit-flex-shrink: 1;
    flex-shrink: 1;
}

#design_section_3 .x3_content ul li dl dd em {
    color: #FFF;
    font-size: 16px;
    line-height: 16px;
    font-style: normal;
}


@media screen and (max-width: 1600px) {

    #design_section_3 {
        padding: 5% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 90%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 50px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 90px;
    }

    #design_section_3 .x3_content {
        width: 90%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 38px;
        line-height: 38px;
    }

}

@media screen and (max-width: 1400px) {

    #design_section_3 {
        padding: 5% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 96%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 50px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 90px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 38px;
        line-height: 38px;
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 16px;
        line-height: 30px;
    }

    #design_section_3 .x3_content {
        width: 96%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 30px;
        line-height: 30px;
    }

}

@media screen and (max-width: 1200px) {

    #design_section_3 {
        padding: 7% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 96%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 40px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 80px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 36px;
        line-height: 36px;
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 16px;
        line-height: 30px;
    }

    #design_section_3 .x3_content {
        width: 96%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 24px;
        line-height: 24px;
    }

}

@media screen and (max-width: 1024px) {

    #design_section_3 {
        padding: 10% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 90%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 30px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 60px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 36px;
        line-height: 36px;
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 16px;
        line-height: 30px;
    }

    #design_section_3 .x3_content {
        width: 90%;
    }

    #design_section_3 .x3_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_3 .x3_content ul li {
        margin: 0% 0% 10% 5%;
        padding: 0;
        width: 28%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 38px;
        line-height: 38px;
    }

    #design_section_3 .x3_content ul li dl dd em {
        font-size: 16px;
        line-height: 16px;
    }

}

@media screen and (max-width: 768px) {

    #design_section_3 {
        padding: 10% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 90%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_3 .x3_content {
        width: 90%;
    }

    #design_section_3 .x3_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_3 .x3_content ul li {
        margin: 0% 0% 10% 5%;
        padding: 0;
        width: 28%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_3 .x3_content ul li dl dd em {
        font-size: 14px;
        line-height: 14px;
    }

}

@media screen and (max-width: 640px) {

    #design_section_3 {
        padding: 10% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 90%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_3 .x3_content {
        width: 90%;
    }

    #design_section_3 .x3_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_3 .x3_content ul li {
        margin: 0% 0% 10% 5%;
        padding: 0;
        width: 28%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 24px;
        line-height: 24px;
    }

    #design_section_3 .x3_content ul li dl dd em {
        font-size: 14px;
        line-height: 14px;
    }

}

@media screen and (max-width: 500px) {

    #design_section_3 {
        padding: 10% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 90%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 26px;
        line-height: 26px
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_3 .x3_content {
        width: 90%;
    }

    #design_section_3 .x3_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_3 .x3_content ul li {
        margin: 0% 0% 10% 5%;
        padding: 0;
        width: 45%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 30px;
        line-height: 30px;
    }

    #design_section_3 .x3_content ul li dl dd em {
        font-size: 14px;
        line-height: 14px;
    }

}

@media screen and (max-width: 440px) {

    #design_section_3 {
        padding: 13% 0% 5% 0%;
    }

    #design_section_3 .x3_explain {
        width: 90%;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(1) {
        height: 25px;
    }

    #design_section_3 .x3_explain dl dt:nth-of-type(2) {
        height: 50px;
    }

    #design_section_3 .x3_explain dl dd time {
        font-size: 24px;
        line-height: 24px
    }

    #design_section_3 .x3_explain dl dd output {
        font-size: 14px;
        line-height: 24px;
    }

    #design_section_3 .x3_content {
        width: 90%;
    }

    #design_section_3 .x3_content ul {
        margin: 0% 0% 0% -5%;
        width: 105%;
    }

    #design_section_3 .x3_content ul li {
        margin: 0% 0% 10% 5%;
        padding: 0;
        width: 45%;
    }

    #design_section_3 .x3_content ul li dl dt .qqq {
        font-size: 24px;
        line-height: 24px;
    }

    #design_section_3 .x3_content ul li dl dd em {
        font-size: 14px;
        line-height: 14px;
    }

}


#design_section_4 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    clear: both;
}

#design_section_4 .x4_default {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    clear: both;
}

#design_section_4 .x4_default img {
    width: 100%;
    height: auto;
    border: 0px;
}


#design_section_4 .x4_tablet {
    display: none;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    clear: both;
}

#design_section_4 .x4_tablet img {
    width: 100%;
    height: auto;
    border: 0px;
}


#design_section_4 .x4_mini {
    display: none;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    clear: both;
}

#design_section_4 .x4_mini img {
    width: 100%;
    height: auto;
    border: 0px;
}


@media screen and (max-width: 1024px) {

    #design_section_4 .x4_tablet {
        display: block;
    }

    #design_section_4 .x4_default {
        display: none;
    }

    #design_section_4 .x4_mini {
        display: none;
    }

}

@media screen and (max-width: 640px) {

    #design_section_4 .x4_tablet {
        display: none;
    }

    #design_section_4 .x4_default {
        display: none;
    }

    #design_section_4 .x4_mini {
        display: block;
    }

}