@charset "utf-8";
 /* CSS Document */

 /*environment*/


 @media all {

   a:hover {
     text-decoration: none;
   }

   .st-active_topic {
     color: #d57606;
     font-weight: 600;
   }

   p {
     margin: 0;
   }

   ul,
   ol {
     padding: 0px;
     margin: 0px;
     -webkit-padding: 0px;
     -webkit-margin: 0px;
     list-style-type: none;
   }

   table {
     border-collapse: collapse;
     border-spacing: 0;
   }

   a {
     display: block;
     width: 100%;
     text-decoration: none;
     color: #333333;
     height: auto;
   }

   h1,
   h2,
   h3,
   h4,
   h5,
   h6 {
     margin: 0;
     padding: 0;
   }

   small {
     letter-spacing: 0px;
   }

   .ly-font_nor {
     font-size: 14px;
     color: #000000;
     letter-spacing: 0px;
   }

   .m-linkWhite {
     color: #ffffff;
     opacity: 1;
     -moz-opacity: 1;
     -webkit-opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
     -webkit-transition: all .5s ease-in-out;
     -moz-transition: all .5s ease-in-out;
     -ms-transition: all .5s ease-in-out;
     -o-transition: all .5s ease-in-out;
     transition: all .5s ease-in-out;

   }

   .m-linkWhite:hover {
     opacity: 0.8;
     -moz-opacity: 0.8;
     -webkit-opacity: 0.8;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
     color: #ffffff;
   }

   .ly-toTop {
     width: 61px;
     height: 61px;
     position: fixed;
     right: 35px;
     bottom: 35px;
     border-radius: 30px;
     display: none;
     z-index: 999;
     cursor: pointer;
     background: url(../img/layout/goTop.png) no-repeat center;
   }

   /*top nav*/

   .header h1 {
     text-indent: -999em;
     display: none;
   }

   .header {
     background: #f4f0e7;
     text-decoration: none;
     min-width: 1019px;
     height: 184px;
   }


   .main_nav .headerWrapper {
     padding: 0px 0px;
     background-repeat: no-repeat;
     background-position: 0px -50px;
   }

   .headerRow {
     padding: 10px 0px 0px;
     margin: 0px 0px;
   }

   .mainNav_pic {
     display: block;
     margin: 0 auto;
     text-align: center;
   }

   .mainNav_pic img {
     position: relative;
     top: 20px;
   }


   .mainNav_text {
     text-align: center;
     vertical-align: middle;
     line-height: 65px;
     letter-spacing: 0;
     position: relative;
     font-weight: 600;
     letter-spacing: 5px;
   }

   .mainNav_text .newPro {
     position: absolute;
     color: #ed1c24;
     letter-spacing: 0;
     bottom: 1em;
     line-height: 1;
     left: 0;
     right: 0;
     padding-right: 3px;
     margin: auto;
     font-family: 'Libre Baskerville', serif;
     font-size: 8.5px;
     -webkit-transform: scale(0.78);
   }


   .color_control {
     visibility: hidden;
   }

   .mainNav_noUse {
     opacity: 0.2;
     cursor: auto;
     filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
   }


   /*header*/

   .m-navPadTop {
     padding-top: 28px;
     float: right;
     padding-right: 10px;
   }

   .m-navPadTop li {
     list-style-image: url('../img/layout/listStyleTop.jpg');
     float: left;
     margin-left: 2em;
     text-align: center;
     font-size: 13px;
     padding-top: 5px;
     text-indent: 0;
     vertical-align: baseline;
   }



   .m-lgAndTp {
     float: left;
     margin-right: 12px;
   }

   .m-mainNav-color {
     width: 100%;
     height: 6px;
     position: relative;
     bottom: 0px;
   }

   .mainNav_sep:nth-child(1) .m-mainNav-color {
     background-color: #6ed0f5;
   }

   .mainNav_sep:nth-child(2) .m-mainNav-color {
     background-color: #b1d430;
   }

   .mainNav_sep:nth-child(3) .m-mainNav-color {
     background-color: #fd6900;
   }

   .mainNav_sep:nth-child(4) .m-mainNav-color {
     background-color: #658197;
   }

   .mainNav_sep:nth-child(5) .m-mainNav-color {
     background-color: #865899;
   }

   .mainNav_sep:nth-child(6) .m-mainNav-color {
     background-color: #ffd007;
   }

   .mainNav_sep:hover .m-mainNav-color,
   .mainNav_sep:focus .m-mainNav-color,
   .mainNav_sep:target .m-mainNav-color {
     background-color: rgb(214, 197, 177);
   }




   .mainNav_sep {
     -webkit-transition: background-color .3s linear;
     -moz-transition: background-color .3s linear;
     -ms-transition: background-color .3s linear;
     -o-transition: background-color .3s linear;
     transition: background-color .3s linear;
   }





   /*header_hover control */

   .droplist {
     display: none;
     position: absolute;
     z-index: 1000;
     border-bottom: 3px double #cab7a1;
   }

   .droplist .container {
     padding: 10px 0 20px 0;
   }

   .drop-row {
     /* height: 135px; */
     display: flex;
     flex-wrap: wrap
   }
   
   .nav_blockUse a .img-w {
     min-height: 86px;
     display: flex;
     align-items: center;
     justify-content: center;
   }

   .droplist .nav_blockUse,
   .droplist .nav_brandUse {
     width: 14%;
     display: inline-block;
     margin-left: -1px;
     position: relative;
     min-height: 1px;
     vertical-align: bottom;
     text-align: center;
   }

   .droplist .nav_brandUse {
     width: 15%;
     background-repeat: no-repeat;
     background-position: center center;
   }

   .nav_blockUse {
     display: flex !important;
     align-items: center;
     margin: 5px 0;
   }

   .nav_blockUse.child {
     width: 14.285714%;
   }

   .droplist_text {
     text-align: center;
     font-weight: 600;
     font-size: 11px;
     line-height: 14px;
     letter-spacing: 1px;
     -webkit-transform: scale(0.90);
     color: #ffffff;
     /*margin-top: 1em;*/
     margin: 5px 0 0 0;
     white-space: nowrap;
   }




   /*短框線*/


   .droplist .container:first-of-type .drop-row {
     border-top: none;
   }

   .droplist .container:last-of-type .drop-row {
     border-bottom: none;
   }

   .droplist .container:last-of-type {
     border-bottom: none;
     border-top: 1px solid #b9ad9f;
   }


   .ly-borderSet {
     width: 1020px;
     overflow: hidden;
     position: absolute;
     top: 35px;
   }

   .ly-borderSet_main {
     width: 1020px;
     overflow: hidden;
     position: relative;
     margin-bottom: -80px;
     top: 40px;

   }

   .nav_borderUse,
   .nav_borderUseLt,
   .nav_borderUseRt {
     width: 20%;
     float: left;
     position: relative;
     height: 75px;
     margin-bottom: 50px;
   }

   .nav_borderUse.child,
   .nav_borderUseLt.child,
   .nav_borderUseRt.child {
     width: 14.285714%;
   }

   .nav_borderUse_main,
   .nav_borderUseRt_main {
     width: 16.65%;
     float: left;
     position: relative;
     height: 75px;
   }

   .nav_borderUse {
     border-right: 1px solid #ded1c1;
     border-left: 1px solid #b9ad9f;
   }

   .nav_borderUseLt {
     border-right: 1px solid #ded1c1;
   }

   .nav_borderUseRt {
     border-left: 1px solid #b9ad9f;
   }

   .nav_borderUse_main {
     border-left: 1px dashed #b9ad9f;
   }

   .nav_borderUseRt_main {
     border-right: 1px dashed #b9ad9f;
     border-left: 1px dashed #b9ad9f;
   }


   /*短框線End*/

   /*slide*/

   .index_slide {
     position: relative;
     height: 460px;
     overflow: hidden;
     width: 100%;
   }

   .index_slide .film_roll_shuttle a {
     width: 100%;
     height: 463px;
     border-left: 1px solid #ffffff;
     border-right: 1px solid #ffffff;
   }

   .film_roll_prev {
     background: url(../img/slide_prev.png) no-repeat center center;
   }

   .film_roll_next {
     background: url(../img/slide_next.png) no-repeat center center;
   }

   .film_roll_pager {
     display: none;
   }

   .main_text {
     margin: 0 auto;
     display: block;
   }

   .main_visual {
     color: #ffffff;
     padding-top: 65px;
     padding-bottom: 65px;
     letter-spacing: 1px;
     height: 713px;
     position: relative;
   }

   .sup_img {
     margin-left: 20px;
     display: block;
     float: left;
   }

   .slide_text_sm {
     font-size: 12px;
   }

   .sub_visual {
     font-size: 34px;
     letter-spacing: 5px;
     padding: 29px 0;
     background: #ffffff;
     font-family: "新宋體", "NSimSun", "華文宋體", "STSong", Arial, "微軟雅黑體", "Microsoft YaHei";
   }

   .season_dot {
     background: url(../img/season/slide_navBg.png) no-repeat center 0;
     height: 60px;
     width: 230px;
     float: left;
     position: relative;
     left: 63px;
     padding: 23px 0 0 2px;
   }

   .season_dot li {
     width: 57px;
     height: 35px;
     float: left;
     margin-right: -1px;
   }

   .season_dotAct {
     background: #ffffff;
     opacity: 0.5;
   }

   /*footer*/

   .footer {
     padding: 45px 0 35px 0;
     background: #ffffff;
   }


   .footer li {
     list-style-image: url('../img/layout/listStyleTop.jpg');
     float: left;
     margin: 0px 12px;
     line-height: 16px;
     text-align: center;
     font-size: 13px;
     padding-top: 4px;
   }

   /*.footer li:nth-child(1) a {
	color: #e32466 !important;
}*/

   .footer-rights img,
   .footer-rights span {
     display: inline-block;
     vertical-align: middle;
     font-size: 12px;
   }

   .footer-rights img {
     height: 1em;
     width: auto;
   }

   /* End hide from IE-mac */

   .noFocus:focus {
     outline: none;
   }


   /*sup_navbar*/

   .slide {
     position: relative;
   }

   .sub_navbar {
     position: absolute;
     width: 100%;
     height: 50px;
     margin: auto;
     bottom: 0;
     left: 0;
     right: 0;
     text-align: center;
     z-index: 2;
   }

   .sub_navWrp {
     height: 100%;
     position: relative;
     display: flex;
     justify-content: center;
   }

   .sub-block_thins,
   .sub-block_filtrete,
   .sub-block_3m {
     margin: 0 2px !important;
   }

   .sub-block,
   .sub-block_thins,
   .sub-block_filtrete,
   .sub-block_3m {
     height: 50px;
     width: 142px;
     display: inline-block;
     margin-left: -4px;
     margin-right: 1px;
   }

   .sub-block_sup {
     flex: 1;
     width: 109px;
     margin: 0 2px;
     position: relative;
     background-color: #cfcfcf;
     font-size: 16px;
     line-height: 50px;
     vertical-align: middle;
     font-weight: bold;
   }

   .sub-block_sup:first-of-type {
     margin-left: 0;
   }

   .sub-block_sup:last-of-type {
     margin-right: 0;
   }

   .sub-block a,
   .sub-block_thins a,
   .sub-block_filtrete a,
   .sub-block_3m a {
     display: block;
     width: 100%;
     height: 100%;
   }

   .sub-block a:target,
   .sub-block a:focus,
   .sub-block_thins a:target,
   .sub-block_thins a:focus,
   .sub-block_filtrete a:target,
   .sub-block_filtrete a:focus,
   .sub-block_3m a:target,
   .sub-block_3m a:focus {
     opacity: 0.6;
   }

   .sub-block_sup a:hover,
   .sub-block_sup a:target,
   .sub-block_sup a:focus,
   .sub-block_sup.sup_active a {
     background-color: #fff;
     color: #000;
   }

   /* feature btn */



   /* brand btn */

   .sub-block_thins a {
     background: url(../img/brand/bg-btn_thins.jpg) no-repeat center;
     border-right: 1px solid transparent;
   }

   .sub-block_filtrete a {
     background: url(../img/brand/bg-btn_filtrete.jpg) no-repeat center;
     border-right: 1px solid transparent;
   }

   .sub-block_3m a {
     background: url(../img/brand/bg-btn_3m.jpg) no-repeat center;
   }

   .sub-block_thins a:hover,
   .sub-block_thins.sup_active a {
     background: url(../img/brand/bg-btn_thins-on.jpg) no-repeat center;
   }

   .sub-block_filtrete a:hover,
   .sub-block_filtrete.sup_active a {
     background: url(../img/brand/bg-btn_filtrete-on.jpg) no-repeat center;
   }

   .sub-block_3m a:hover,
   .sub-block_3m.sup_active a {
     background: url(../img/brand/bg-btn_3m-on.jpg) no-repeat center;
   }

   /* season btn */

   .sub-block_spring a {
     background: url(../img/season/bg-btn_spring.jpg) no-repeat center;
     border-right: 1px solid transparent;
   }

   .sub-block_summer a {
     background: url(../img/season/bg-btn_summer.jpg) no-repeat center;
     border-right: 1px solid transparent;
   }

   .sub-block_winter a {
     background: url(../img/season/bg-btn_winter.jpg) no-repeat center;
     border-right: 1px solid transparent;
   }

   .sub-block_child a {
     background: url(../img/season/bg-btn_child.jpg) no-repeat center;
   }

   .sub-block_spring a:hover,
   .sub-block_spring.sup_active a {
     background: url(../img/season/bg-btn_spring-on.jpg) no-repeat center;
   }

   .sub-block_summer a:hover,
   .sub-block_summer.sup_active a {
     background: url(../img/season/bg-btn_summer-on.jpg) no-repeat center;
   }

   .sub-block_winter a:hover,
   .sub-block_winter.sup_active a {
     background: url(../img/season/bg-btn_winter-on.jpg) no-repeat center;
   }

   .sub-block_child a:hover,
   .sub-block_child.sup_active a {
     background: url(../img/season/bg-btn_child-on.jpg) no-repeat center;
   }


   /*sideFixed*/

   .ly-fixedArea {
     position: fixed;
     right: -176px;
     top: 250px;
     width: 302px;
     height: 163px;
     cursor: pointer;
     z-index: 9999;
   }

   .ly-fixedButton {
     float: left;
     width: 80px;
     height: 163px;
     cursor: pointer;
     background: url(../img/activity/3M_fixedButton.gif) no-repeat left 15px;
   }

   .ly-fixedContent {
     float: left;
     width: 221px;
     position: relative;
     height: 237px;
     background: url(../img/activity/3M_basicBanner.png) no-repeat -1px 0;
   }

   .ly-brandContent {
     float: left;
     width: 222px;
     position: relative;
     height: 236px;
     background: url(../img/activity/3M_brandBanner.png) no-repeat -1px 0;
   }

   .ly-fixedContent a,
   .ly-brandContent a {
     position: absolute;
     width: 80%;
     height: 100%;
     right: 0;
   }

   /*sideFixed*/

   /* 3m logo add 20141208*/

   .logo_3m {
     margin-top: 23.5px;
   }

   .style_hide {
     list-style: none !important;
     visibility: hidden;
   }

   .icons {
     height: 20px;
     width: 20px;
     display: block;
     position: relative;
     margin-left: 98px;
     bottom: 40px;
   }

   .iconsLeftSide {
     overflow: hidden;
     width: 15px;
   }

   .iconsLeftSide:before {
     content: ' ';
     height: 10px;
     width: 10px;
     display: block;
     border: 2.5px solid #ffffff;
     border-left-width: 0;
     border-top-width: 0;
     transform: rotate(-45deg);
     -webkit-transform: rotate(-45deg);
     -moz-transform: rotate(-45deg);
     -o-transform: rotate(-45deg);
     -ms-transform: rotate(-45deg);
     position: absolute;
     top: 7px;
     right: 7px;
   }

   .iconsLeftSide.reopen:before {
     border-left-width: 2.5px;
     border-top-width: 2.5px;
     border-right-width: 0;
     border-bottom-width: 0;
     left: 2px;
     right: auto;
   }