@charset "utf-8";

#mVisual { position: relative; overflow: hidden; width: 100%; height: 960px; /*max-width:2000px; */}
.mv_slider.slick-slide,
.mvWrap .slick-track,
.mvWrap .slick-list{ position:relative; height:100%; outline:none; }
#mVisual .plastic,
#mVisual .metal { position: relative;  float: center;  width: 100%; height: 960px; background-position: center; background-size: cover; }
#mVisual .plastic a,
#mVisual .metal a { width: 100%; height: 100%; display: table; padding: 0 3%; box-sizing: border-box; }
#mVisual .plastic a p,
#mVisual .metal a p  { display: table-cell; vertical-align: middle; color:#fff; font-size: 1.53em; font-family: 'Poppins', sans-serif; font-weight: 600;
                              letter-spacing: 0.2em; }
/* #mVisual .plastic { text-align: right; background-image: url("/images/mv_plastic6.jpg"); } */
#mVisual .plastic { background-image: url("/images/mv_banner1.jpg"); }
#mVisual .mv2 .plastic { background-image: url("/images/mv_banner2.jpg"); }
#mVisual .mv3 .plastic { background-image: url("/images/mv_banner3.jpg"); }
#mVisual .mv4 .plastic { background-image: url("/images/mv_banner4.jpg"); }

/* #mVisual .plastic p { padding-right: 50px; background: url("/images/arrow_right.png") no-repeat right center; }
#mVisual .metal p { padding-left: 50px; background: url("/images/arrow_left.png") no-repeat left center; } */

/* #mVisual .mv2 .plastic { text-align: right; background-image: url("/images/mv_plastic5_230523.jpg"); } */
/* #mVisual .mv2 .metal { background-image: url("/images/mv_metal5.jpg"); } */

@media all and (max-width:1480px) {
  #mVisual .plastic, #mVisual { height: 100vh; }
}

@media all and (max-width:976px) {
  #mVisual .plastic{ width: 100%; height: 100vh; }
}


#mCollection { overflow: hidden; text-align: center; padding: 8% 0;  background: #adb1ad; }
#mCollection .mtit{color:#fff;}
#mCollection .more{color:#fff;}

#mAbout { position: relative; overflow: hidden; background: url("/images/mAbout_230512.png") no-repeat right top; background-size: 50% cover; }
#mAbout .cont { width: 50%; height: 864px; background: #1d293f; display: table; }
#mAbout .cont h3 { position: absolute; left:0; top: 8%; text-align: left; font-family: 'Poppins', sans-serif; font-weight: 500;
                              padding-left: 100px; letter-spacing: 0.2em; font-size: 1.0em; color:#c8aa9a; }
#mAbout .cont h3::before { content:''; width: 86px; height: 1px; background: #c8aa9a; position: absolute; left:0; top: 50%; margin-top: -0.5px; }
#mAbout .cont div { display: table-cell; vertical-align: middle; text-align: center; color:#e8cec1; }
#mAbout .cont div h4 { font-size: 1.53em; font-family: 'Poppins', sans-serif; font-weight: 600; letter-spacing: 0.15em; }
#mAbout .cont div h4 span { display: inline-block; width: 135px; border-bottom: 2px solid #e8cec1; margin-left: -0.25em;}
#mAbout .cont div p { line-height: 2.2em; margin-top: 3em; font-weight: 300;  }

@media all and (max-width:1480px) {
  #mAbout { background-size: auto 100%; }
  #mAbout .cont { height: 60vw; }
}

@media all and (max-width:976px) {
  #mAbout { padding-top: 60vw; background-size: 100% auto; }
  #mAbout .cont { width: 100%;  height: 60vw; }
}

.mtit { color:#000; font-size: 1.33em; font-family: 'Poppins', sans-serif; font-weight: 500; letter-spacing: 0.25em; text-align: center; margin-bottom: 1em;}
.more { color:rgba(29,41,63,0.3); font-size: 0.86em; font-family: 'Poppins', sans-serif; font-weight: 500; letter-spacing: 0.25em;  display: inline-block;  margin-bottom: 5em;}

@media all and (max-width:1480px) {
.more { margin-bottom: 3em; }
}

#best-item {padding: 8% 0; overflow: hidden; text-align: center; }
#best-item .pdList { width: 90%; max-width: 1630px; margin: 5% auto 0; }


@media all and (max-width:1280px) {
  #best-item { padding: 10% 0; }
}

#mBrandstory { text-align: center; padding: 6% 0; background: url("/images/mBrandstory.png") no-repeat center; background-size: cover;  }
#mBrandstory p { color:#e8cec1; font-weight: 300; font-size: 0.93em; line-height: 2.2em; margin: 2.5em 0 3em; }
#mBrandstory a { color:#f0dace; border:1px solid #f0dace; display: inline-block; line-height: 3em; width:200px;
                          font-size: 0.66em; font-family: 'Poppins', sans-serif; font-weight: 500; letter-spacing: 0.3em; }

@media all and (max-width:1480px) {
  #mBrandstory { padding: 8% 0; }
}

@media all and (max-width:767px) {
  #mBrandstory { padding: 10% 0; }
  #mBrandstory img { max-width: 60%; }
}

.main-item { position: relative; width: 100%; overflow: hidden; display: table; }
.main-item > div { display: table-cell;  vertical-align: middle; }
.main-item > div.img { width: 29.5%; height: 38vw; background-repeat: no-repeat; background-position: center; background-size: cover; }
.main-item > div.itemWrap { width: 70.5%; text-align: center; box-sizing: border-box; padding: 0 2%; }

@media (max-width: 976px){
.main-item > div.itemWrap { padding: 3% 10%; }
}

@media (max-width: 767px){
.main-item > div.itemWrap { padding: 3% 6%; }
}

@media (max-width: 640px){
.main-item > div { display: block; }
.main-item > div.img { width: 100%; height: 50vw; }
.main-item > div.itemWrap { width: 100%; padding: 8% 6%; }
}

#plastic-item { padding: 8% 0; }
#plastic-item::before { content:''; position: absolute; width: 100%; height: 65%; left:0; top:0; z-index:-1;}
#plastic-item .img {  background-image: url("/images/plastic_item_230512.png"); }
#plastic-item .img.urbanimg{background-image: url("/images/line_urban_img1.jpg");}

@media (max-width: 640px){
#plastic-item { padding: 0 0 8% 0; }
}

#metal-item { direction: rtl; padding-bottom: 8%; }
#metal-item::before { content:''; position: absolute; width: 100%; height: 40%; left:0; bottom:0; z-index:-1}
#metal-item .img { background-image: url("/images/metal_item_230512.png"); }
#metal-item .itemList { direction: ltr; }

#bt-img { overflow: hidden; }
#bt-img img { width: 50%; float: left; }

@media all and (max-width:767px) {
#bt-img img { width: 100%; }
}
#metal-item .img.staimg{background-image: url("/images/line_sta_img1.jpg");}

#vodPop { position: fixed; top: 38%; left:5%; width: 600px; height: 500px; max-width: 90%; padding: 3% 2% 2%; text-align: center;
                 overflow: hidden; background: rgba(255,255,255,0.9); z-index:999; box-shadow: 5px 10px 10px rgba(0,0,0,0.2);
                 border-radius: 0 10px 0 10px;}
#vodPop .tit { font-size: 1.2em; font-weight: 700; color:#212121; margin-bottom: 2em; letter-spacing: 0.5em; }
#vodPop video { width: 100%; }
#vodPop .vod { width: 100%; height: 305px; }

#vodPop .btn_more { display: inline-block; color:#fff; background: #c8aa9a; line-height: 2.8em; border-radius: 40px;
                          padding: 0 1.5em; margin-top: 2em; font-weight: 600; font-size: 0.85em;  letter-spacing: 0.15em; }
#vodPop .close { position: absolute; top:0; right: 0; width: 40px; height: 40px; color:#fff; font-size: 0; display: block;
                          background: #c8aa9a url("/images/close.png") no-repeat center; }

@media all and (max-width:767px) {
#vodPop { padding: 7% 3% 5%; }
#vodPop .vod { width: 100%; height: 48vw; }
}
