/*@font-face{*/
    /*font-family: "MyriadPro-LightCond";*/
    /*src: url('../font/MyriadPro-LightCond.otf');*/
/*}*/

@font-face {
    font-family: 'MyriadPro-LightCond';
    src: url('../font/MyriadPro-LightCond.eot');
    src: url('../font/MyriadPro-LightCond.eot?#iefix') format('embedded-opentype');
    src:url('../font/MyriadPro-LightCond.woff') format('woff'), url('../font/MyriadPro-LightCond.ttf') format('truetype'), url('../font/MyriadPro-LightCond.svg#MyriadPro-LightCond') format('svg'),local('MyriadPro-LightCond'),local('Myriad Pro');
    font-weight: normal;
    font-style: normal;
}

body {
    width: 100%;
    overflow-x: hidden;
    font: 14px "Hiragino Sans GB", "Microsoft YaHei", "sans-serif";
}

.clear-fix {
    clear: both;
}

a {
    color: #333333;
}

a:hover {
    color: #99cc33;
}

.block-wrapper {
    text-align: center;
}

.block-title {
    padding: 100px 0 80px 0;
}

.block-title img {
    width: 200px;
}

#right-bottom-panel {
    right: 0;
    bottom: 1px;
    position: fixed;
    z-index: 999;
}

#right-bottom-panel li {
    margin-bottom: 2px;
}

#right-bottom-panel img {
    width: 100%;
}

#right-bottom-panel-top {
    visibility: hidden;
}

.right-bottom-panel-wrapper {
    clear: both;
}

.right-bottom-panel-img {
    float: right;
    background-color: #99cc33;
    z-index: 1001;
    position: relative;
}

.right-bottom-panel-text {
    padding: 0 10px;
    float: right;
    background-color: #99cc33;
    color: #ffffff;
    z-index: 1000;
    position: relative;
}

/***********
** HEADER **
***********/
@media (max-width: 767px) {
    #header {
        margin: 0;
        padding: 0;
        background-color: #ffffff;
        border-radius: 0;
        border: none;
    }
}

@media (min-width: 768px) {
    #header {
        height: 65px;
        margin: 0;
        padding: 0;
        background-color: #ffffff;
        border-radius: 0;
        border: none;
    }
}

#navbar-brand-wrapper {
    padding-top: 5px;
}

#navbar-brand {
    padding: 0;
    height: 55px;
}

#navbar-brand img {
    height: 100%;
}

#header-navi-toggle {
    margin: 0 20px 0 0;
    padding: 0;
}

@media (max-width: 767px) {
    #header-navi {
        float: left;
        width: 100%;
        background-color: #ffffff;
    }

    #header-navi ul {
        width: 100%;
    }

    .header-navi-item {
        width: 100%;
        padding: 10px 0 0 0;
        text-align: center;
    }
}

@media (min-width: 768px) {
    #header-navi {
        float: left;
        width: 50%;
        background-color: #ffffff;
    }

    #header-navi ul {
        width: 100%;
    }

    .header-navi-item {
        padding: 10px 0 0 0;
        text-align: center;
        width: 20%;
    }
}

.header-navi-item a {
    display: block;
    text-decoration: none;
    color: #363636;
    z-index: 999;
    position: relative;
    padding: 0 !important;
}

.header-navi-item a:hover {
    text-decoration: none;
    background-color: #ffffff !important;
}

@media (max-width: 767px) {
    .header-navi-item-eng {
        float: left;
        width: 50%;
        height: 30px;
        line-height: 30px;
        font-size: 1.2em !important;
        text-align: right;
    }

    .header-navi-item-eng-active {
        float: left;
        width: 50%;
        height: 30px;
        line-height: 30px;
        font-size: 1.2em !important;
        color: #99cc33;
        text-align: right;
    }

    .header-navi-item-chn {
        float: left;
        width: 47%;
        padding-left: 3%;
        height: 30px;
        line-height: 30px;
        font-size: 1.2em;
        text-align: left;
    }

    .header-navi-item-chn-active {
        float: left;
        width: 47%;
        padding-left: 3%;
        height: 30px;
        line-height: 30px;
        font-size: 1.2em;
        color: #99cc33;
        text-align: left;
    }

    .header-navi-item-line {
        height: 2px;
        width: 0%;
        /*overflow: hidden;*/
        background-color: #99cc33;
    }

    .header-navi-item-line-active {
        height: 2px;
        width: 100%;
        background-color: #99cc33;
    }
}

@media (min-width: 768px) {
    .header-navi-item-eng {
        height: 15px;
        line-height: 15px;
        font-size: 0.9em !important;
    }

    .header-navi-item-eng-active {
        height: 15px;
        line-height: 15px;
        font-size: 0.9em !important;
        color: #99cc33;
    }

    .header-navi-item-chn {
        height: 38px;
        line-height: 30px;
        font-size: 1.2em;
    }

    .header-navi-item-chn-active {
        height: 38px;
        line-height: 30px;
        font-size: 1.2em;
        color: #99cc33;
    }

    .header-navi-item-line {
        height: 2px;
        width: 0%;
        /*overflow: hidden;*/
        background-color: #99cc33;
    }

    .header-navi-item-line-active {
        height: 2px;
        width: 100%;
        background-color: #99cc33;
    }
}

.header-navi-item-bg {
    height: 65px;
    width: 0%;
    margin-top: -65px;
    /*overflow: hidden;*/
    background-color: #BAE664;
    z-index: 1;
    position: relative;
}

#header-contact-wrapper {

}

#header-contact-icon {
    width: 25% !important;
    padding-top: 18px;
    padding-right: 8%;
    text-align: right;
    font-size: 1.8em;
}

#header-contact-icon a {
    color: #333333;
}

#header-contact-icon a:hover {
    color: #99cc33;
}

#header-contact-form-wrapper {
    top: 0;
    left: 0;
    padding: 20px 0 30px 0;
    background-color: #ffffff;
    position: absolute;
    z-index: 999;
    display: none;
}

#header-contact-form {
}

#header-contact-form-close {
    padding-right: 7.2%;
    text-align: right;
    font-size: 2.7em;
}

#header-contact-form-right .form-control {
    height: 40px;
}

#header-contact-form-right textarea {
    min-height: 60px !important;
}

#header-contact-form-right-slogan {
    font-size: 1.6em;
    line-height: 2em;
    font-weight: bold;
}

#header-dropdown-wrapper {
    display: none;
    position: fixed;
    top: 65px;
    background-color: #fefefe;
    z-index: 999999;
}

#header-dropdown-wrapper a {
    display: block;
    padding: 10px 0 !important;
}

#header-dropdown-wrapper a:hover {
    background-color: #99cc33 !important;
    color: #ffffff;
}

/***********
** FOOTER **
***********/
#footer-quick-links {
    background-color: #ffffff;
}

#footer-quick-links-collaboration {
    font-family: "Microsoft YaHei";
    border: 3px solid #99cc33;
    padding: 20px;
    text-align: left;
}

@media (max-width: 1119px) {
    #footer-quick-links-main {
        margin-top: 20px;
    }
}

.footer-quick-links-eng {
    font-size: 0.9em;
    font-weight: 200;
}

.footer-quick-links-chn {
    margin: 0 16%;
    font-weight: 400;
    font-size: 1.2em;
    line-height: 2em;
}

.footer-quick-links-list {
    margin-top: 12px;
    line-height: 1.6em;
    font-size: 0.9em;
    font-weight: 100;
}

#footer {
    padding: 15px 0;
    background-color: #303030;
    color: #ffffff;
    text-align: center;
}

#footer-content {
    font-family: "Microsoft YaHei";
}

@media (max-width: 767px) {
    #footer-content-slogan {
        color: #99cc33;
        font-size: 1em;
        display: block;
    }

    #footer-content-contact {
        font-size: 1em;
        display: block;
        margin-top: 10px;
    }

    #footer-content-contact a {
        color: #ffffff;
    }
}

@media (min-width: 768px) {
    #footer-content-slogan {
        color: #99cc33;
        font-size: 1.2em;
        margin-right: 2%;
    }

    #footer-content-contact {
        font-size: 1.2em;
    }

    #footer-content-contact a {
        color: #ffffff;
    }
}

#footer-social-wrapper {
    margin-top: 15px;
}

#footer-social-hr-left {
    padding-right: 0;
}

#footer-social-hr-right {
    padding-left: 0;
}

#footer-social-list {
    margin: 0 9%;
}

#footer-social-list li {
    text-align: center;
}

#footer-social-list img {
    width: 85%;
}

#footer-copyright {
    margin-top: 15px;
    padding: 0 8.333333%;
    font-size: 12px;
}

/**********
** INDEX **
**********/
/* general */
@media (max-width: 767px) {
    .index-section {
        padding: 30px 0;
        text-align: center;
    }

    .index-section-title {
        text-align: center;
    }

    .index-section-title-eng {
        font: 2.1em "MyriadPro-LightCond", "Hiragino Sans GB", "Microsoft YaHei", "sans-serif";
        font-weight: 100;
        line-height: 100%;
        letter-spacing: 0.1em;
    }

    .index-section-title-chn {
        padding-top: 10px;
        font-size: 1.4em;
        line-height: 100%;
        letter-spacing: 0.2em;
    }

    .index-section-title-baseline {
        margin: 0 36% 30px 36%;
        padding-top: 10px;
        border-bottom: 1px solid #000000;
    }

    .index-section-more {
        margin-top: 20px;
    }

    .index-section-more img {
        width: 42%;
    }
}

@media (min-width: 768px) {
    .index-section {
        padding: 60px 0 60px 0;
        text-align: center;
    }

    .index-section-title {
        text-align: center;
    }

    .index-section-title-eng {
        font: 3.6em "MyriadPro-LightCond", "Hiragino Sans GB", "Microsoft YaHei", "sans-serif";
        font-weight: 100;
        line-height: 100%;
        letter-spacing: 0.2em;
    }

    .index-section-title-chn {
        padding-top: 20px;
        font-size: 1.8em;
        line-height: 100%;
        letter-spacing: 0.2em;
    }

    .index-section-title-baseline {
        margin: 0 36% 30px 36%;
        padding-top: 10px;
        border-bottom: 1px solid #000000;
    }

    .index-section-more {
        margin-top: 20px;
    }

    .index-section-more img {
        width: 22%;
    }
}

/* slider */
#index-slider img {
    width: 100%;
}

/* about seed design */
#index-about-design {
    background-color: #ffffff;
    text-align: center;
}

@media (max-width: 767px) {
    #index-about-design-content h1 {
        font-size: 1.4em;
        font-weight: 400;
        margin-bottom: 20px;
    }

    #index-about-design-content p {
        line-height: 1.5em;
        letter-spacing: 0.04em;
        text-align: justify;
    }
}

@media (min-width: 768px) {
    #index-about-design-content h1 {
        font-weight: 400;
        margin-bottom: 20px;
    }

    #index-about-design-content p {
        line-height: 1.5em;
        letter-spacing: 0.04em;
    }
}

#index-about-design-award {
    margin-top: 20px;
}

@media (max-width: 767px) {
    #index-about-design-award img {
        width: 100%;
    }
}

@media (min-width: 768px) {
    #index-about-design-award img {
        width: 64%;
    }
}

/* what we can do */
@media (max-width: 767px) {
    #index-can-do {
        /*background: url('../img/index/what_we_can_do/bg.jpg');*/
        /*background-size: 100%;*/
        background-color: #ffffff !important;
        background-image: none !important;
    }
}

@media (min-width: 1200px) {
    #index-can-do {
        /*background: url('../img/index/what_we_can_do/bg.jpg');*/
        background-size: 100%;
    }
}

#index-can-do-main {
    background-color: rgba(0,0,0,0.5);
}

#index-can-do-title {
    color: #ffffff;
}

#index-can-do-list .col-lg-3 {
    padding: 0 30px;
}

#index-can-do-title>.index-section-title-baseline {
    border-color: #ffffff;
}

#index-can-do-list a:hover {
    text-decoration: none;
}

.index-can-do-item {
    border: 1px solid #ffffff;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    color: #ffffff;
}

.index-can-do-item:hover {
    border: 1px solid #99cc33;
    color: #99cc33;
}

.index-can-do-item-chn {
    font-size: 1.45em;
}

.index-can-do-item-eng {
    font-size: 0.7em;
    margin-top: 5px;
}

/* new project */
#index-project {
    background-color: #ffffff;
}

#index-project ul {
    padding: 0 15px;
}

.index-project-item {
    padding: 0;
    overflow: hidden;
}

.index-project-item a {
    text-decoration: none;
    display: block;
}

.index-project-item img {
    width: 100%;
}

.index-project-item-hover {
    background-color: #99cc33;
    position: relative;
    padding: 20px;
    text-align: left;
    color: #ffffff;
    font-size: 1.2em;
}

.index-project-item-hover-eng {
    line-height: 1.5em;
    font-size: 0.9em;
}

.index-project-item-hover-chn {
    line-height: 1.2em;
    font-size: 0.9em;
}

.index-project-item-hover-line {
    padding-right: 80%;
    line-height: 0.8em;
}

.index-project-item-hover-line hr {
    height: 4px;
    border-color: #ffffff;
}

.index-project-item-hover-title {
    text-align: center;
    font-size: 1.2em;
}

/* our clients */
#index-our-client {
    border-top: 1px solid #333333;
    background-color: #ffffff;
}

#index-our-client-content {
    padding: 0;
    text-align: left;
}

#index-our-client-image-scroll-wrapper {
    overflow: hidden;
}

.index-our-client-image-scroll {
    width: 9999px;
    list-style: none;
}

@media (max-width: 767px) {
    .index-our-client-image-scroll li {
        float: left;
        padding: 0 5px;
    }

    .index-our-client-image-margin {
        margin-top: 10px;
    }
}

@media (min-width: 768px) {
    .index-our-client-image-scroll li {
        float: left;
        padding: 0 20px;
    }

    .index-our-client-image-margin {
        margin-top: 30px;
    }
}

.index-our-client-image-scroll img {
    width: 100%;
}

#index-our-client-anchor-left {
    margin-top: -175px;
    margin-left: -60px;
    float: left;
}

#index-our-client-anchor-right {
    margin-top: -175px;
    margin-right: -60px;
    float: right;
}

/* our advantages */
#index-our-advantages {
    /*background: url('../img/index/our_advantages/bg.jpg');*/
    background-size: 100%;
    color: #ffffff;
}

#index-our-advantages .index-section-title-baseline {
    border-color: #ffffff;
}

@media (max-width: 767px) {
    #index-our-advantages-content h1 {
        font-size: 1.4em;
        color: #ffffff;
        font-weight: 400;
    }

    #index-our-advantages-content p {
        margin: 20px 0;
        line-height: 2em;
        letter-spacing: 0.04em;
        text-align: justify;
    }
}

@media (min-width: 768px) {
    #index-our-advantages-content h1 {
        color: #ffffff;
        font-weight: 400;
    }

    #index-our-advantages-content p {
        margin: 20px 0;
        line-height: 2em;
        letter-spacing: 0.04em;
    }
}

.index-our-advantages-circle {
    width: 200px;
    height: 200px;
    background-color: rgba(153,204,51,0.6);
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
}

#index-our-advantages-circle-1 {
    left: 80px;
    position: relative;
    z-index: 1;
}

#index-our-advantages-circle-2 {
    top: -50px;
    position: relative;
    z-index: 3;
}

#index-our-advantages-circle-3 {
    left: 160px;
    top: -250px;
    position: relative;
    z-index: 2;
}

.index-our-advantages-text {
    color: #ffffff;
}

.index-our-advantages-text-eng {
    font-size: 1.2em;
    letter-spacing: 0;
}

.index-our-advantages-text-chn {
    font-size: 1.8em;
    letter-spacing: 0.05em;
    line-height: 2em;
}

/* quick links */
#index-quick-links-main {
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid #000000;
}

#index-quick-links-main .col-lg-4, #index-quick-links-main .col-lg-8 {
    padding: 0;
}

.index-quick-links-title-eng {
    text-align: center;
}

.index-quick-links-title-chn {
    margin: 0 40px 15px 40px;
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    border-bottom: 1px solid #99cc33;
}

.index-quick-links-item {
    margin-bottom: 2px;
    text-align: center;
}

.index-quick-links-item a {
    color: #333333;
}



/*
    CATEGORY
*/
#category-banner img {
    width: 100%;
}

#category-navigation {
    margin-top: 40px;
    margin-bottom: 40px;
    padding: 0;
}

#category-navigation ul {
    margin: 0;
}

#category-navigation li {
    width: 11.5%;
    padding: 0 1%;
}

#category-navigation img {
    width: 100%;
}

#category-content ul {
    margin: 0;
}

@media (max-width: 767px) {
    #category-content li {
        width: 50%;
        padding: 0;
        float: left;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    #category-content li {
        width: 33.33333333%;
        padding: 0;
        float: left;
    }
}

@media (min-width: 992px) {
    #category-content li {
        width: 16.6666667%;
        padding: 0;
        float: left;
    }
}

#category-content img {
    width: 100%;
}

/*
    ARTICLE
*/
@media (min-width: 992px) {
    #article-breadcrumb>.container, #article-wrapper {
        width: 960px;
    }
}

#article-breadcrumb {
    background-color: #99cc33;
}

#article-breadcrumb .breadcrumb {
    margin: 0 !important;
    background-color: transparent;
    padding-left: 0;
}

#article-breadcrumb a {
    color: #ffffff;
    font-size: 1em;
}

#article-title {
    padding: 20px 0;
    font-size: 27px;
    font-weight: 400;
    text-align: center;
}

#article-content img {
    width: 100%;
}

/*!**/
    /*ABOUT*/
/**!*/
/*#about-about-us {*/
/*}*/

/*#about-about-us-anchor {*/
    /*height: 0;*/
/*}*/

/*#about-about-us-text {*/
    /*margin-bottom: 20px;*/
/*}*/

/*#about-about-us-img {*/
    /*padding-bottom: 100px;*/
/*}*/

/*#about-about-us-img img {*/
    /*width: 100%;*/
/*}*/

/*#about-our-advantages {*/
/*}*/

/*#about-our-advantages img {*/
    /*width: 100%;*/
/*}*/

/*#about-can-do {*/
/*}*/

/*#about-can-do-content {*/
    /*padding-bottom: 80px;*/
/*}*/

/*#about-can-do-content li {*/
    /*padding: 0 30px;*/
/*}*/

/*.about-can-do-content-item img {*/
    /*width: 100%;*/
/*}*/

/*.about-can-do-content-item-text {*/
    /*margin-top: 40px;*/
/*}*/

/*#about-why-us {*/
    /*border-top: 1px solid #000000;*/
/*}*/

/*#about-why-us-title {*/
/*}*/

/*#about-why-us-content img {*/
    /*width: 100%;*/
/*}*/

/*
    CONTACT
*/
#contact-contact-us-title {
}

#contact-contact-us-content img {
    width: 100%;
}

/*********
** PAGE **
*********/
.page-banner img {
    width: 100%;
}

/*********
** JOIN **
*********/
#page-join-recruitment, #page-integration, #page-join-interest {
    background-color: #ffffff;
}

.page-join-position-cover {
    background-color: rgba(0,0,0,0.5);
    color: #ffffff;
}

@media (max-width: 767px) {
    .page-join-position-content {
        padding: 10px 0;
        color: #ffffff;
        background-color: rgba(0,0,0,0.5);
    }

    .page-join-position-content h3 {
        color: #ffffff !important;
    }

    .page-join-position-content p {
        font-size: 1em;
        line-height: 1.8em;
    }

    .page-join-position-name-chn {
        font-size: 1.8em;
    }

    .page-join-position-name-eng {
        font-size: 1em;
        line-height: 2em;
    }

    .page-join-position-line {
        margin-top: 5px;
        width: 40px;
        border-bottom: 1px solid #99cc33;
    }

    .page-join-position-number {
        font-size: 1em;
        margin-top: 5px;
        margin-bottom: 10px;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .page-join-position-content {
        padding: 10px 0;
        color: #ffffff;
        background-color: rgba(0,0,0,0.5);
    }

    .page-join-position-content h3 {
        color: #ffffff !important;
    }

    .page-join-position-content p {
        font-size: 1em;
        line-height: 1.8em;
    }

    .page-join-position-name-chn {
        font-size: 1.8em;
    }

    .page-join-position-name-eng {
        font-size: 1em;
        line-height: 2em;
    }

    .page-join-position-line {
        margin-top: 5px;
        width: 40px;
        border-bottom: 1px solid #99cc33;
    }

    .page-join-position-number {
        font-size: 1em;
        margin-top: 5px;
        margin-bottom: 10px;
    }
}

@media (min-width: 1200px) {
    .page-join-position-content {
        padding: 80px 0;
        color: #ffffff;
        background-color: rgba(0,0,0,0.5);
    }

    .page-join-position-content h3 {
        color: #ffffff !important;
    }

    .page-join-position-content p {
        font-size: 1em;
        line-height: 2em;
    }

    .page-join-position-name-chn {
        font-size: 2em;
    }

    .page-join-position-name-eng {
        font-size: 1.1em;
        line-height: 2.2em;
    }

    .page-join-position-line {
        margin-top: 10px;
        width: 40px;
        border-bottom: 1px solid #99cc33;
    }

    .page-join-position-number {
        font-size: 1.1em;
        margin-top: 80px;
    }
}

.page-join-position-middle {
    margin: -2.5% 0 0 -8%;
}

.page-join-position-line-rotate {
    height: 1px;
    width: 360px;
    background-color: #ffffff;
    /* Rotate div */
    transform:rotate(-45deg);
    -ms-transform:rotate(-45deg); /* Internet Explorer */
    -moz-transform:rotate(-45deg); /* Firefox */
    -webkit-transform:rotate(-45deg); /* Safari 和 Chrome */
    -o-transform:rotate(-45deg); /* Opera */
}

.page-join-position-circle {
    padding-top: 55px;
    margin: -95px 0 0 85px;
    position: relative;
    z-index: 99;
    width: 200px;
    height: 200px;
    background-color: rgba(153,204,51,1);
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
    text-align: center;
    font-size: 3.4em;
    line-height: 1em;
}

#page-join-brand-designer {
    background: url("../img/pages/join/join-brand-designer-bg.jpg") center;
}

#page-join-illustration-designer {
    background: url("../img/pages/join/join-illustration-designer-bg.jpg") center;
}

#page-join-space-designer {
    background: url("../img/pages/join/join-space-designer-bg.jpg") center;
}

#page-join-marketing-manager {
    background: url("../img/pages/join/join-marketing-manager-bg.jpg") center;
}

#page-join-info {
    padding: 30px 0 40px 0;
    background-color: #333333;
    color: #ffffff;
    line-height: 2em;
    font-size: 1em;
}

#page-join-info h2 {
    color: #ffffff !important;
}

#page-integration-gallery {
    padding-bottom: 50px;
}

#page-integration-gallery li {
    margin: 10px 0;
}

#page-integration-gallery a {
    display: block;
}

#page-integration-gallery img {
    width: 100%;
}

#page-join-collaboration {
    padding: 60px 0;
    text-align: center;
    border-bottom: 1px solid #000000;
}

#page-join-interest {
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
}

/************
** SERVICE **
*************/
@media (max-width: 767px) {
    #service-number-content {
        text-align: center;
        color: #99cc33;
        display: none;
    }
}

@media (min-width: 768px) {
    #service-number-content {
        text-align: center;
        color: #99cc33;
    }
}

.service-number-content-number {
    margin: 0 18%;
    font-size: 4.5em;
    font-weight: 600;
    border-bottom: 1px solid #99cc33;
}

.service-number-content-name {
    margin-top: 18px;
}

#service-our-clients {
    background-color: #ffffff;
}

@media (max-width: 767px) {
    #service-our-client-content h1, #service-brand-system-content h1,
    #service-year-round-content h1, #service-global-planning-content h1,
    #about-about-design-content h1, #about-who-we-are-content h1,
    #about-can-do-content h1 {
        font-size: 1.4em;
        font-weight: 400;
    }
}

@media (min-width: 768px) {
    #service-our-client-content h1, #service-brand-system-content h1,
    #service-year-round-content h1, #service-global-planning-content h1,
    #about-about-design-content h1, #about-who-we-are-content h1,
    #about-can-do-content h1 {
        font-weight: 400;
    }
}

#service-our-client-content img {
    margin-top: 40px;
    width: 100%;
}

#service-brand-system {
    background-color: #ffffff;
    border-bottom: 1px solid #333333;
}

#service-brand-system-content-list {
    margin-top: 40px;
}

@media (max-width: 767px) {
    .service-brand-system-content-item-circle {
        border: 1px solid #333333;
        width: 60%;
        margin-left: 20%;
        -moz-border-radius: 100px;
        -webkit-border-radius: 100px;
        border-radius: 100px;
        font-size: 14px;
        line-height: 30px;
        color: #333333;
    }

    .service-brand-system-content-item-content {
        margin-top: 20px;
        margin-bottom: 20px;
        line-height: 24px;
        font-size: 12px;
    }

    #service-year-round-gallery {
        background-color: #ffffff;
    }

    #service-year-round-gallery li {
        padding: 0 !important;
        overflow: hidden !important;
    }

    .service-year-round-item-title {
        position: relative;
        z-index: 999;
        color: #ffffff !important;
        text-align: center;
    }

    .service-year-round-item-chn {

    }

    .service-yrip-number {
        font-size: 12px !important;
    }

    .service-year-round-item-content {
        padding: 0 3% !important;
        position: relative;
        z-index: 1001;
        color: #ffffff !important;
        text-align: center;
        background-color: rgba(0,0,0,0.5);
        display: none;
    }

    .service-year-round-item-content-title {
        font-size: 16px;
        padding-top: 20px;
    }

    .service-year-round-item-content-subtitle {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .service-year-round-item-content-number {
        font-size: 16px;
    }

    .service-year-round-item-content-per {
        /*font-size: 48px;*/
    }

    .service-year-round-item-content-main {
        padding-bottom: 20px;
        font-size: 1.2em;
    }

    #service-year-round, #service-global-planning {
        background-color: #ffffff;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .service-brand-system-content-item-circle {
        border: 1px solid #333333;
        width: 60%;
        margin-left: 20%;
        -moz-border-radius: 100px;
        -webkit-border-radius: 100px;
        border-radius: 100px;
        font-size: 14px;
        line-height: 30px;
        color: #333333;
    }

    .service-brand-system-content-item-content {
        margin-top: 20px;
        margin-bottom: 20px;
        line-height: 24px;
        font-size: 12px;
    }

    #service-year-round-gallery {
        background-color: #ffffff;
    }

    #service-year-round-gallery li {
        padding: 0 !important;
        overflow: hidden !important;
    }

    .service-year-round-item-title {
        position: relative;
        z-index: 999;
        color: #ffffff !important;
        text-align: center;
    }

    .service-year-round-item-chn {

    }

    .service-yrip-number {
        font-size: 12px !important;
    }

    .service-year-round-item-content {
        padding: 0 3% !important;
        position: relative;
        z-index: 1001;
        color: #ffffff !important;
        text-align: center;
        background-color: rgba(0,0,0,0.5);
        display: none;
    }

    .service-year-round-item-content-title {
        font-size: 16px;
        padding-top: 20px;
    }

    .service-year-round-item-content-subtitle {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .service-year-round-item-content-number {
        font-size: 16px;
    }

    .service-year-round-item-content-per {
        /*font-size: 48px;*/
    }

    .service-year-round-item-content-main {
        padding-bottom: 20px;
        font-size: 1.2em;
    }

    #service-year-round, #service-global-planning {
        background-color: #ffffff;
    }
}

@media (min-width: 992px) {
    .service-brand-system-content-item-circle {
        border: 1px solid #333333;
        width: 60%;
        margin-left: 20%;
        -moz-border-radius: 100px;
        -webkit-border-radius: 100px;
        border-radius: 100px;
        font-size: 18px;
        line-height: 30px;
        color: #333333;
    }

    .service-brand-system-content-item-content {
        margin-top: 20px;
        line-height: 24px;
        font-size: 12px;
    }

    #service-year-round-gallery {
        background-color: #ffffff;
    }

    #service-year-round-gallery li {
        padding: 0 !important;
        overflow: hidden !important;
    }

    .service-year-round-item-title {
        position: relative;
        z-index: 999;
        color: #ffffff !important;
        text-align: center;
    }

    .service-year-round-item-chn {

    }

    .service-yrip-number {
        font-size: 48px !important;
    }

    .service-year-round-item-content {
        position: relative;
        z-index: 1001;
        color: #ffffff !important;
        text-align: center;
        background-color: rgba(0,0,0,0.5);
        display: none;
    }

    .service-year-round-item-content-title {
        padding-top: 50px;
    }

    .service-year-round-item-content-subtitle {
        margin-bottom: 20px;
    }

    .service-year-round-item-content-number {
        font-size: 48px;
    }

    .service-year-round-item-content-per {
        /*font-size: 48px;*/
    }

    .service-year-round-item-content-main {
        padding-bottom: 50px;
        font-size: 1.4em;
    }

    #service-year-round, #service-global-planning {
        background-color: #ffffff;
    }
}

#service-global-planning-gallery {
    background-color: #ffffff;
}

#service-global-planning-content p {
    margin-top: 20px;
}

#service-cooperation-process {
    /*background-image: url('../img/pages/service/');*/
}

#service-cooperation-process-main {
    background-color: rgba(0,0,0,0.5);
    color: #ffffff;
}

#service-cooperation-process .index-section-title-baseline {
    border-color: #ffffff;
}

@media (max-width: 767px) {
    .service-cooperation-process-content-number {
        font-size: 32px;
        font-weight: 800;
        font-style: italic;
        display: block;
        float: left;
        width: 5%;
    }


    .service-cooperation-process-content-text {
        font-size: 14px;
        display: block;
        margin: 5px 0 0 5%;
        float: left;
        letter-spacing: 0.05em;
        word-break: break-all;
        text-align: left;
        width: 90%;
    }
}

@media (min-width: 768px) {
    .service-cooperation-process-content-number {
        font-size: 42px;
        font-weight: 800;
        font-style: italic;
        display: block;
        float: left;
        width: 5%;
    }


    .service-cooperation-process-content-text {
        font-size: 14px;
        display: block;
        margin: 16px 0 0 5%;
        float: left;
        letter-spacing: 0.05em;
        word-break: break-all;
        text-align: left;
        width: 90%;
    }
}

.service-arrow-down img {
    width: 30px;
}

/**********
** about **
**********/
#about-about-design {
    background-color: #ffffff;
}

#about-who-we-are, #about-who-we-are h1 {
    color: #ffffff;
}

#about-who-we-are .index-section-title-baseline {
    border-color: #ffffff;
}

#about-who-we-are-content {
    margin-bottom: 80px;
}

@media (max-width: 767px) {
    .about-who-we-are-content-item {
        width: 20%;
        padding: 0 1%;
        float: left;
    }

    .about-who-we-are-content-item-img {
        text-align: center;
    }

    .about-who-we-are-content-item-img img {
        width: 50px;
    }

    .about-who-we-are-content-item-title {
        color: #99cc33;
        font-size: 16px;
        text-align: center;
    }

    .about-who-we-are-content-item-text {
        margin-top: 10px;
        font-size: 12px;
        text-align: justify;
    }

    #about-can-do {
        background-color: #ffffff;
        border-bottom: 1px solid #333333;
    }

    #about-can-do-list {
        margin-top: 40px;
    }

    .about-can-do-item {
        padding: 0 2%;
    }

    .about-can-do-circle {
        width: 100%;
        border: 1px solid #333333;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        color: #333333;
        font-size: 14px;
        letter-spacing: 0;
    }

    .about-can-do-text {
        margin-top: 20px;
        letter-spacing: 0;
        font-size: 12px;
        line-height: 20px;
        text-align: justify;
    }
}

@media (min-width: 768px) {
    .about-who-we-are-content-item {
        width: 20%;
        padding: 0 2.5%;
        float: left;
    }

    .about-who-we-are-content-item-img {
        text-align: center;
    }

    .about-who-we-are-content-item-img img {
        width: 50px;
    }

    .about-who-we-are-content-item-title {
        color: #99cc33;
        font-size: 18px;
        text-align: center;
    }

    .about-who-we-are-content-item-text {
        margin-top: 10px;
        font-size: 12px;
        text-align: justify;
    }

    #about-can-do {
        background-color: #ffffff;
        border-bottom: 1px solid #333333;
    }

    #about-can-do-list {
        margin-top: 40px;
    }

    .about-can-do-item {
        padding: 0 6%;
    }

    .about-can-do-circle {
        width: 100%;
        border: 1px solid #333333;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        color: #333333;
        font-size: 21px;
        letter-spacing: 0.25em;
    }

    .about-can-do-text {
        margin-top: 20px;
        letter-spacing: 0.2em;
        font-size: 12px;
        line-height: 20px;
        text-align: justify;
    }
}

@media (max-width: 767px) {
    #about-our-advantages, #about-our-advantages-list {
        background-color: #ffffff;
        display: none;
    }
}

@media (min-width: 768px) {
    #about-our-advantages, #about-our-advantages-list {
        background-color: #ffffff;
    }
}

.about-our-advantages-item-name-chn {
    color: #ffffff;
    font-size: 36px;
    /*letter-spacing: 0.5em;*/
    text-align: center;
}

.about-our-advantages-item-name-eng {
    color: #ffffff;
    font-size: 12px;
    text-align: center;
}

.about-our-advantages-item-number {
    color: #ffffff;
    font-size: 56px;
    float: left;
}

.about-our-advantages-item-text {
    color: #ffffff;
    font-size: 16px;
    line-height: 25px;
    float: left;
    margin-left: 8%;
    padding-top: 20px;
}

.about-our-advantages-item-number-left {
    color: #ffffff;
    font-size: 56px;
    float: right;
    margin-left: 8%;
}

.about-our-advantages-item-text-left {
    color: #ffffff;
    font-size: 16px;
    line-height: 25px;
    float: right;
    padding-top: 20px;
    text-align: right;
}

#about-our-advantages-list li {
    margin-bottom: 30px;
}

#about-our-advantages-concentration {
    background-image: url("../img/pages/about/our_advantages/about-our-advantages-bg-1.jpg");
    background-size: 100%;
}

#about-our-advantages-experience {
    background-image: url("../img/pages/about/our_advantages/about-our-advantages-bg-2.jpg");
    background-size: 100%;
}

#about-our-advantages-entirety {
    background-image: url("../img/pages/about/our_advantages/about-our-advantages-bg-3.jpg");
    background-size: 100%;
}

#about-our-advantages-speciality {
    background-image: url("../img/pages/about/our_advantages/about-our-advantages-bg-4.jpg");
    background-size: 100%;
}

#about-our-advantages-profound {
    background-image: url("../img/pages/about/our_advantages/about-our-advantages-bg-5.jpg");
    background-size: 100%;
}

#about-our-advantages-resource {
    background-image: url("../img/pages/about/our_advantages/about-our-advantages-bg-6.jpg");
    background-size: 100%;
    margin-bottom: 0 !important;
}

#about-contact-us {
    background-color: #ffffff;
}

#about-contact-us-content-wrapper {
    border-bottom: 1px solid #333333;
    background-color: #ffffff;
}

@media (max-width: 767px) {
    #about-contact-us-content li {
        padding: 0 2%;
        margin-bottom: 20px;
    }
}

@media (min-width: 768px) {
    #about-contact-us-content li {
        padding: 0 9%;
        margin-bottom: 50px;
    }
}

#about-contact-us-content img {
    width: 100%;
}

.about-contact-us-img-wrapper {
    border: 1px solid #cccccc;
}

.about-contact-us-img-text {
    margin-top: 20px;
    color: #333333;
    font-size: 14px;
    text-align: center;
}

#about-visit-us {
    background-color: #ffffff;
}

#about-visit-us .index-section {
    padding-bottom: 30px;
}

#about-visit-us-map {
    width: 100%;
}