/* Pad Style */
@media all and (max-width: 1200px) {

header.bg-black { display: none; }
.w1170 { width: auto; }

.head { position: fixed; top: 0; left: 0; z-index: 101; width: 100%; height: 60px; }
.head > .relative { z-index: 101; height: 59px; background: #fff; }
.head .logo { top: 0; left: 50%; width: 143px; height: 59px; margin-left: -71px; }
.head .menu { display: block; position: absolute; left: 0; top: 0; width: 60px; height: 59px; line-height: 57px; text-align: center; font-size: 18px; }
.head .menu.expand i:before { content: '\E809'; }
.head .search-btn { top: 0; width: 60px; height: 59px; line-height: 58px; text-align: center; font-size: 18px; border: 0; border-radius: 0; }
.head .search-btn i { position: static; }
.head .search { top: 59px; }

.head .nav { position: fixed; top: 0; left: -340px; z-index: 100; height: 100%; width: 340px; padding-top: 60px; background: #fafafa; overflow: auto; }
.head .nav li { display: block; text-align: left; }
.head .nav .p { display: block; margin: 0 15px; padding: 0; font-size: 16px; font-weight: 600; height: 70px; line-height: 70px; border-bottom: 1px solid #e5e5e5; color: #363636; }
.head .nav .p a { color: #363636; }
.head .nav .expand .p, .head .nav .expand .p a { color: #008ab0; }
.head .nav .p:after { position: absolute; right: 15px; content: '\E80E'; font-family: iconfont; font-size: 14px; }
.head .nav .expand .p:after { right: 16px; content: '\E810'; font-size: 20px; }
.head .nav .p a { display: inline; }

.head .nav .son { position: static; padding: 0; }

.head .nav .nav-son { display: block; padding: 0; margin: 0; }
.head .nav .nav-son dt { position: static; height: 70px; line-height: 70px; padding-left: 35px; margin-bottom: 0; letter-spacing: 0; cursor: pointer; }
.head .nav .nav-son dt:after { position: absolute; right: 15px; content: '\E80F'; font-family: iconfont;  }
.head .nav .nav-son dt.expand, .head .nav .nav-son dt.expand a { color: #008ab0; }
.head .nav .nav-son dt.expand:after { content: '\E810'; }

.head .nav .nav-son dd { display: none; font-size: 16px; height: 50px; padding-left: 55px; line-height: 50px; margin: 0; }
.head .nav .nav-son dd.t { cursor: pointer; }
.head .nav .nav-son dd.t:after { position: relative; bottom: -3px; margin-left: 10px; width: 0; height: 0; border-width: 6px 4px 0; border-style: solid; border-color: #b3b3b3 transparent; content: ''; font-size: 0; vertical-align: top; }
.head .nav .nav-son dd.t.expand, .head .nav .nav-son dd.t.expand a { color: #008ab0; }
.head .nav .nav-son dd.t.expand:after { top: -2px; border-width: 0 4px 6px; border-color: #008ab0 transparent; }

.head .nav .nav-son dd.s { padding-left: 75px; }
.head .nav .nav-son dd.s a { color: #646549; font-size: 16px; }

.head .nav .bg-black { padding: 15px 0; }
.head .nav .bg-black a { display: block; float: none; height: 50px; padding-left: 15px; line-height: 50px; font-size: 16px; color: #fff; background: none; }
.head .nav .bg-black a:hover { background: none !important; }


.index-swiper { height: 460px; margin: 60px auto 40px; }
.index-swiper-right, .isr-button { display: none; }
.swiper-pagination { display: block; width: 100%; bottom: -22px; font-size: 0; }
    .swiper-pagination-bullet { width: 7px; height: 7px; margin: 0 3px; background: #363636; opacity: .4 }
    .swiper-pagination-bullet-active { opacity: 1; }
.index-swiper-left { width: 100%; height: 100%; }
.index-swiper-left .swiper-slide { height: 100%; }

.index-2-product { float: none;  width: auto; margin: 0 20px 20px; }

.index-swiper-bulletin { float: left; width: 50%; height: 350px; margin: 0 0 20px; padding: 0 10px 0 20px; }
.index-swiper-bulletin:before { position: absolute; z-index: 11; left: 0; top: 0; width: 20px; height: 100%; content: ''; background: #f1f1f1; }
.index-swiper-bulletin:after { position: absolute; z-index: 11; right: 0; top: 0; width: 10px; height: 100%; content: ''; background: #f1f1f1; }
.index-swiper-bulletin .swiper-button-prev, .index-swiper-bulletin .swiper-button-next { padding-top: 40%; }
.index-swiper-bulletin .swiper-button-prev { left: 20px; }
.index-swiper-bulletin .swiper-button-next { right: 10px; }
.index-swiper-bulletin .swiper-pagination { display: none; }

.index-swiper-news { width: 50%; height: 350px; margin: 0 0 20px; padding: 0 20px 0 10px; }
.index-swiper-news:before { position: absolute; z-index: 11; right: 0; top: 0; width: 20px; height: 100%; content: ''; background: #f1f1f1; }
.index-swiper-news:after { position: absolute; z-index: 11; left: 0; top: 0; width: 10px; height: 100%; content: ''; background: #f1f1f1; }
.index-swiper-news .swiper-button-prev, .index-swiper-news .swiper-button-next { padding-top: 40%; }
.index-swiper-news .swiper-button-prev { left: 10px; }
.index-swiper-news .swiper-button-next { right: 20px; }
.index-swiper-news .swiper-pagination { display: none; }

.index-3-product { width: 50%; height: 350px; padding: 0 30px 0 40px; border-right: 10px solid #f1f1f1; border-left: 20px solid #f1f1f1; }
.index-3-product .product { bottom: 0; left: 0; width: 100%; background: transparent; }
.index-3-product .product h2 { margin-bottom: 0; padding: 20px 0; background: rgba(255,255,255,.9); }
.index-3-product .product > span { padding: 0 20px 20px; background: rgba(255,255,255,.9); }

.index-3-contact { width: 50%; height: 350px; border-right: 20px solid #f1f1f1; border-left: 10px solid #f1f1f1; }
.index-3-contact .container { height: 310px; padding-top: 45px; }

.bread { margin-top: 60px; padding-left: 20px; }
.sidebar-sns, .sidebar-product { display: none; }

.product-details > .w1170 { padding: 0; }
.pd-gallery { display: none; }
.product-swiper { display: block; float: left; width: 40%; height: 400px; margin: 30px 5% 0; }
.product-swiper .swiper-slide {  background-size: cover; background-position: center; }
.product-swiper .swiper-pagination { bottom: 10px; }
.pd-info { position: static; float: right; width: 50%; min-height: 400px; padding: 50px 0 20px 20px; }

.product-items { width: 80%; margin: 0 auto; }
.product-items .tabs { width: auto; }
.product-items .tab { width: auto; }
.product-items .tab * { max-width: 100%; }
.product-items .tab-3 .title-content:first-child { width: 30%; }
.product-items .tab-3 .title-content:last-child { width: 70%; }
.product-banner .title { width: 80%; margin: 0 auto 25px; }
.product-banner .links { width: 80%; margin: auto; }

.rel-product { padding: 50px 0 80px; }
.rel-product h2 { margin-bottom: 20px; }
.rel-product ul { padding: 0; margin-bottom: 80px; }
.rel-product li { width: 50%; padding: 0; margin: 0; border: 0; min-height: 375px }
.rel-product li .face { width: 70%; margin: auto;     height: 375px;}

.swiper-plan { width: auto; }
.swiper-plan .swiper-container { height: 430px; }
.swiper-plan .swiper-slide .t { font-size: 50px; }
.swiper-plan .swiper-plan-next, .swiper-plan .swiper-plan-prev { display: none; }

.pl-banner > .w1170 { height: 130px; }

.product-list > .w1170 { position: relative; padding: 0 30px 0 200px; min-height: 1550px; }
aside.cats { position: absolute; left: 20px; top: 0; width: 150px; }
    .pl-main { float: none; width: auto; }
        .products { margin-top: 30px; }
        .products li { width: 50%; }
        .products li .face {   width: 78%; margin: auto; }

    .pl-main .sns-btns { display: block; }

    .pages > * { width: 34px; }

.page-pics { padding: 0 0 40px; }
.page-pics .banner { height: 240px; margin-bottom: 20px; }
.page-pics .banner strong { width: auto; margin: 0 30px; }
.page-pics .two-cols a { width: 47%; margin: 0 1% 20px 2%; height: calc(45vw); }
/*.page-pics .two-cols a:last-child { margin-left: 1%; margin-right: 2%; }*/
.page-pics .two-cols .fr { margin-left: 1%; margin-right: 2%; }

.page-pics .three-cols a { width: 30.666%; height: calc(32vw); margin: 0 2% 20px;  }
.page-pics .three-cols a:nth-of-type(1), .page-pics .three-cols a:nth-of-type(4) { margin: 0 0 20px 2%; }
.page-pics .three-cols a:nth-of-type(3), .page-pics .three-cols a:nth-of-type(6) { margin: 0 2% 20px 0; }

.page-banner-slider .swiper-banner-next, .page-banner-slider .swiper-banner-prev { display: none; }

.swiper-banner .swiper-slide .t { width: auto; padding: 0 60px; }

.strength h2 { margin-bottom: 20px; }
.strength .sns-btns { display: block; }
.strength .content { width: auto; margin: 0 80px 40px; }
    .strength-activity li { width: calc(50% - 30px); height: 280px; }
    .strength-activity li.fl { margin: 0 10px 0 20px; }
    .strength-activity li.fr { margin: 0 20px 0 10px; }
    .strength-activity li a { width: calc(100% - 40px); }
.activity div { width: auto; padding: 0 60px; }
.more-rec .w1170 { width: auto; }

.rec-list { padding: 0 10px; }
.rec-list li { width: calc(33.333% - 20px); margin: 0 10px 20px; padding: 0; }
.rec-list .face { height: 160px; }

.happy h2 { padding-bottom: 0; }
.happy .sns-btns { display: block; margin-bottom: 30px; }
.text, .happy .poetry { width: auto; margin: 0 140px 30px; }
.media { width: auto; margin: 0 80px 30px; }
    .media-meta { width: auto; }
.happy-list { width: auto; margin: 0 70px; }
.happy-list li { width: calc(25% - 20px); margin: 0 10px; padding: 0; }
.happy-list li .face { height: 100px; }

.news-list { width: auto; padding: 0 10px; }
.news-list li { width: calc(33.333% - 20px); margin: 0 10px 65px; padding: 0; }
.news-list .img { width: 100%; height: calc(33.333vw - 130px); }
.news-list li .wrap { height: 350px; }

.news-list-wrap h2 { margin-bottom: 10px; }
.news-list-wrap .sns-btns { display: block; margin-bottom: 100px; }

.news h1 { width: auto; margin: 0 80px 15px; }
.news .sns-btns { display: block; margin-bottom: 35px; }

.search-input { width: 350px; }
.search-input input { width: 280px; }
.search-cats, .search-num { margin-left: 20px; margin-right: 20px; }

.witness { padding: 50px 0; }
.witness > .w1170 { position: relative; padding: 0 30px 0 200px; }
    .witness-main { float: none; width: auto; padding: 0; }
    .witness-main .face { width: auto; }
    .witness-main dl dd { width: calc(26% - 10px); }
    .witness-main .sns-btns { display: block; }

.page { padding: 50px 0; }
.page > .w1170 { position: relative; padding: 0 30px 0 200px; }
    .page-main { float: none; }
    .page-main .title { font-size: 30px; }
    .page-main .sns-btns { display: block; margin-bottom: 30px; }
    .page-main article { width: auto; }
    .page-main .text { margin: 0 50px 30px; }
    .page-main .media { margin: 0 0 30px; }
    .page-main .pic-txt { width: auto; }
    .page-main .pic { width: 25%; }
    .page-main .txt { width: 75%; }
    .page-main .txt.fr { padding-left: 20px; }
    .page-main .txt.fl { padding-right: 20px; }
    .page-main .data { width: 100%; }
    .page-main .timeline { width: auto; }
    .page-main .timeline .content img { max-width: 100%; }
    .page-main .swiper-inner { width: auto; padding: 35px 0; }
        .swiper-inner .swiper-slide .image { height: 250px; }
        .swiper-inner .swiper-slide .description { position: absolute; bottom: 0; left: 0; width: 100%; color: #363636; background: rgba(229,299,299,.5); }
        .swiper-inner-next, .swiper-inner-prev { display: none; }
        .swiper-inner .swiper-pagination { bottom: 15px; }
    .page-main .team { width: auto; }
        .team li > div:first-child { width: calc(34% - 15px); }
        .team li > div:first-child img { max-width: 100%; }
        .team li > div:last-child { width: 66%; }
        .team li .name { margin-bottom: 10px; }

        .pics-4cols { width: auto; }
        .pics-4cols li { min-height: 140px; padding: 0 10px; margin-bottom: 10px; }
        .pics-4cols li .fz0 img { max-width: 100%; }

    .page-main hr { width: auto; margin: 0 50px 30px; }
    .page-main .mix { width: auto; margin: 0 50px 30px; }
    .page-main .mix .media { width: 200px; margin: 0 15px 15px 0; }
    .page-main .mix .media.fr { width: 200px; margin: 0 0 15px 15px; }


footer .fl, footer .fr { float: none; text-align: center; }
footer .links { margin-bottom: 0; }
footer .links a { margin-bottom: 10px; }
footer div.fr { margin-top: 30px; }
footer .fr a:last-child { display: block; width: 118px; margin: 20px auto; }
}
.mshow{
	display:block;
}
.head .shop-bag-btn {top: -2px;width: 60px;height: 59px;/* line-height: 58px; */left: 30px;text-align: center;font-size: 18px;border: 0;border-radius: 0;position: absolute;color: #363636;display:flex;}
.head .shop-bag-btn i,.head .shop-bag-btn span{ 
 margin:auto;
 vertical-align: middle;
}
.head .shop-bag-btn i:before{
 content:"";
 background: url(../images/12.gif?v=1.1) center no-repeat/cover;
 height:18px;
 vertical-align: middle;
 margin-top: -3px;

}