@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: 'DINOT-BOLD';
  src: url(../fonts/DINOT-BOLD.ttf);
}	
@font-face {
  font-family: 'NUNITO-LIGHT'; 
  src: url(../fonts/NUNITO-LIGHT.ttf);
}
@font-face {
  font-family: 'TT1161M';
  src: url(../fonts/TT1161M.TTF);
}
@font-face {
  font-family: 'NTAILU'; 
  src: url(../fonts/NTAILU.TTF);
}
@font-face {
  font-family: 'NTAILUB';
  src: url(../fonts/NTAILUB.TTF);
}	
@font-face {
  font-family: 'chaoxiyuanjian';
  src: url(../fonts/chaoxiyuanjian.ttf),
  url(../fonts/chaoxiyuanjian.otf);
}
@font-face {
  font-family: 'TT1182M_';
  src: url(../fonts/TT1182M_.TTF);
}

body{ font-size:100%;line-height:1.1; width:100%; position:relative; background:none;font-family:NTAILU,sans-serif; overflow-x:hidden; min-width:1280px; padding-top:150px;}
*{ padding:0; margin:0;}
img{ max-width:100%;}
#bdshare_weixin_qrcode_dialog *,#bdshare_weixin_qrcode_dialog{ box-sizing:content-box; }
.j_tab{ display:table; text-align:center; width:100%; height:100%}
.j_tab_cel{ display:table-cell; vertical-align:middle; text-align:center; width:100%; height:100%;}
.j_tab_cel p{ white-space:normal; word-wrap:break-word; }
*{ margin:0; padding:0;}
h4, .h4, h5, .h5, h6, .h6,h1, .h1, h2, .h2, h3, .h3,p{ margin:0;}
h5{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
h5 a{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
img{ max-width:100%; max-height:100%;}
/*===========================header=============================*/

#header{ position: absolute; z-index:1; width:100%; background:#fff; top:0;}
.header{ background:none;}
.header .container{ height:100px; position:relative;}
#logo{ width:166px; height:100%; margin:0 auto; z-index:99;}
#logo img{ margin-bottom:6px; height:69px; }
#nav{ height:50px; text-align:center; border-top:1px solid #eee; width:100%; background:#fff;}
#nav.xg{ position:fixed; top:0; border-bottom: 1px solid #eee;}
#nav ul{}
#nav ul li{ display:inline-block; height:50px; line-height:50px; padding:0 1.25rem; position:relative; z-index:0;}
#nav ul li a{ font-size:16px; color:#313232; transition:.3s;font-family: 'NUNITO-LIGHT';}
#nav ul li.on a{ color:#acce22;}
#nav ul li:hover a{ color:#acce22;}

#search_btn{ position:absolute; top:0; left:180px; height:100px; width:5.9375rem; text-align:center; cursor:pointer; font-size:14px; color:#313232;  z-index:99;}
#search_btn img{ width:15px; margin-right:10px; position:relative; top:-1px; }
.header .search_btn:before,.header .search_btn:after{ content:""; width:15px; height:17px; display:inline-block; background:url(../images/search.svg) center no-repeat; background-size:100% 100%; transition: transform 0.4s ease, opacity 0.4s ease; margin-right:10px;position: absolute; top:50%; margin-top:-10px; left:0;}
#nav_btn_box{ position:absolute; top:0; right:0; height:100px; z-index:999999999;}
#nav_btn_box.on{ background:none; position:fixed;}
#nav_btn{}
#nav_btn .point.on .navbtn::after, #nav_btn .point.on .navbtn::before{ background:#fff;}

.header .dw2{ position:absolute; top:0; left:0; height:100%; z-index:99;}
.header .dw2 .dh{  height:29px; line-height:29px; text-align:center; font-size:14px; color:#313232; cursor:pointer; padding-left:30px; }
.header .dw2 .dh img{ margin:0 10px; position:relative; width:17px;}
.header .dw2 .dh:before,.header .dw2 .dh:after{ content:""; width:17px; height:17px; display:inline-block; background:url(../images/yuyan_ico.svg) center no-repeat; background-size:100% 100%;    transition: transform 0.4s ease, opacity 0.4s ease; margin-right:10px;position: absolute; top:50%; margin-top:-10px; left:0;}
.header .dw2 .dh span img{  width:9px;}
.header .dw2 .dd{ padding-bottom:10px; padding-top:10px; position:absolute; top:80px; width:100px; text-align:center; background:#fff; left:50%; margin-left:-50px; border:1px solid #ddd;opacity: 0; visibility: hidden; transition: 400ms; transform: translateY(15px);}
.header .dw2 .dd a{ display:block; text-align:center; line-height:30px; color:#666; font-size:13px; padding:0 10px;}
.header .dw2 .dd a:hover{ color:#acce22;}
.header .dw2 .dd.on{opacity:1; visibility: visible; transform: translate(0);}

/*导航按钮开始*/
#header .btnAllMenu {position: relative;width: 40px;height:  40px; z-index:99;}
#header .btnAllMenu > a { display:block; width:40px; height:40px; font-size:0; transition:all .3s ease;}
#header .btnAllMenu > a:before { content:''; display:block; position:absolute; top:10px; left:10px; width:4px; height:4px; background:#000; transition:all .5s ease;}
#header .btnAllMenu > a:after { content:''; display:block; position:absolute; top:10px; right:10px; width:4px; height:4px; background:#000; transition:all .5s ease;}
#header .btnAllMenu > a span:before { content:''; display:block; position:absolute; bottom:10px; left:10px; width:4px; height:4px; background:#000; transition:all .5s ease;}
#header .btnAllMenu > a span:after { content:''; display:block; position:absolute; bottom:10px; right:10px; width:4px; height:4px; background:#000; transition:all .5s ease;}
#header .btnAllMenu > a:hover { transform:rotate(90deg);}
#header .btnAllMenu > a:hover:after,
#header .btnAllMenu > a:hover:before,
#header .btnAllMenu > a:hover span:after,
#header .btnAllMenu > a:hover span:before { width:8px; height:8px;}
/*导航按钮结束*/
#header.act { position:fixed; height:50px;}
#header.act #search_btn{ top:0; height:50px; right:120px; left:auto;}
#header.act .dw2{ display:none; height:50px;}
#header.act #logo{ top:0; height:50px; position:absolute; left:0;}
#header.act #logo img{ height:40px;}
#header.act #nav_btn_box{ top:0; height:50px;}


.m_nav_list{ display:inline-block; overflow: auto; }
.m_nav_list::-webkit-scrollbar {display:none}
#m_nav {
    z-index: 99999;
    position: fixed;
    background:#fff;
    width: 100%;
    height:0;
    right: 0;
    top: 0; opacity:0; visibility:hidden;
    overflow:hidden;
    pointer-events: none;
    transition: all .7s ease-out;
    -webkit-transition: all .7s ease-out;
    -moz-transition: all .7s ease-out;
    -o-transition: all .7s ease-out;
    -ms-transition: all .7s ease-out;
    text-align:center;
    }
#m_nav:after{ content:""; width:100%; height:100%; position:absolute; left:0; z-index:-1; background:url(../images/m_nav_bg.jpg) center bottom no-repeat; transform:scale(2); opacity:0; background-size:100%; top:0;
transition: all 2s ease-out;
    -webkit-transition: all 2s ease-out;
    -moz-transition: all 2s ease-out;
    -o-transition: all 2s ease-out;
    -ms-transition: all 2s ease-out}
#m_nav .header{ margin-bottom:100px;}
#m_nav:before{ content:""; position:absolute; width:100%; height:1px; background:#eee; top:269px; left:0;}
#m_nav.act{ pointer-events: auto; right:0; top:0; opacity:1; visibility:visible; height:100vh;transition: all .5s ease-out;
    -webkit-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    -ms-transition: all .5s ease-out;}
#m_nav.act:after{ top:0; transform:scale(1); opacity:1;}
#m_nav>ul>li{ overflow:hidden; float:left; display:inline-block;}
#m_nav>ul>li+li{ padding-left:6.5rem; }
#m_nav li .a{}
#m_nav li .a h3{ line-height:4.5rem; height:4.5rem; color:#313232; padding:0; font-size:20px; float:left; position:relative;}
#m_nav li .a h3:before{ content:""; width:0; height:3px; display:block; position:absolute; right:0; bottom:0; background:#acce22; border-radius:3px; transition:.5s;}
#m_nav li.on .a h3:before,#m_nav li:hover .a h3:before{ width:80px; left:0; right:auto; }

#m_nav li .a span{ display:block; position:absolute; top:0; right:10px; width: 20px; height: 50px; text-align:center;}
.slide_nav{ position: absolute; left:0; height: 70px; z-index: 998; padding:15px; top:0; width: 100%; }
#m_nav li .list{position:relative;width:100%;z-index:9;left:0;margin-left:0;background:none;border:0;clear: both;padding-bottom:10px; top:20px; }
#m_nav li .list span{ background:none; }
#m_nav li .list span a:hover,#m_nav li .list span.on a{ color: #acce22;}
#m_nav li .list a{display:block;font-size:1rem;color:#3d3d3d;text-align:left;line-height:40px; height: 40px; border:0; font-weight:300; transition:.3s; }
/*三级导航 开始*/
#m_nav li .list .void>a{background-size:10px; position:relative;}
#m_nav li .list span{ position:relative; display:block;}
#m_nav li .list span .sub{ position: static; width:100%;display: block !important; overflow:hidden;}
#m_nav li .sub a{ background:none; font-size:.875rem; opacity:.8; min-width:50%; float:left; display:inline-block; color:#999;}

.nav_close {position: absolute; width: 40px;height:  100%; z-index:99; right:0; top:0; cursor:pointer; font-size:30px; }


.tc{ transition:all ease 300ms; position: fixed; width: 100%; height: 100%;  top: 0; left: 0; z-index:9999999999; pointer-events: none; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0;}
.tc.act{ filter:alpha(opacity=100);   -moz-opacity:1;   -khtml-opacity: 1;   opacity: 1;  display: block;  pointer-events: auto;}
.tc-box{
  width: 60rem; padding-top:40px;
  max-width:80%;
  margin:0 auto; margin-top:-80px;
  box-sizing:border-box;
  /* background:#fff; */
  display: block;
  position:relative;
  z-index:1;
  -webkit-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  overflow:  hidden;
  }
.tc.act .tc-box{ -webkit-animation-name: anim-open-2; animation-name: anim-open-2; transform:scale(1);}
.close{ position: absolute; cursor:pointer; color:#e13a39; font-size:30px; right: 30px; top: 30px;}
.tc_bg { height: 100%; background: rgba(0,0,0,.85); position: absolute; top: 0; left: 0; width: 100%; z-index: 0;}
.tc_txt{ height:470px; overflow-y:auto; padding-right:30px;}
/*弹窗内容样式*/
.tc-box form{ position:relative;border-bottom:2px solid #eee; height:4.25rem; padding-right:20px; position:relative;}
.tc-box .tc_fdj{ position:absolute; left:20px; display:block; height: 4.25rem; line-height: 4.25rem;}
.tc-box .tc_fdj img{ width:1.3rem;}
.tc-box form label{ text-align:left; display:block; position:absolute; bottom:0; height: 4.25rem; line-height: 4.25rem;font-size:1.6rem; color:#999; pointer-events:none; margin-left:20px; transition:.3s;}
.tc-box form label.act{ font-size:16px; bottom:3rem;line-height: 3rem; height:3rem;}
.tc-box #keyword{width: 80%;height:4.25rem; padding:0 20px;font-size:1.6rem; color:#999;box-shadow:none;-webkit-appearance: none;float:left;border-right: 0; background:none;}
.tc-box .btn_blue{width: 40px;height:4.25rem;line-height:4.25rem;background:url(../images/search.png) center center no-repeat;font-size:1.125rem;color:#fff;cursor:pointer;text-transform:uppercase;float:right;}
.tc-box .btn_blue.fr{ background:#e9edef; color:#4e4f53;}

/* icon hover */
.icon_hover::before,
.icon_hover::after {
display: block;
transition: transform 0.4s ease, opacity 0.4s ease;
}

.icon_hover::after {
position: absolute;
transform: translateY(8px);
opacity: 0;
}
.icon_hover:hover::before {
transform: translateY(-8px);
opacity: 0;
}
.icon_hover:hover::after {
transform: translateY(0);
opacity: 1;
}
	  
	  
/* 主体开始*/
#s_mian{  }

.innerBox {
    position: relative;
    max-width: 1280px;
    padding: 0 40px;
    margin: 0 auto;
}
/*首页banner*/

.banner{ height:592px; width:100vw; position:relative;}
.banner  li{text-align:left; }
.banner li .img{ position: relative; left:0; top:0; width:100%; height:592px; background-size:cover !important; }
.banner li.slick-active .img{ }
.banner .slick-arrow{width:36px;height:36px;opacity: 1;z-index:99;}
.banner .slick-prev:before, .banner .slick-next:before{ font-size:3rem;}
.banner .slick-prev{ left:6rem;}
.banner .slick-next{ right:6rem;}
.banner li .img{position: relative;left:0;top:0;width:100%;height:592px;background-size:cover !important;/* -webkit-transform: scale(1.1); *//* transform: scale(1.1); */}
.banner li.slick-current .img{visibility: visible !important;}

#banner li .con{position:absolute;width:1200px;left:50%;margin-left:-600px;top: 55%;margin-top: -145px;height:162px;}
#banner li .con .box{ float:right;width:100%; position:relative; text-align:center}
#banner li .con .box .dd1{  width:100%; white-space:nowrap;font-size:14px;color:#fff; line-height:1.5; margin-bottom:30px; position:relative; top:-20px; transition:1.5s .5s; opacity:0;}
#banner li .con .box .dd2{ white-space:nowrap; font-size:61.5px; color:#fff; margin-bottom:13px; text-align:center; position:relative; top:-40px; transition:1.5s .5s; opacity:0;font-family: 'chaoxiyuanjian';}
#banner li .con .box .dd3{ white-space:nowrap;font-size:17px; line-height: 18px;color: rgba(255,255,255,0.65); position:relative; top:-60px; transition:1.5s .5s; opacity:0;font-family: 'chaoxiyuanjian';}
#banner li .con .box .j_btn{ display:block; width:210px; height:50px; line-height:50px; color:#fff;font-family: 'chaoxiyuanjian'; font-size:14px; text-transform:uppercase; border:1px solid #fff; border:1px solid rgba(255,255,255,.5); margin:0 auto; margin-top:55px; position:relative; top:-80px; transition:1.5s .5s; opacity:0; border-radius:5px;}
#banner li.slick-current .con .box h3{ top:0; opacity:1;}
#banner li.slick-current .con .box h5{ top:0; opacity:1;}
#banner li.slick-current .con .box h6{ top:0; opacity:1;}
#banner li.slick-current .con .box .j_btn{ top:0; opacity:1;}

.banner .bot{ position: absolute; left: 0px; bottom: 0px; background-color: #014085; height: 3px; overflow: hidden;}
.banner .slick-active .bot { -moz-animation: a_slidercurrent 5s linear; -webkit-animation: a_slidercurrent 5s linear; -o-animation: a_slidercurrent 5s linear; animation: a_slidercurrent 5s linear;}
@-moz-keyframes a_slidercurrent {from { width: 0%; } to { width: 100%; }}
@-webkit-keyframes a_slidercurrent {from { width: 0%; } to { width: 100%; }}

.mouse { position: absolute; left:50%; bottom: 116px; margin-left:-10px; text-align: center; z-index: 50; opacity:.55; display:none}
.mouse span { display: inline-block; width: 24px; height:36px; border:2px solid #fff; border-radius:12px; margin: auto; position: relative; }
.mouse span:after{ content:""; width:11px; height:18px; background:url(../images/mouse_tail.png) center no-repeat; display:block; position:absolute; bottom:-28px; left:50%; margin-left:-5.5px;}
.mouse span:before { content: ""; width: 2px; height: 7px; background: #fff; position: absolute; left: 50%; margin-left: -1px; top: 3px; animation-delay: 0ms; animation-duration: 1500ms; animation-iteration-count: infinite; animation-name: arrow; animation-play-state: running; animation-timing-function: linear; }
.mouse b { display: block; text-align: center; color: #766047; font-size: 18px; line-height: 1; font-family: Arial; margin-top: 4px; font-weight: normal; }
@-webkit-keyframes arrow {
    0% { opacity: 0; -webkit-transform: translate3d(0px, 0px, 0px); }
    33% { opacity: 1; }
    66% { opacity: 1; }
    100% { opacity: 0; -webkit-transform: translate3d(0px, 5px, 0px); }
}

@keyframes arrow {
    0% { opacity: 0; transform: translate3d(0px, 0px, 0px); }
    33% { opacity: 1; }
    66% { opacity: 1; }
    100% { opacity: 0; transform: translate3d(0px, 5px, 0px); }
}

/* 主体开始*/



.mainSec01 { padding:100px 0; text-align:center; position:relative;}
.mainSec01 h2 { font-size:14px; color:#131313; font-weight:bold; text-transform:uppercase; letter-spacing:3px;}
.mainSec01 .tit { margin:60px auto 0; font-size:34px; color:#111111; font-weight:300; font-family:"chaoxiyuanjian"; font-weight:300;}
.mainSec01 .tit span { display:block; font-size:16px; color:#111; font-weight:300; margin-top:20px;}
.mainSec01 .imgBox { position:relative; margin-top:60px; font-size:0}
.mainSec01 .imgBox .text { position:absolute; top:50%; left:0; right:0; z-index:1; text-align:center; font-size:20px; color:#ffffff; letter-spacing:8px; text-transform:uppercase; font-weight:200; transform:translateY(-50%);}
.mainSec01 .imgBox .img1 { position:relative; top:0px; right:-20px; display:inline-block; width:50%; font-size:0; transition:all .6s ease; opacity:0;}
.mainSec01 .imgBox .img2 { position:relative; top:0px; left:-20px; display:inline-block; width:50%; font-size:0; transition:all .6s ease .2s; opacity:0;}
.mainSec01 .btnPrev { position:absolute; top:100px; left:40px; width:49px; height:49px; font-size:0px; background:url(../images/btn_arrow.png) no-repeat;}
.mainSec01 .btnNext { position:absolute; top:100px; right:40px; width:49px; height:49px; font-size:0px; background:url(../images/btn_arrow.png) no-repeat; transform:rotate(180deg);}
.mainSec01 .dotList { position:relative; height:40px; margin:0 -50px; margin-top:60px;}
.mainSec01 .dotList:before { content:''; display:block; position:absolute; top:50%; left:0; right:0; height:1px; background:#e5e5e5;}
.mainSec01 .dotList a { display:block; width:160px; height:40px; border-radius:20px; border:1px solid #ebebeb; box-sizing:border-box; line-height:38px; text-align:center; background:#fff; transition:all .3s ease; float:left; position:relative; margin:0 50px;}
.mainSec01 .dotList a.on,
.mainSec01 .dotList a:hover { border-color:#000; color:#000;}
.mainSwipeWrap{ overflow:hidden;}
.mainSec01 .slick-active .img1 { right:0; opacity:1;}
.mainSec01 .slick-active .img2 { left:0; opacity:1;}
.m_1200{ width:1200px; margin:0 auto}


.mainSec02 { position:relative; text-align:center;}
.mainSec02 h2 { position:absolute; top:95px; left:0; right:0; z-index:1; font-size:14px; color:#fff; font-weight:bold; text-transform:uppercase; letter-spacing:3px;}
.mainSec02 .tit { position:absolute; top:180px; left:0; right:0; z-index:1; font-size:34px; color:#ffffff; font-weight:100; letter-spacing: 2px; transform:translateY(-20px); transition:all .3s ease; opacity:0;font-family: 'chaoxiyuanjian';}
.mainSec02 .tit span { font-weight:350}
.mainSec02 .img { height:900px;}
.mainSec02 .img img { position:absolute; height:900px; top:0; left:50%; max-width:inherit; transform:translateX(-50%);}
.mainSec02 .whiteBox { position:absolute; top:330px; left:50%; width:1000px; height:380px; padding:50px 40px 0 420px; color:#fff; text-align:left; background:rgba(255,255,255,0.97); transform:translateY(-20px) translateX(-50%); transition:all .5s ease .3s; opacity:0;}
.mainSec02 .whiteBox:before { content:''; display:block; position:absolute; bottom:-15px; left:-78px; width:159px; height:164px; background:url(../images/bg_mainSec02_1.png) no-repeat}
.mainSec02 .whiteBox h3 { position:absolute; top:60px; left:70px; min-width:143px; text-align:center; font-size:40px; color:#87a269; font-weight:100; letter-spacing:5px; line-height:1;font-family:'Letter Gothic Std','chaoxiyuanjian';}
.mainSec02 .whiteBox h3:before {content:''; display:block; position:absolute; top:5px; right:-110px; width:80px; height:1px; background:#19460a;}
.mainSec02 .whiteBox .text { font-size:18px; color:#111;}
.mainSec02 .whiteBox .text2 { margin-top:25px; font-size:14px; color:rgba(17,17,17,0.7); line-height:2.0;}
.mainSec02 .whiteBox .btnSec02More { display:block; position:absolute; left:120px; bottom:120px; width:33px; height:33px; font-size:0; background:url(../images/btn_more2.png) no-repeat;}
.mainSec02 .slick-dots { position:absolute; bottom:100px; left:0; right:0; text-align:center;}
.mainSec02 .slick-dots li { display:inline-block; margin:0 10px;}
.mainSec02 .slick-dots li button { width:10px; height:10px; border-radius:50%; border:1px solid #ffffff; font-size:0;}
.slick-dots li button:before{ display:none;}
.slick-dotted.slick-slider{ margin:0;}
.mainSec02 .slick-dots li.slick-active button { background:#fff;}

.mainSec02 .slick-active .tit { transform:translateY(0); opacity:1;}
.mainSec02 .slick-active .whiteBox { transform:translateY(0) translateX(-50%); opacity:1;}

.mainSec03 { position:relative; padding:100px 0; text-align:center; background:#f7f7f7; }
.mainSec03 h2 { font-size:14px; color:#111; font-weight:bold; text-transform:uppercase; letter-spacing:3px;}
.mainSec03 .tit { margin-top:70px; font-size:40px; color:#111; font-weight:100; letter-spacing: 2px; font-family:"chaoxiyuanjian"}
.mainSec03 .tit strong { font-weight:bold; font-family: TT1161M; }
.mainSec03 .tit i {
    font-family: "TT1182M_";
}
.mainSec03 .hashTag { margin-top:25px; color:#3c3c3c; font-size:14px;}
.mainSec03 .mainSwipeWrap { margin-top:80px;}
.mainSec03 .mainSwipeBox3 { margin:0 auto;}
.mainSec03 .mainSwipeBox3 .slick-list { overflow:visible;}
.mainSec03 .mainSwipeBox3 .mainSwipe { padding:0 15px; padding-bottom:100px;}
.mainSec03 .mainSwipeBox3 .mainSwipe .img { position:relative; transition:all .3s ease;}
.mainSec03 .mainSwipeBox3 .mainSwipe .img:before { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.3); transition:all .3s ease; opacity:0;}
.mainSec03 .mainSwipeBox3 .mainSwipe .img .text { position:absolute; bottom:0; left:0; right:0; top:0; text-align:center; font-size:14px; line-height:22px; color:#fff; transition:all .3s ease; opacity:0; padding:0 40px;}
.mainSec03 .mainSwipeBox3 .mainSwipe .textBox { overflow:hidden; margin-top:26px; transition:all .3s ease;}
.mainSec03 .mainSwipeBox3 .mainSwipe .textBox a { display:block;}
.mainSec03 .mainSwipeBox3 .mainSwipe .textBox .text { font-size:18px; color:#000000; font-weight:450; text-transform: uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family: 'NUNITO-LIGHT'; font-weight: bold;}
.mainSec03 .mainSwipeBox3 .mainSwipe .textBox .text2 { margin-top:10px; font-size:13px; color:#5f5f5f; font-style:italic;}
.mainSec03 .mainSwipeBox3 .mainSwipe .btnCircleMore { display:block; width:30px; height:30px; margin:35px auto 0; font-size:0; background:url(../images/btn_more.png) no-repeat; transition:all .3s ease; transform-origin:center;}
.mainSec03 .mainSwipeBox3 .mainSwipe .btnCircleMore:hover { transform:rotate(180deg);}
/*
.mainSec03 .mainSwipeBox3 .slick-active {}
.mainSec03 .mainSwipeBox3 .slick-active .img { margin-top:-50px;}
.mainSec03 .mainSwipeBox3 .slick-active .img:before { opacity:0;}
.mainSec03 .mainSwipeBox3 .slick-active .img .text { opacity:0;}
.mainSec03 .mainSwipeBox3 .slick-active .textBox { height:100%; margin-top:60px; opacity:1;}
*/
.mainSec03 .mainSwipeBox3 .slick-slide:hover {}
.mainSec03 .mainSwipeBox3 .slick-slide .img:hover { }
.mainSec03 .mainSwipeBox3 .slick-slide .img:hover:before { opacity:1;}
.mainSec03 .mainSwipeBox3 .slick-slide .img:hover .text { opacity:1;}
.mainSec03 .mainSwipeBox3 .slick-slide:hover .textBox { height:100%; opacity:1;}

.mainSec03 .slick-dots { display:none; position:absolute; bottom:0px; left:50%; right:0; text-align:center; width:800px; margin-left:-400px;}
.mainSec03 .slick-dots li { display:inline-block; margin:0 10px;}
.mainSec03 .slick-dots li button { width:10px; height:10px; border-radius:50%; border:1px solid #000000; font-size:0;}
.mainSec03 .slick-dots li.slick-active button { background:#000000;}

.mainSec04{ overflow:hidden; padding:100px 0;}
.mainSec04 ul{ margin:0 -65px;}
.mainSec04 ul li{ width:20%; float:left; text-align:center;}
.mainSec04 ul li span{ font-size:56px; color:#464646;}
.mainSec04 ul li p{ font-size:16px; line-height:24px;}

.mainSec05{ height:290px; background:url(../images/mainSec05_bg.jpg) center no-repeat; padding:50px 0; text-align:center;}
.mainSec05 .tt{ text-align:center; margin-bottom:30px;}
.mainSec05 .form-group{ width:212px; display:inline-block; position:relative;}
.mainSec05 .form-group+.form-group{ margin-left:11px;}
.mainSec05 .form-group label{ position:absolute; top:10px; left:22px;}
.mainSec05 .form-group input{ height:45px; line-height:45px; border:0; border-radius:25px; padding-left:48px; font-size:14px; color:#5a5c61; font-style:italic;}
.mainSec05 button{ display:block; margin:0 auto;height:45px; width:212px; color:#fff !important; background:#acce22 !important; border-radius:25px; border:0; margin-top:13px; outline: 0;}
.mainSec05 button img{ margin-right:12px;}

:focus { outline:none !important;z-index: 10000 }
input::-moz-focus-inner,
button::-moz-focus-inner {
    border: 0;
}

.container,s_container,#nav{ min-width:1280px; }

/*foot*/
.foot{ background:#f6f6f7; padding-top:4.5rem; position:relative;}
.foot .container{ position:relative;}
.foot_nav{ float:left; }
.foot_nav h3{ font-size:18px; color:#343434; margin-bottom:20px;}
.foot_nav ul li{float:left; padding-left:300px;}
.foot_nav .list a{ display:block; font-size:14px; color:#434343; line-height:28px; }
.foot_logo{ text-align:left;}
.foot_logo img.logo{ display:block; margin-bottom:25px; width:197px; margin-top:-15px;}
.foot_logo .txt span{ display:inline-block; font-size:12px; color:#747474;}
.foot .social-share-block {
margin: 28px 0 8px; }
.foot .social-share-block li {
display: inline-block; width:25px; height:25px;
vertical-align: middle;
margin-right: 8px; }
.foot .social-share-block li a {
display: table-cell; height:22px;vertical-align: middle;
-webkit-transition: ease 0.3s;
-moz-transition: ease 0.3s;
-ms-transition: ease 0.3s;
-o-transition: ease 0.3s;
transition: ease 0.3s; }
.foot .social-share-block li a:hover {
  opacity: 0.6; }
.foot .social-share-block li:last-of-type {
margin-right: 0; }
.foot_lianxi{ width:335px;}
.foot_lianxi h3{ font-size:18px; color:#333; text-transform:uppercase; margin-bottom:20px;}
.foot_lianxi ul{}
.foot_lianxi ul li{ position:relative; padding-left:27px; font-size:14px; line-height:24px; color:#444; margin-bottom:10px;}
.foot_lianxi ul li span{ position:absolute; left:0; top:0; display:block; line-height:22px; width:25px;}

.foot_bot{ font-size:14px; min-height:65px; line-height:21px; padding:0 10px; padding-top:24px; margin-top:60px; color:#8d8d8d;padding-bottom:20px; border-top:1px solid #e1e1e3; text-align:center;}
.foot_bot *{ color:#8d8d8d; font-size:14px; display:inline-block;}
.foot_bot a{ color:#8d8d8d; transition:.3s;}
.foot a:hover{ color:#333;}
.foot a{ transform:.3s;}



/*内页*/

.ar_article{ font-size:0.9375rem; color:#666666; line-height:1.875rem; }
.ar_article p{font-size:0.9375rem;color:#666666;line-height:1.875rem;  padding-bottom:1rem; margin:0;}	
.ar_article strong{ font-weight:bold;}
.ar_article td,.ar_article th{ padding:15px; border: 1px solid #c6c5c5; background:#f7f7f7; text-align:center;}
.ar_article td p,.ar_article th p{ padding-bottom:0; margin-bottom:0; text-align: inherit;}
.ar_article img{ max-width:100%;}
.ar_article a{ color:#818181;}
.ar_article ul li,
.ar_article ol li{ padding-bottom:0 !important; margin-bottom:0 !important; margin-left:2rem;}
.ar_article ul li p,
.ar_article ol li p{ padding-bottom:0; margin-bottom:3px !important; }
.ar_article ul,
.ar_article ol{ margin-bottom:15px;}
.ar_article sub {
    vertical-align: sub;
    font-size: smaller;
}

.ar_article sup {
    vertical-align: super;
    font-size: smaller;
}



/* =========================================================================== */
.locationImg { position:relative; height:500px; text-align:center;}
.locationImg h1 { font-size:30px; color:#ffffff; font-weight:300;}
.locationImg h1 *{ font-size:30px !important; color:#ffffff; font-weight:300; margin:0 !important;}
.locationImg p { margin-top:25px; font-size:14px; color:#fff; letter-spacing: 3px;}
.locationImg .textBox { position:absolute; top:50%; left:50%;font-family: 'chaoxiyuanjian'; font-size:30px; line-height:42px; transform:translate(-50%,-50%);}
.locationImg.type1 { background:url('../images/about/bg_about1.jpg') no-repeat center center; background-size:cover;}
.locationImg.type2 { background:url('../images/product/bg_product1.jpg') no-repeat center center; background-size:cover;}
.locationImg.type3 { background:url('../images/RnD/bg_RnD1.jpg') no-repeat center center; background-size:cover;}
.locationImg.type4 { background:url('../images/brand/bg_brand1.jpg') no-repeat center center; background-size:cover;}
.locationImg.type5 { background:url('../images/notice/bg_notice1.jpg') no-repeat center center; background-size:cover;}
.locationImg.type6 { background:url('../images/recruitment/bg_recruitment1.jpg') no-repeat center center; background-size:cover;}

.locationWrap { height:68px; border-bottom:1px solid #e5e5e5; overflow:hidden;}
.locationWrap .btnHome { display:block; position:absolute; top:0; left:40px; width:80px; height:60px; font-size:0; background:url('../images/common/icon_home.png') no-repeat center center;}
.locationWrap .innerBox > div {  }

.locationWrap ul { width:100%;}
.locationWrap ul:after { content:''; display:block; clear:both;}
.locationWrap ul li { float:left; display:table; table-layout:fixed; margin-right:20px; position:relative; height:68px; text-align:center;}
.locationWrap ul li a { display:table-cell; width:100%; height:68px; text-align:center; vertical-align:middle;font-family: 'NUNITO-LIGHT';}
.locationWrap ul li:after { content:''; display:block; position:absolute; bottom:0; right:0px; height:2px; width:0; background:#acce22; transition:.5s;}
.locationWrap ul li.on:after,.locationWrap ul li:hover:after { width:100%; left:0; right:auto; }

.locationWrap .location.fixed { position:fixed; top:50px; left:0; right:0; z-index:5; width:100%; max-width:100%; height:68px; padding-top:0; border-bottom:1px solid #e5e5e5; background:#fff;}


h2.subTit { padding-top:75px; font-size:34px; color:#111; text-align:center;}
h2.subTit span { display:inline-block; padding-bottom:10px; border-bottom:1px solid #000; font-weight:100;}
p.subTit { margin-top:20px; font-size:14px; color:#111; font-weight:300; text-align:center;}
/*p.subTit { margin-top:20px; font-size:14px; color:rgba(17,17,17,0.3); font-weight:300; text-align:center;}*/


#n_mian{ min-height:500px; padding-top:68px; padding-bottom:80px; overflow: hidden;}
.m{ width:1200px; margin:0 auto;}
.position{ font-size:12px; color:#8d8d8d; height:68px; line-height:68px; position:absolute; top:0; right:0;}
.position img{ position:relative; top:-2px; margin-right:5px;}
.position a{ color:#3d3d3d; }

#n_pro_xq{}
#n_pro_xq .img img{ width:362px; height:434px;}
#n_pro_xq .txt{ width:700px; height:434px; float:right;}
#n_pro_xq .txt .j_tab_cel{ text-align:left; line-height:30px;}
#n_pro_xq .txt .tt{ font-size:26px; color:#000; text-transform:uppercase; margin-bottom:6px;}
#n_pro_xq .txt .tag{ font-size:15px; color:#3c3c3c; margin-bottom:35px; font-style:italic;}
#n_pro_xq .txt dt{ font-size:14px; color:#3e3e3e; line-height:28px; font-weight:bold;}
#n_pro_xq .txt dd{ font-size:14px; color:#3e3e3e; line-height:28px; margin-bottom:20px;}


#n_RD{}
#n_RD .list_pic{ margin-top:20px;}
#n_RD .list_pic ul{ margin-right:-15px;}
#n_RD .list_pic ul li{ width:390px; height:300px; float:left; margin-right:15px; margin-bottom:15px;}
#n_RD .list_pic ul li img{ width:100%; height:100%;border-radius:50px;}

#gotop{ position:fixed; z-index:90; bottom:80px; right:150px; box-sizing:border-box; text-align:center; cursor:pointer; -moz-transition:all .8s; -webkit-transition:all .8s; width:45px; height:45px;}
#gotop img{ width:45px; }
#gotop.hide { bottom:-80px; display:block !important;}
#gotop:hover {}

#n_who{}
#n_who .box1 { padding-bottom:50px; overflow:hidden; border-bottom:1px solid #ebe9ee;}
#n_who .box1 .img{ width:432px; height:300px; border:0px solid #dee0e2; float: left;}
#n_who .box1 .img img{}
#n_who .box1 .txt{ float:right; width:720px; font-size:14px; color:#4e4e4e; line-height:28px; height:300px;}
#n_who .box1 .txt .j_tab_cel{ text-align:left;}
#n_who .box1 .txt .tt{ font-size:28px; color:#333; margin-bottom:30px;}
#n_who .box1 .txt p{ font-size:14px; color:#4e4e4e; line-height:28px;  }
#n_who .box1 .txt p+p{ margin-top:20px;}
#n_who .box1 ul{ margin-right:-13px; margin-top:50px;}
#n_who .box1 ul li{ width:290px; height:240px; float:left; margin:0; margin-right:13px;}
#n_who .box1 ul li img{border-radius:50px;}

#n_who .box2{ padding-top:50px;}
#n_who .box2 .tt{ font-size:22px; color:#333; margin-bottom:15px; font-weight:500;}
#n_who .ys{ width:475px; height:548px; margin:0 auto; margin-top:150px; margin-bottom:100px; background:url(../images/n_who_ys.png) center no-repeat; position:relative;}
#n_who .ys ul{}
#n_who .ys ul li{ position:absolute;}
#n_who .ys ul li span{ display:block; width:132px; height:132px; border-radius:50%; color:#fff; font-size:18px; line-height:26px;}
#n_who .ys ul li p{ position:absolute; white-space:nowrap; width:230px; font-size:14px; color:#4e4e4e;}
#n_who .ys ul li.li_1{ left:50%; margin-left:-66px; top:-66px;}
#n_who .ys ul li.li_1 span{ background:#50996e;}
#n_who .ys ul li.li_1 p{ top:-38px; left:50%; text-align:center; transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); -webkit-transform:translateX(-50%);}
#n_who .ys ul li.li_2{ right:-66px; top:70px;}
#n_who .ys ul li.li_2 span{ background:#81ad92;}
#n_who .ys ul li.li_2 p{ top:50%; right:-250px; transform:translateX(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); -webkit-transform:translateY(-50%);}
#n_who .ys ul li.li_3{ right:-66px; top:340px;}
#n_who .ys ul li.li_3 span{ background:#b1c8ce;}
#n_who .ys ul li.li_3 p{ top:50%; right:-250px; transform:translateX(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); -webkit-transform:translateY(-50%);}
#n_who .ys ul li.li_4{ left:50%; margin-left:-66px; bottom:-66px;}
#n_who .ys ul li.li_4 span{ background:#d4d5d0;}
#n_who .ys ul li.li_4 p{ bottom:-38px; left:50%; text-align:center; transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); -webkit-transform:translateX(-50%);}
#n_who .ys ul li.li_5{ left:-66px; top:340px;}
#n_who .ys ul li.li_5 span{ background:#d0cad7;}
#n_who .ys ul li.li_5 p{ top:50%; left:-250px; transform:translateX(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); -webkit-transform:translateY(-50%); text-align:right;}
#n_who .ys ul li.li_6{ left:-66px; top:70px;}
#n_who .ys ul li.li_6 span{ background:#81ad92;}
#n_who .ys ul li.li_6 p{ top:50%; left:-250px; transform:translateX(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); -webkit-transform:translateY(-50%); text-align:right;}


#n_pro { position:relative;  text-align:center; overflow:hidden; padding-bottom:40px; }
#n_pro h2 { font-size:14px; color:#111; font-weight:bold; text-transform:uppercase; letter-spacing:3px;}
#n_pro .tit { margin-top:45px; font-size:40px; color:#111; font-weight:100; letter-spacing: 2px;font-family: 'chaoxiyuanjian'; margin-bottom:20px;}
#n_pro .tit strong { font-weight:bold }
#n_pro .hashTag { margin-top:25px; color:#3c3c3c; font-size:14px;}
#n_pro ul { margin:0 -9px; margin-top:80px;}
.mainSec03 .mainSwipeBox3 { margin:0 auto;}
#n_pro ul li { overflow:visible;}
#n_pro ul li { margin:0 9px; margin-bottom:33px; width:225px; height:326px; float:left;}
#n_pro ul li .img{ position:relative; transition:all .3s ease; width:100%; height:270px;}
#n_pro ul li .img:before { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.3); transition:all .3s ease; opacity:0;}
#n_pro ul li .img .text { position:absolute; bottom:0; left:0; right:0; top:0; text-align:center; font-size:14px; line-height:22px; color:#fff; transition:all .3s ease; opacity:0; padding:0 40px;}
#n_pro ul li .textBox { overflow:hidden; margin-top:18px; transition:all .3s ease;}
#n_pro ul li .textBox a { display:block;}
#n_pro ul li .textBox .text { font-size:14px; color:#000; font-weight:450; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; text-transform:uppercase; font-family: 'NUNITO-LIGHT'; font-weight: bold;}
#n_pro ul li .textBox .text2 { margin-top:10px; font-size:12px; color:#5f5f5f; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-style:italic; display:none;}
#n_pro ul li .btnCircleMore { display:block; width:30px; height:30px; margin:35px auto 0; font-size:0; background:url(../images/btn_more.png) no-repeat; transition:all .3s ease; transform-origin:center;}
#n_pro ul li .btnCircleMore:hover { transform:rotate(180deg);}
#n_pro ul li:hover {}
#n_pro ul li .img:hover { }
#n_pro ul li .img:hover:before { opacity:1;}
#n_pro ul li .img:hover .text { opacity:1;}
#n_pro ul li:hover .textBox { height:100%; opacity:1;}

/* 일반 테이블 */
.tableWrap { width:100%;}
.tableWrap .tableView {  width:100%;}
.tableWrap .tableView th { height:55px; border-bottom:1px solid #919294; font-size:15px; color:#fff; font-weight:500; line-height:55px; background:#919294; padding:0 18px; vertical-align:middle;}
.tableWrap .tableView th img{ margin-right:10px; position:relative; top:-2px;}
.tableWrap .tableView th + th { }
.tableWrap .tableView td { padding:0 20px; height:49px; line-height:48px; border-bottom:1px solid #e1e1e1; text-align:center; color:#3d3d3d; font-size:14px; background:#fff;}
.tableWrap .tableView td.tl { text-align:left; line-height:30px;}
.tableWrap .tableView td + td,
.tableWrap .tableView td.line { border-left:1px solid #e1e1e1;}

.pro_search{ height:55px; margin-bottom:20px;}
.pro_search .j_btn{ height:55px; width:110px; float:right; background:#919294; color:#fff; font-size:16px;}
.pro_search .j_txt{ height:55px; float:left; width:calc(100% - 110px); padding:0 30px; font-size:16px; color:#5f5f5f; background:#f7f7f7;}

.letter_box{ margin-bottom:13px;}
.letter_box .tab{ overflow:hidden;}
.letter_button {height: 35px; padding-left: 0px; padding-right:0px; text-align:right; float:left; width:25%; }
.letter_button div{
    width:26px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	text-transform: none;
	display: inline-block;
	color:#919294;
}
.letter_button a {
	color: #383838; display:block;
	text-transform: none;
}
.letter_button div:hover {
	background-color: #919294;
	color:#fff;
	text-transform: none;
}
.letter_button a:hover {
	color: #fff;
	text-transform: none;
}
.letter_button div.on {
	height: 35px;
	line-height: 35px;
	text-align: center;
	text-transform: none;
	display: inline-block;
	color:#fff;
	background-color: #919294;
}
.letter_button div.on a{ color:#fff;}
.theme_backgroup_color {
    background-color: #919294;
}

#n_sample{position:relative;  text-align:center; overflow:hidden; padding-bottom:40px;}
#n_sample h2 { font-size:14px; color:#111; font-weight:bold; text-transform:uppercase; letter-spacing:3px;}
#n_sample .tit { margin-top:45px; font-size:40px; color:#111; font-weight:100; letter-spacing: 2px;font-family: 'chaoxiyuanjian';}
#n_sample .tit i{ font-family:"TT1182M_"}
#n_sample .tit strong { font-weight:bold; font-family:TT1161M; }
#n_sample .hashTag { margin-top:25px; color:#3c3c3c; font-size:14px; margin-bottom:60px;}
.j_form{ text-align:left; width:840px; margin:0 auto; background:#f7f7f7; border:1px solid #e7e6e6; overflow:hidden; padding:10px 0 25px;}
.red{ color:#ff0000; font-size:14px; font-family:arial; margin-right:5px;}
.j_form .tt{ font-size:18px; color:#000; position:relative; padding-left:11px; margin-bottom:20px;}
.j_form .tt:before{ content:""; width:2px; height:15px; display:block; position:absolute; top:0; left:0; background:#686868;}
.j_form .form-block{ overflow:hidden; padding:40px 74px;}
.j_form .form-block + .form-block { border-top:1px solid #e7e6e6; }
.j_form .form-group{ width:335px; }
.j_form .form-group input,.j_form .form-group select{ height:39px; border-radius:0; border:1px solid #e7e6e6; outline:0; box-shadow:none; -webkit-appearance:none; background-color:#fff; padding: 6px 12px; font-size:14px; color:#818181; width:100%;}
.j_form .form-group textarea{ background-color:#fff; padding: 15px 12px; font-size:14px; color:#818181; width:100%; border:1px solid #e7e6e6; height:139px;}
.j_form .check-block{ clear:both; margin-bottom:20px; overflow:hidden;}
.j_form .check-block label{ float:left; margin-right:56px;}
.j_form .yzm-group{ width:100%;}
.j_form .yzm-group label{  float:left; line-height:39px; margin-right:15px;}
.j_form .yzm-group input{ float:left; width:150px; margin-right:18px; font-size:14px;}
.j_form .yzm-group .yzm img{ max-height:39px;}
.j_form button{ border-radius:3px; font-size:14px; transition:.3s;}
.j_form .btn_tijiao{ width:140px; height:37px; color:#fff; background:#acce22; margin-right:11px;}
.j_form input[type=radio],.j_form input[type=checkbox]{ margin-top:2px;}

#n_contact{}
#n_contact .txt{ width:465px; height:696px; background:url(../images/contact_left_bg.png) right center no-repeat; padding-top:57px; width:100%;}
#n_contact .txt h3{ font-size:24px; color:#000; text-transform:uppercase; margin-bottom:40px;font-family: 'NUNITO-LIGHT';}
#n_contact .txt ul{}
#n_contact .txt ul li{ position:relative; padding-left:27px; font-size:16px; line-height:24px; color:#444444; margin-bottom:25px;}
#n_contact .txt ul li span{ position:absolute; left:0; top:0; display:block; line-height:24px; width:25px;}

#n_contact .j_form{ width:630px; padding:50px 56px;}
#n_contact .j_form .form-group{ width:100%;}
#n_contact .j_form .tt2{ font-size:24px; color:#000;font-family: 'NUNITO-LIGHT'; margin-bottom:30px;}
#n_contact .j_form p{ font-size:14px; margin-top:12px; }
#n_contact .j_form input,#n_contact .j_form textarea{ font-size:14px; color:#5b5c5d; font-family:arial;}
#n_contact .j_form .btn_tijiao{ width:122px; height:37px; color:#fff; background:#acce22;}
#n_contact .j_form .btn_reset{ width:122px; height:37px; color:#fff; background:#babbbc;}


/* 点击搜索框获取焦点 placeholder消失-开始 */

#n_contact input::-webkit-input-placeholder{
	color:#5b5c5d;
}
#n_contact input::-moz-placeholder{   /* Mozilla Firefox 19+ */
	color:#5b5c5d;
}
#n_contact input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
	color:#5b5c5d;
}
#n_contact input:-ms-input-placeholder{  /* Internet Explorer 10-11 */ 
	color:#5b5c5d;
}

input:focus::-webkit-input-placeholder {
color: transparent;
}
input:focus:-moz-placeholder {
color: transparent;
}
input:focus::-moz-placeholder {
color: transparent;
}
input:focus:-ms-input-placeholder {
color: transparent;
}
textarea:focus::-webkit-input-placeholder {
color: transparent;
}
textarea:focus:-moz-placeholder {
color: transparent;
}
textarea:focus::-moz-placeholder {
color: transparent;
}
textarea:focus:-ms-input-placeholder {
color: transparent;
}
#n_contact input:focus::-webkit-input-placeholder {
color: transparent; 
}
#n_contact input:focus:-moz-placeholder {
color: transparent;
}
#n_contact input:focus::-moz-placeholder {
color: transparent;
}
#n_contact input:focus:-ms-input-placeholder {
color: transparent;
}

/* 点击搜索框获取焦点 placeholder消失-结束 */

.tbbg:after{background-color:#acce22; content: ""; width: 100%; height: 100%; position: absolute;top: 0px; left:0px; transition: transform 1.2s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s; -webkit-transition: transform 1.2s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;   z-index: 1;}

.tbbg:after{ transform-origin:left bottom 0; -webkit-transform-origin:left bottom 0;}

.action.tbbg:after{transform: scaleY(0); -webkit-transform: scaleY(0);}






.l-loader{ width:100vw; height:100vh; position:fixed; z-index:9999999999999;}

.p-loader {
  position: relative;
  width: 100%;
  height: 100%; background:none;
/*  background-color: #f8f9f9;*/
  display: flex;
  align-items: center;
  justify-content: center;
}

.p-loader .p-loader__line {
  position: relative; z-index:9999;
  width: 380px;
  height: 1px;
  background-color: #dfdfdf; opacity:1; transition:.5s;
  overflow: hidden; visibility:visible;
}
.loaded #loader-wrapper .p-loader__line{ opacity:0; visibility:hidden;}
.p-loader .p-loader__line:before, .p-loader .p-loader__line:after {
  position: absolute;
  top: 0;
  left: 0;
  content: ' ';
  display: block;
  width: 250px;
  height: 1px;
}



.p-loader .p-loader__line:before {
  -webkit-transform: translateX(-380px);
          transform: translateX(-380px);
  background-image: linear-gradient(-90deg, #59696d 20%, #93b4c5 69%, #afbec6 97%);
  -webkit-animation: LOADING_BEFORE 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
          animation: LOADING_BEFORE 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
}



.p-loader .p-loader__line:after {
  -webkit-transform: translateX(380px);
          transform: translateX(380px);
  background-image: linear-gradient(90deg, #59696d 20%, #93b4c5 69%, #afbec6 97%);
  -webkit-animation: LOADING_AFTER 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
          animation: LOADING_AFTER 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
}




@media screen and (max-width: 1100px) {
  .p-line__illust {
    width: 81.54545vw;
    height: 49.18182vw;
  }
}

@-webkit-keyframes LOADING_BEFORE {
  0% {
    -webkit-transform: translateX(-380px);
            transform: translateX(-380px);
  }
  40% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
  100% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
}

@keyframes LOADING_BEFORE {
  0% {
    -webkit-transform: translateX(-380px);
            transform: translateX(-380px);
  }
  40% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
  100% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
}

@-webkit-keyframes LOADING_BEFORE_SP {
  0% {
    -webkit-transform: translateX(-190px);
            transform: translateX(-190px);
  }
  40% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
  100% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
}

@keyframes LOADING_BEFORE_SP {
  0% {
    -webkit-transform: translateX(-190px);
            transform: translateX(-190px);
  }
  40% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
  100% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
}

@-webkit-keyframes LOADING_AFTER {
  0% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
  60% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
  100% {
    -webkit-transform: translateX(-380px);
            transform: translateX(-380px);
  }
}

@keyframes LOADING_AFTER {
  0% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
  60% {
    -webkit-transform: translateX(380px);
            transform: translateX(380px);
  }
  100% {
    -webkit-transform: translateX(-380px);
            transform: translateX(-380px);
  }
}

@-webkit-keyframes LOADING_AFTER_SP {
  0% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
  60% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
  100% {
    -webkit-transform: translateX(-190px);
            transform: translateX(-190px);
  }
}

@keyframes LOADING_AFTER_SP {
  0% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
  60% {
    -webkit-transform: translateX(190px);
            transform: translateX(190px);
  }
  100% {
    -webkit-transform: translateX(-190px);
            transform: translateX(-190px);
  }
}

 #loader-wrapper { position: fixed;   top: 0; left: 0; width: 100%; height: 100%; z-index:999999;background:none; opacity:1; }

.loaded #loader-wrapper {
	visibility: hidden; opacity:0;
	-webkit-transition: all 0.3s 1s ease-out;  
			transition: all 0.3s 1s ease-out;
}

 #loader-wrapper .loader-section {
            position: fixed;
            left: 0; right:0;
            width: 100%;
            height: 51%;
            background: #f8f9f9;
            z-index: 0;
            -webkit-transform: translateY(0); 
            -ms-transform: translateY(0); 
            transform: translateY(0);
        }
#loader-wrapper .loader-section.section-left {top: 0;}
#loader-wrapper .loader-section.section-right {bottom: 0;}

.loaded #loader-wrapper .loader-section.section-left {
	  -webkit-transform: translateY(-100%); 
		  -ms-transform: translateY(-100%);
			  transform: translateY(-100%);  
	  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
			  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader-wrapper .loader-section.section-right {
	  -webkit-transform: translateY(100%); 
		  -ms-transform: translateY(100%);
			  transform: translateY(100%);  
	  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
	  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}





.tit{ position:relative; display:inline-block;font-size: 18px; font-weight: 300; overflow:hidden;}

.mainSec01 .tit:before { content:""; display:block;
    position: absolute; opacity:.9;
    width: 40px;
    height: 100%;
    top: -4px;
    left: -100px;
    background: #fff;
    box-shadow: 0 0 50px 50px #fff; transition:1s;
}
.mainSec03 .tit:before { content:""; display:block;
    position: absolute; opacity:.9;
    width: 40px;
    height: 100%;
    top: -4px;
    left: -100px;
    background: #f7f7f7;
    box-shadow: 0 0 50px 50px #f7f7f7; transition:1s;
}
.tit:hover:before{ left: calc(100% + 200px) !important;}



#logo .j_tab_cel{ position:relative;  overflow:hidden;}

#logo .j_tab_cel:before { content:""; display:block;
    position: absolute; opacity:.9;
    width: 40px;
    height: 100%;
    top: -4px;
    left: -100px;
    background: #fff;
    box-shadow: 0 0 50px 50px #fff; transition:1s;
}
#logo .j_tab_cel:hover:before{ left: calc(100% + 200px) !important;}


.s_nav{ text-align:center; margin-bottom:20px;}
.s_nav ul{}
.s_nav ul li{display:inline-block;min-width: 151px;border-radius:30px;border: 1px solid #e2e2e2;color:#222;margin:10px; transition:.3s;}
.s_nav ul li a{ display:block;padding: 12px 30px;}
.s_nav ul li.on,.s_nav ul li:hover{ border:1px solid #222;}