/*********** 前後台編輯器區塊共用的CSS設定 ***********/

.index-about-title {

    color: #B63437;

    font-family: 'Josefin Sans', sans-serif;

    font-weight: bold;

    font-size: 28px;

    position: relative;

    margin-left: 50px;

}

.index-about-title:before {

    content: '';

    display: block;

    background: url(../../images/common/index/before.png);

    width: 47px;

    height: 41px;

    position: absolute;

    left: -35px;

    top: 13px;

}

.pro-editor .row,

.notice-editor .row {

    display: table;

    width: 100%;

    table-layout: fixed;

}

.about-editor .row{

    display: table;

    width: 100%;

    table-layout: fixed;

    margin-top: 40px;

}

.pro-editor .col,

.about-editor .col,

.notice-editor .col {

    display: table-cell;

    vertical-align: middle;

}

.pro-editor .col1 ,

.about-editor .col1,

.notice-editor.col1  {

    vertical-align: top;

    padding-right: 4px;

}



.about-editor .col2 {

    width: 60%;

    padding: 0 2%;

}

.notice-editor .col2 {

    width: 40%;

    padding: 0%;

}

.pro-editor .col2 {

    width: 52%;

    padding: 0%;

}

.about-editor-title {

    color: #B63437;

    font-size: 26px;

    font-weight: bold;

    font-family: 'Josefin Sans', sans-serif;

    margin: 10px 0;

}



.products-editor-pic {

    float: right;

    width: 400px;

    margin: 0 0 10px 30px;

}



.contact-editor .row {

    margin: 0 -2%;

}

.contact-editor .col {

    float: left;

    padding: 0 2%;

}

.contact-editor .col1 {

    width: 44%;

}

.contact-editor .col2 {

    width: 56%;

}

.contact-map {

    box-shadow: 0 0 4px 0 rgba(0,0,0,0.25);

    border: 8px solid #fff;

}

.contact-map iframe {

    display: block;

    max-height: 100%;

}

.contact-info-list {

    color: #555;

    font-size: 14px;

    list-style-type: none;

    padding: 0;

    margin: 0;

}

.contact-info-list .tel {

    color: #C21F1F;

}

.contact-info-list li {

    position: relative;

    padding: 2px 0 2px 40px;

    margin: 8px 0;

    line-height: 25px;

}

.contact-info-list li:before {

    content: '';

    display: inline-block;

    background: url('../../images/common/contact/info_ic.png') no-repeat;

    width: 25px;

    height: 25px;

    position: absolute;

    left: 0;

    top: 0;

}

.contact-info-list li.tel:before  { background-position: 0 0; }

.contact-info-list li.mail:before { background-position: 0 50%; }

.contact-info-list li.addr:before { background-position: 0 100%; }

.contact-info-list a:hover {

    text-decoration: underline;

}

.notice-editor-title {

    color: #B63437;

    font-size: 18px;

    font-weight: normal;

    letter-spacing: 0.04em;

    margin: 0 0 0.4em;

}

.notice-editor-title img {

    vertical-align: text-bottom;

}

.terms-title {

    color: #C21F1F;

    font-size: 14px;

    margin: 0 0 0.5em;

}

.news-editor{

    max-width: 1000px;

    margin: 0 auto;

}



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

    .pro-editorr .row, 

    .pro-editor .col,

    .notice-editor .row, 

    .notice-editor .col,

    .about-editor .row,

    .about-editor .col {

        display: block;

        width: auto;

    }

    .about-editor .row {

        max-width: 900px;

        margin: 0 auto;

    }

    .pro-editor .col1,

    .notice-editor .col2,

    .about-editor .col1 {

        padding: 0;

        margin-bottom: 4px;

        text-align: center;

    }

    .about-editor .col2 {

        padding: 0%;

    }

}

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

    .products-editor-pic {

        float: none;

        width: auto;

        text-align: center;

    }

    .contact-editor {

        padding: 0 2%;

    }

    .contact-editor .col {

        width: 100%;

        padding: 0;

        

    }

    .contact-map {

        margin-bottom: 1.8em;

    }

    .news-editor{

        max-width:auto;

    }

}

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

    .contact-map {

        height: 200px;

    }

}