@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900&display=swap');

@font-face {font-family: "Lucida Bright";
  src: local('Lucida Bright');
  src: url("../font/LucidaBright/LucidaBright.eot"); /* IE9*/
  src: url("../font/LucidaBright/LucidaBright.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../font/LucidaBright/LucidaBright.woff2") format("woff2"), /* chrome、firefox */
  url("../font/LucidaBright/LucidaBright.woff") format("woff"), /* chrome、firefox */
  url("../font/LucidaBright/LucidaBright.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../font/LucidaBright/LucidaBright.svg#Lucida Bright V2") format("svg"); /* iOS 4.1- */
  font-weight: normal;
  font-style: normal; 
}

@font-face{ font-family: "PingFang TC"; font-weight:100; src: local("PingFang TC Ultralight") }
@font-face{ font-family: "PingFang TC"; font-weight:200; src: local("PingFang TC Thin") }
@font-face{ font-family: "PingFang TC"; font-weight:300; src: local("PingFang TC Light") }
@font-face{ font-family: "PingFang TC"; font-weight:400; src: local("PingFang TC Light") }
@font-face{ font-family: "PingFang TC"; font-weight:500; src: local("PingFang TC Regular") }
@font-face{ font-family: "PingFang TC"; font-weight:600; src: local("PingFang TC Medium") }
@font-face{ font-family: "PingFang TC"; font-weight:700; src: local("PingFang TC Semibold") }
@font-face{ font-family: "PingFang TC"; font-weight:800; src: local("PingFang TC Heavy") }


/* ===============  HTML5 display definitions  =============== */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; height: 0; } 
[hidden] { display: none; }

/* ===============  Base  =============== */
html { width: 100%; height: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;  } 
body { width:100%; height: 100%; margin: 0; overflow-x:hidden; position:relative; font-size: 100%; line-height: 1; 
font-family: Lucida Bright,Times,'Noto Sans TC','PingFang TC','微軟正黑體', serif; font-weight: 300;
	
	text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-font-feature-settings: 'liga', 'kern';  -webkit-overflow-scrolling: touch;  }
*{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin:0; padding:0; } 
a{ color: inherit; text-decoration:none; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
a:active, a:hover { outline: 0; }
img { border: 0;}
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }
dl, menu, ol, ul { margin: 0; }
ul{ list-style:none; list-style-image: none; }
table { border-collapse: collapse; border-spacing: 0; }
 
/* ===============  Forms  =============== */
form { margin: 0; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0; padding: 0; white-space: normal; *margin-left: -7px;  }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle;  }
button, input { line-height: normal; }
button, html input[type="button"], 
input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *height: 13px; *width: 13px; }
input[type="search"] { /*-webkit-appearance: textfield;*/  -webkit-appearance: none;  -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
/*去除input藍色框框*/
input,button,select,textarea{ outline:none; }
*:focus { outline: none; } 
input:focus, textarea:focus{ outline:none; }


/* ===============  Typography  =============== */
mark { background: #ff0; color: #000; } 
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ''; content: none; }
small { font-size: 75%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
hr{ height:1px; background: #CCC; border: none; } 

p{ line-height: 160%;  } 
::selection { background: #222; color: #fff;}
::-moz-selection { background: #222; color: #fff; } 

/* ===============  Global  =============== */
.f60{ font-size: 3.75rem; }
.f36{ font-size: 2.25rem; }
.f34{ font-size: 2.125rem; }
.f30{ font-size: 1.875rem; }
.f25{ font-size: 1.5625rem; }
.f24{ font-size: 1.5rem; }
.f22{ font-size: 1.375rem; }
.f20{ font-size: 1.25rem; }
.f18{ font-size: 1.125rem; }
.f17{ font-size: 1.0625rem; }
.f15{ font-size: .9375rem; }
.f14{ font-size: .875rem; }
.f13{ font-size: .8125rem; }
.f12{ font-size: .75rem; }
.f11{ font-size: .6875rem; }

h1,h2,h3,h4,h5,h6{ font-weight: inherit;   } 
.fontSTY1{ font-family: Arial, Helvetica , sans-serif}

.aaUnderlineHover:hover{ text-decoration: underline;  }
.txtCenter{ text-align: center; }
.txtRight{ text-align: right; }
.txtLeft{ text-align: left; }
.txtShadow{ text-shadow: 0 0 10px rgba(0,0,0,0.5); }
.edit{ line-height: 180%; }
.edit img,
.imgFull img{ max-width: 100%; height:auto; vertical-align:top;  }

.R{ float:right; }
.clearfix:after{ content:''; clear: both; display:table;  }

.posREL{ position: relative; }
.lineH{ line-height: 160%;  }
.atCenter{ margin-left: auto; margin-right: auto; }

.colorGrayAAA{ color: #aaa; }
.colorGray555{ color: #555; }
.colorGray666{ color: #666; }
.colorGray888{ color: #888; }
.colorGrayBA{ color: #bababa; }
 
.colorRed{ color: #ff0000; } 
.colorGreen{ color: #2d9157; } 

 

/* ===============  container  =============== */   
.container,
.containerS{ width: 90%; margin-left:auto; margin-right:auto;   } 
.container{  max-width: 1200px;  }
.containerS{ position: relative; max-width: 800px;  }  
.wrapper{ width: 90%; margin-left:auto; margin-right:auto;  }
.posREL{ position: relative; }

.flex{ -js-display: flex; display: -ms-flexbox; display: -webkit-box; display: -webkit-flexbox;  display: -webkit-flex; display: flex; 
-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;  }  
.spaceBetween{ -ms-justify-content: space-between; -webkit-justify-content: space-between; justify-content: space-between; }  
.flexCenter{ -ms-flex-align: center; -webkit-align-items: center;  align-items: center;}
 
 
/* ===============  header    =============== */
#header{ width: 100%; max-width:100%;   box-shadow: 0px 5px 6px 0px rgba(0,0,0,.2); position: relative; z-index: 99;  }
#header:after{ content:''; display: block; clear: both; } 
 
.h1LOGO{ max-width: 53%; padding: 14px 9px 14px 0; display: inline-block;  margin-right:-4px; text-align: left; }
.h1LOGO img{ display: inline-block; vertical-align: top; max-width: 100%;   }
.h1LOGO:hover{ opacity:.8; }
.h1LOGO span{ opacity: 0; visibility: hidden; overflow:hidden; width: 0px; height: 0px; display: inline-block;    }

#nav{ display: inline-block; vertical-align: middle; width: 68%; width: calc( 100% - 310px ); margin-right:-4px; text-align: right;  } 
#nav:after{ content:''; display: block; clear: both; }
#navPC{ display: inline-block;   }
#navPC > li{ display: inline-block; margin-right: -4px;   }  
#navPC > li:not(:first-child){ margin-left: .3em; position: relative;   }
#navPC > li:not(:first-child):after{ content: ''; width: 1px; height: 70%; position: absolute; top: 0; bottom:0; left: 0; display: inline-block; background: #ccc; margin: auto; }
#navPC > li h2{ display: inline-block; vertical-align:middle; font-weight: 300; font-size: 1.125rem;  line-height: 1.5; text-align: center; }
#navPC > li h2 small,
#navPC > li h2 span{ display: block;  }
#navPC > li h2 small{ font-size: .65em; opacity: .3;}
#navPC > li a{ display: inline-block; vertical-align:middle; padding: 0 1em;   }  
#navPC > li.-on,
#navPC > li a:hover{ color: #2d9157;  }  

.navXS_bn{ display: none; }  

@media (max-width: 1000px){ 
	#navPC{ display: none; }
	.navXS_bn{ display: block; position: absolute; top:0; bottom: 0; right: 0; margin: auto; width: 30px; height: 40px; text-align: right; } 
}

 
.menuContent{ width: 80%; padding-bottom: 1em; margin: 0 auto;  text-align: left; position:relative;   }

#navXS{ margin-bottom: 1em;}
#navXS > li{ display: block; }
#navXS > li > a{ display: block; line-height: 1.8em; font-size: 1.2rem;  }  
#navXS a:hover{ color: #FF0000; }

.navXS-submenu{ margin-bottom: 1.5em;}
.navXS-submenu > li{ font-size: .75rem; padding: .5em 1em .5em 0; display: inline-block; color: #555; }
   



body.is_lock  { overflow: hidden !important;  } 
#MENU{ position: fixed; top: 0; right: -10%;  width: 70%; max-width: 950px; height: 100%; padding: 80px 0 50px 0; text-align: center; 
	background-color: #fff; background-repeat: no-repeat; background-position: right bottom; background-size: 80% auto;   z-index: 991; opacity: 0; visibility: hidden; overflow: auto; 
	-webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transition: all .3s; transition: all .3s;  
}
#MENU.is_open{ opacity: 1; visibility: visible; right: 0; -webkit-transition: all 1s; transition: all 1s;   }
#MENU::after { display: inline-block; *zoom: 1; content: ''; height: 100%; vertical-align: middle;  }
#MENU .inner { width: 80%; display: inline-block; vertical-align: middle; color: #363636; opacity: 0; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-filter: blur(5px); filter: blur(5px); -webkit-transition: all 1s .4s; transition: all 1s .4s;  }	
#MENU.is_open .inner{ opacity: 1;  -webkit-filter: blur(0); filter: blur(0); }

#MENU_mask{ position: fixed; top:0; right:0; width: 100%; height: 100%;  z-index:990; opacity: 0; visibility: hidden; -webkit-transition: all 1s; transition: all 1s .2s; background: rgba(100,100,100,.8);  background-size: cover;
}
#MENU_mask.is_open { opacity: 1; visibility:visible; transition: all 1s;  } 

.navLinkss{  }
.navLinkss li{   margin-bottom: 2em; margin-right: -4px; color: #333  }
.navLinkss li:not(:last-child):after{ content: '/'; display: block; margin: .5em auto; color: #ccc; font-size: .7rem; transform: rotate(20deg)}
.navLinkss li h2{ font-size: 1.3rem; font-weight: 500 }
.navLinkss li a{ display: inline-block; padding: .5em;   } 
.navLinkss li a span{ letter-spacing: .3em;}
.navLinkss li a small{ color: #2d9157; font-size: .7rem; display: block; }
  
@media (max-width:700px){
	.navSubLinkss a:not(:first-child){ margin-left: 1em; }
	.navLinkss li a small{ font-size: .75rem; letter-spacing: 1px;   }
	.navLinkss li a h2{ font-size: 1rem; } 
	#MENU{  width: 100%; }
	.navSubLinkss{ display: block; }
}

@media (max-width:540px){
	.navLinkss li a img{ width: 32px;   }
	#MENU .inner{ width: 90%; }
	nav::after{  margin: 1em auto 2em auto; }
	.navLinkss li{ margin-bottom: 0; }
	.navLinkss li a small{  margin-top: .3em; }
}
@media (max-width:420px){
	nav::after{  margin: 1em auto 1.5em auto; }
	.navPhone li { padding: .1em 1em;}
}


#aaMENUclose{ position: absolute; right: 0; top: 0; width: 60px; display: inline-block; background: #2d9157; } 
#aaMENUclose::after{ content: ''; position: absolute; top:0; left: 0; width: 10%; height: 100%; display: block; opacity: 0; z-index: -1; pointer-events: none; transition: all .3s; } 
#aaMENUclose:hover::after{ width: 100%; opacity: 1; }
.xClose{ /*width: 60px;*/ height: 60px; display: inline-block; }
.xClose span{ display:inline-block; position:relative; width: 30px; height:100%; margin: 0 auto;      }
.xClose span::before, .xClose span::after { cursor: pointer; border-radius: 1px; height: 1px; width: 100%; background: #00672e; display: block; content: ''; position: absolute; top:50%; pointer-events:none; -webkit-transition: all .5s; transition: all .5s;   } 
.xClose span:before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);  transform: rotate(45deg);   }
.xClose span:after {  -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);    }
.xClose:hover span::before{  -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);   }
.xClose:hover span::after{   -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);  transform: rotate(45deg);  } 















/* ===============  INDEX  =============== */  
#IND1{ width: 100%;   }  
.heroIND{ background: #aaa;  position: relative;   } 
.heroIND img{ width: 100%; height:auto; vertical-align: top; } 
.heroIND-banner{ background-position: center center; }
@media (max-width:1000px) {
	.heroIND-banner img{ opacity: 0; }
  	.heroIND-banner { padding-top: 150px; background-size: auto 100%; }
}
@media (max-width:640px) { 
  	.heroIND-banner { padding-top: 100px; background-size: auto 100%; }
}




#IND2{ padding: 4em 0; color: #464646; background: linear-gradient(180deg, rgba(222,222,222,1) 0%, rgba(255,255,255,1) 7%); }
#IND2 .inner{ width: 80%; max-width: 900px; margin: 0 auto; text-align: center; }

.INDhotNews{ margin: 3em auto 1em auto; }
.INDhotNews li{ width: 45%; display: inline-block; margin-bottom: 2.3em;  }
.INDhotNews a{ display: block; position: relative; padding-left: 3.5em; text-align: left; }
.INDhotNews strong{ color: #2d9157; font-size: 2.875rem; position: absolute; left: 0; height: 90%; display: inline-block; }
.INDhotNews strong:after{ content: ''; position: absolute; right: .1em; top:0; width: 1px; height: 100%; display: inline-block; background: #2d9157; transform: rotate(45deg)}
.INDhotNews p{ font-size: 1.25rem;overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height:1.4em; height: 3em;  margin-bottom: .3em; }
.INDhotNews span{ color: #2d9157; transition: .5s; display: inline-block; vertical-align: middle; }
.INDhotNews i{ color: #2d9157; font-size: .9rem; transition: .5s; display: inline-block; vertical-align: middle; margin-right: .5em;  }

.INDhotNews a:hover i{ transform: translateX(.3em); }

@media (min-width:701px) and (max-width:920px){
	.INDhotNews p{ -webkit-line-clamp: 3; height: 4.4em; }
}
@media (max-width:700px){
	.INDhotNews li{ width: 100%;  }
}


 
#IND3{ padding: 0 0 5em 0;  }
.indexADV{ width: 100%; display: inline-block; text-align:center;  }
.indexADV li{ display: inline-block; margin-right: -3px; width: 33.2%; text-align:center; position:relative;  overflow: hidden;   }
.indexADV-txt a{ display: block; width: 100%; overflow: hidden;  }
.indexADV-img img{ width: 100%; vertical-align: top; transition: all .5s; }
.indexADV-txt { position: absolute; top: 0; left: 0; width:100%; height: 100%; text-align: left; line-height: 1.6em;  -webkit-transition: all .5s; transition: all .5s;  /* box-shadow: inset 0 0 0 1px rgba(255,255,255,1); */ }
.indexADV-txt:after { display: inline-block; *zoom: 1; content: ''; height: 100%; vertical-align: middle;  }
.indexADV-txt .inner { display: inline-block; vertical-align: middle; width: 90%; position:relative;   }
.indexADV-txt h3{ font-size: 1.625rem; font-weight: 500;   }
.indexADV-txt small{ color: #767676; font-size: 0.875rem; margin-bottom: 1em; display: block;}
.indexADV-txt h4{ font-size: .9375rem; -webkit-transition: all .3s;  }

.indexADV li:nth-child(1) .indexADV-txt{ padding-left: 40%; }
.indexADV li:nth-child(2) .indexADV-txt{ padding-left: 10%; padding-top: 10% }
.indexADV li:nth-child(3) .indexADV-txt{ padding-left: 45%; }

.indexADV li:hover .indexADV-txt { background: rgba(0,0,0,0.2);  } 
.indexADV li:hover .indexADV-img img{ transform: scale(1.1)}
.indexADV li:hover h4{ color: #9c9c9c;  }


.greenLink{ display: inline-block; font-size: .75rem; padding: .2em 2.5em; color: #fff;background: #2d9157; border-radius: 50em;  }

@media (max-width: 1100px){
	.indexADV li{  margin-right: 0; width: 100%; max-width: 400px; margin-bottom: 3px; }
}
 


/* =============== footer   =============== */ 
footer{ line-height: 1.5em; background: #efefef;  } 
footer a:hover{ color: #2d9157; } 
.foo{ padding: 1em 0; position: relative; }
.foo:before{ content: ''; position: absolute; top:0; left: 0; width: 100%; height: 3px; display: block; background: rgb(49,134,125);
background: linear-gradient(90deg, rgba(49,134,125,1) 0%, rgba(201,229,87,1) 90%); }
.foo-L{ display: inline-block; vertical-align: middle; width: 50%; margin-right: -4px;  }
.foo-R{ font-size: .7rem; color: #888; display: inline-block; vertical-align: middle; width: 50%; margin-right: -4px; text-align: right; }
.foo-R a{ display: inline-block; }

.linksssBar li{ display: inline-block; vertical-align: middle; }
.linksssBar li:not(:last-child):after{ content: '|';   color: #bdbdbd; margin: auto 1em; display: inline-block; vertical-align: middle; } 

.linksssBar.fooLinks li:nth-child(1):after{ content: ''; }
.linksssBar span{ display: inline-block; vertical-align: middle; }
 
@media (max-width: 1000px){
	.foo-L{ display: block; width: 100%;  }
	.foo-R{ display: block; width: 100%;  margin-top: 1em; text-align: left; } 
}
@media (max-width: 420px){
	.foo-L{ font-size: .7rem;}  
}
@media (max-width: 520px){ 
	.linksssBar.fooLinks li:first-child{ width: 100%; margin-bottom: 1em;  }
}
@media (max-width: 370px){ 
	.linksssBar.fooLinks { display: none; }
} 


/* ===============  subPAGE  =============== */ 
.subPage{ padding: 3em 0;}
.subpageBanner{ text-align:center;  box-shadow: 0px 3px 5px 0px rgba(0,0,0,.1); background: rgb(51,157,115);
background: linear-gradient(0deg, rgba(51,157,115,1) 0%, rgba(9,137,124,1) 100%); }
.subpageBanner-img img{ max-width:100%; vertical-align: top;  }


/*
.hrDiamond{ display: inline-block; margin: 1em auto 2em auto; }
.hrDiamond img{ display: inline-block; vertical-align: middle; }
.hrDiamond:before,
.hrDiamond:after{ content:''; width: 50px; height: 1px; background: #e1af98; display: inline-block; vertical-align:middle; -webkit-animation-name: lineX;  animation-name: lineX;  -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-delay: .2s; animation-delay: .2s; -webkit-animation-fill-mode: both; animation-fill-mode: both;   }
.hrDiamond:before{ -webkit-transform-origin: right; transform-origin: right;   }
.hrDiamond:after{ -webkit-transform-origin: left; transform-origin: left;   }
@-webkit-keyframes lineX {
    0% {  opacity: .6; -webkit-transform: scaleX(.1); transform: scaleX(.1); }
    100% {  opacity: 1;  -webkit-transform: none; transform: none; }
}
@keyframes lineX {
    0% {  opacity: .6; -webkit-transform: scaleX(.1); transform: scaleX(.1); }
    100% {  opacity: 1;  -webkit-transform: none; transform: none; }
} 
*/


/* ===============  lightbox / menu  =============== */  
.BOX{ position: relative; max-width: 800px; margin-left:auto; margin-right:auto;  }
.BOX_close{ display:block; position: fixed; top: 16px; right: 2%; z-index: 999;     }  
.BOX_close:hover{ opacity: .7; }

.BOX_fixRight{ position: fixed; right: 0; top:0; width: 80%; max-width: 500px; height: 100%; padding-top: 80px; background: #fcfcfc; overflow-y: auto; opacity:0; transform: translateX(30%); transition: all 1s ; }
.BOX_fixRight.is-open{ opacity:1; transform: none; }
 
#hamburgerXS{ position: absolute; top: 0; right: 2%; bottom: 0; height: 40px; margin: auto 0; display: none;    }
@media (max-width: 1000px){
	#hamburgerXS{ display: block;   }
	.content{ padding-top: 30px !important; }
}

.hamburger { display: block; width: 36px; height: 30px; padding-left: 6px; cursor: pointer; position: relative;  }
.hamburger span { height: 1px; width: 100%; background: none; display: block; left: 50%; top: 50%; margin-left: -50%; position: relative; -webkit-transition: all 0.3s; transition: all 0.3s;	} 
.hamburger span:before, .hamburger span:after { -webkit-transition: all 0.3s; transition: all 0.3s; content: ''; width: 50%; height: 1px; display: block; background: #2d9157; position: absolute; }
.hamburger span:before { -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); opacity: 1; }
.hamburger span:after { -webkit-transform: translateX(15px); -ms-transform: translateX(15px); transform: translateX(15px); opacity: 1; background: #2d9157; }
.hamburger .line1 { -webkit-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px); }
.hamburger .line2 { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }
.hamburger .line3 { -webkit-transform: translateY(5px); -ms-transform: translateY(5px); transform: translateY(5px); }

.hamburger:hover .line2:before {
	-webkit-transform: translateX(-50px); -ms-transform: translateX(-50px);  transform: translateX(-50px); opacity: 0; }
.hamburger:hover .line2:after {
	-webkit-transform: translateX(50px); -ms-transform: translateX(50px); transform: translateX(50px); opacity: 0;  }

.hamburger:hover .line1:before  { 
	-webkit-transform: translateX(-6px); -ms-transform: translateX(-6px); transform: translateX(-6px); }
.hamburger:hover .line1:after  { 
	-webkit-transform: translateX(16px); -ms-transform: translateX(16px); transform: translateX(16px); }

.hamburger:hover .line3:before  { 
	-webkit-transform: translateX(-6px); -ms-transform: translateX(-6px); transform: translateX(-6px); }
.hamburger:hover .line3:after  { 
	-webkit-transform: translateX(16px); -ms-transform: translateX(16px); transform: translateX(16px); }	
	
.hamburger.is-open .line2:before,
.hamburger.is-open .line2:after {  opacity: 0;  }
.hamburger.is-open span:before,
.hamburger.is-open span:after { background: #000  }

.hamburger.is-open .line1 {
	-webkit-transform: translateY(-4px); -ms-transform: translateY(-4px); transform: translateY(-4px);  }
.hamburger.is-open .line1:before { 
	-webkit-transform: translateX(0px) rotate(45deg); -ms-transform: translateX(0px) rotate(45deg); transform: translateX(0px) rotate(45deg); }
.hamburger.is-open .line1:after { 
	-webkit-transform: translateX(10px) rotate(-45deg); -ms-transform: translateX(10px) rotate(-45deg); transform: translateX(10px) rotate(-45deg); }

.hamburger.is-open .line3 { 
	-webkit-transform: translateY(4px); -ms-transform: translateY(4px); transform: translateY(4px); }
.hamburger.is-open .line3:before {
	-webkit-transform: translateX(8px) rotate(-45deg); -ms-transform: translateX(8px) rotate(-45deg); transform: translateX(0px) rotate(-45deg); }
.hamburger.is-open .line3:after {
	-webkit-transform: translateX(10px) rotate(45deg); -ms-transform: translateX(10px) rotate(45deg); transform: translateX(10px) rotate(45deg); }
  
.hamburgerClose{ width: 36px; height: 36px; cursor: pointer; display: block; position:relative; -webkit-transform: rotate(45deg); transform: rotate(45deg);  }
.hamburgerClose div{ position: relative; background: #fff; width: 100%; height: 2px; top: 0; left: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }
.hamburgerClose div:nth-child(1) { height: 80%; width: 2px; position: absolute; top: 10%; left: 17px; -webkit-animation: hamCloseAnim1 1s ; animation: hamCloseAnim1 1s ;   }
.hamburgerClose div:nth-child(2) { width: 80%; height: 2px; position: absolute; left: 10%; top: 17px; -webkit-animation: hamCloseAnim2 1s ; animation: hamCloseAnim2 1s ;    }

@-webkit-keyframes hamCloseAnim1{
	0%, 10%{  height: 0%;}
	100%{ height: 80%;  }
}
@keyframes hamCloseAnim1{
	0%, 10%{  height: 0%;}
	100%{ height: 80%; }
}
@-webkit-keyframes hamCloseAnim2{
	0%, 30%{ width: 0%; }
	100%{ width: 80%;  }
}
@keyframes hamCloseAnim2{
	0%, 30%{ width: 0%; }
	100%{ width: 80%;  }
}





/* =============== policy  =============== */   
.POLICY{ padding: 150px 5%; line-height: 1.8; color: #444;     }
.POLICY h6{ font-size: 1.125em; margin: 3em 0 1em 0; color: #111;  }
.POLICY p{ font-size: .875rem;  }

.TIT{ padding: 1em 0 5em 0; width: 100%; max-width: 500px; margin: 0 auto;  text-align: center;  }
.TIT img{ width: 4em; display: block; margin: 1em auto;  }
.TIT h5{ font-size: 2rem; letter-spacing: 1px;  color: #111; width: 90%; margin-right: auto; margin-left: auto;  }

/* ===============  news  =============== */ 
.typeBanner{ width: 100%; text-align: center; margin: 1em auto; -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3); -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3); box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3);  }
.typeBanner li{ display: inline-block; margin-right: -4px; }
.typeBanner li a{ display: block; padding: .8em; line-height: 1.5; font-size: 1.125rem; }
.typeBanner.GREEN li a span{ display: inline-block; border-bottom: solid 2px transparent; }
.typeBanner.GREEN{ font-weight: 400; color: #fff; background: rgb(0,116,51); background: linear-gradient(0deg, rgba(0,116,51,1) 0%, rgba(0,145,64,1) 100%); }
.typeBanner.GREEN li.-on a span{ border-color: rgba(255,255,255,.5); }
.typeBanner.GREEN a:hover{ background: #007032;  }

.newsList{ width: 100%; text-align: center; margin: 2em auto;  }
.newsList li{ width: 32%; padding: 2em 0; display: inline-block; vertical-align: top;  }
.newsList li a{  display: inline-block;  background: #f5f5f5;  }

.newsList-img { overflow: hidden;  }
.newsList-img img{ width: 100%; vertical-align: top; -webkit-transition: all 1s;  transition: all 1s; }

.newsList time{  font-size:.8125rem; color: #009944; display: block; text-align: right; } 

.newsList-txt{ padding: 2em 7% 3em 7%; text-align: left; height: 17em; transition: all .5s; }
.newsList-txt h3{ font-size: 1.5625rem; font-weight: 400; line-height: 1.4em; max-height: 3em; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: .5em auto; }
.newsList-txt p{ height: 4.6em; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;   }
.newsList li a:hover time{ color: #6cffad;  }
.newsList li a:hover .newsList-img img{ -webkit-transform: scale(1.06) translateZ(0); transform: scale(1.06) translateZ(0); } 
.newsList li a:hover .newsList-txt{ background: #009944; color: #fff;   }

.wowList:nth-child(3n+1){ -webkit-animation-delay: .2s; animation-delay: .2s; }
.wowList:nth-child(3n+2){ -webkit-animation-delay: .3s; animation-delay: .3s; }
.wowList:nth-child(3n+3){ -webkit-animation-delay: .4s; animation-delay: .4s; }
@media (min-height: 700px){
	.wowList:nth-child(6n+4){ -webkit-animation-delay: .4s; animation-delay: .4s; }
	.wowList:nth-child(6n+5){ -webkit-animation-delay: .5s; animation-delay: .5s; }
	.wowList:nth-child(6n+6){ -webkit-animation-delay: .6s; animation-delay: .6s; }	
}

@media (min-width: 1001px){
	.newsList li{ max-width: 360px;  }
}
@media (max-width: 1000px){
	.newsList li{ width: 48%; max-width: 430px; }
}
@media (max-width: 600px){
	.newsList li{ width: 100%;  max-width: 360px; margin: 0 auto; }
	.newsList-txt{ height: auto; }
}


#newsDet{ padding: 5em 0; color: #464646;   }
.newsDet-tit{ border-bottom: solid 2px #009944; text-align: center; margin-bottom: 2em; }
.newsDet-tit time{ font-size: 0.9375rem; padding:.5em 1em; border: solid 1px #d9d9d9;  }
.newsDet-tit h3{ font-size: 1.5625rem; line-height: 1.5; padding: 1em; }
.newsDet-img{ margin-bottom: 2em;  }
.newsDet-img img{ display: block; max-width: 100%; border-bottom: solid 1px #d9d9d9;}

.edit ol{ padding-left: 1.5em; }







/* ===============  support (download)  =============== */ 
.suDownload{ display: inline-block; margin: 0 auto;  }
.suDownload li{ display: inline-block; vertical-align:top; width: 25%;margin: 0 -4px 2em 0;  }
.suDownload a{ display: block; width: 94%; max-width: 270px; margin: 0 auto; }

.suDownload-view{ padding: 10px; background: #fff; border: solid 1px #cacaca; box-shadow: 0 3px 6px rgba(0,0,0,0.2); }
.suDownload-mask{ background: rgba(0,0,0,0.8); position:absolute; top:0; left:0; width: 100%; height: 100%; color: #fff; opacity:0; visibility: hidden; transition: all .8s;  }
.suDownload-mask:after{ content:''; height: 100%; display: inline-block; vertical-align: middle; }
.suDownload-mask img{ height: 26px; margin-bottom: 1em;  }
.suDownload-mask span{ display: inline-block; vertical-align: middle; opacity: 0; transform: translateY(-2em) scale(.9); transition: all .6s .2s; }
.suDownload li a:hover .suDownload-mask{ opacity: 1; visibility: visible;  }
.suDownload li a:hover .suDownload-mask span{ opacity: 1; transform: none; }

.suDownload-view time{ position: absolute; top:0; right:0; background: #ff0000; color: #fff; padding: 15px 18px ; font-style: italic;   }
.suDownload-view time i{ font-size: 1.25rem;   }
.suDownload-view time hr{ background: #fff; opacity: .5; width:22px; margin: 6px auto; }

.suDownload-img{ border: solid 1px #000; }
.suDownload-img img{ width: 100%; vertical-align: top; }

.suDownload-txt{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
 height: 3.2em;  }
 
@media (max-width:920px){
	.suDownload li{ width: 33.2%; }
}
@media (max-width:700px){
	.suDownload li{ width: 50%; }
}
@media (max-width:500px){
	.suDownload li{ width: 100%; }
}

 
 
/* ===============  support (policy)  =============== */  
.policy{ width: 100%; backgroud: pink; line-height: 1.5em;  }

.policy_tit{ padding: 15px 2%; border-top: solid 1px #e3e3e3; border-bottom: solid 1px #e3e3e3; }
.policy_tit h5{ color: #76593b; font-size: 1.125rem; text-transform: uppercase; position: relative;   } 
.policy_tit h5:before{ content:''; width: 1.5em; height: 1em; background: url(../img/ico-diamond.png) no-repeat 0 center; display: inline-block; vertical-align: middle;   }
.policy_content{ padding: 2em 2%; font-size: .8125rem;  }
.policy_content img{ max-width: 100%; height: auto; }
 
.gridss{ width: 100%; margin: 1em auto; position:relative;   }
.gridss:after { content: ''; display: block; clear: both; }
.gutter{ width:2%; }
.gridssItem{ width: 49%;   } 
@media (max-width: 800px){
	.gutter{ width: 0; }
	.gridssItem{ width: 100%;  }
} 
 


.padd{ padding: 1em; }
.cardss{ width: 98%; background: url(../img/bgCard.jpg) repeat 0 0; border-radius: 1em; padding: 1.5em; line-height: 2em; margin-bottom:1em;  }
.cardss-contact{ background: #fff; border-radius: 1em; color: #666666; }

.pointListss{ width: 95%; margin: 1em auto;  }
.pointListss h6{ font-size: 1.125rem; color: #ff0000; padding: .8em 0; border-bottom: solid 1px #d3d3d3; position: relative;  }
.pointListss h6:after{ content: ''; position: absolute; bottom: -1px; left:0; width: 40%; height: 1px; background: #ff0000; display: inline-block; }

 



/* ===============  product  =============== */ 
.banner{ background: url(../img/bgMa.jpg) repeat-x 0 0; padding-top: 80px;  }
.proBanner{ width: 100%; height: 280px; overflow:hidden; background: url(../img/productBanner/bg.jpg) no-repeat 0 0; background-size: cover; position:relative;   }
.proBanner .IMG{ position:absolute; right: 8%; top:0; overflow: hidden; height: 100%;  } 
.proBanner .IMG img{ display: inline-block; vertical-align: top;   }
.proBanner .TXT{ position: absolute; top: 60px; left: 8%; display: inline-block; line-height: 2.2em;  }
.proBanner .TXT em { font-size: 1.875rem; }
.proBanner .TXT em,
.proBanner .TXT small{ display: block;  }

@media (min-width: 701px){ 
	.proBanner .IMG img{  
-webkit-animation-name: moveY;  animation-name: moveY;  -webkit-animation-duration: 5s; animation-duration: 5s;  -webkit-animation-fill-mode: both; animation-fill-mode: both;  }
}
@media (max-width: 700px){ 
	.proBanner .TXT { text-shadow: 0 0 10px rgba(255,255,255,0.95); }
	.proBanner .IMG{ right: -5%; width: 50%;   } 
	.proBanner .IMG img{  height: 110%;  }
}
@media (max-width: 420px){  
	.banner{ background-position: 0 -90px; padding-top: 40px;  }
	.proBanner { height: 220px; }
	.proBanner .TXT{ top: 40px; }
	.proBanner .TXT em { font-size: 1.4rem; }
	.proBanner .IMG{ right: -18%; }
	.proBanner .IMG img{  height: 100%;  }
}
@-webkit-keyframes moveY {
    0% {  -webkit-transform: translateY(-100px); transform: translateY(-100px); -webkit-filter: brightness(.8); }
    100% {  -webkit-transform: none; transform: none; -webkit-filter: none; }
}
@keyframes moveY {
    0% { -webkit-transform: translateY(-100px); transform: translateY(-100px);  -webkit-filter: brightness(.8); }
    100% {  -webkit-transform: none; transform: none;  -webkit-filter: none; }
}  


.proListss{ width: 100%; display: inline-block;  margin:1em auto;   }
.proListss:after{ content:''; display: block; clear: both; }
.proListss li{ width: 25%; display: inline-block; float: left; padding: 0 1% 1em 1%; text-align: center;   }
.proListss li a{ width: 100%; max-width: 280px;  margin: 0 auto 1em auto; display: block; position: relative;   }

.proListss-view{ position:relative; box-shadow: 0 0 6px rgba(0,0,0,0.1); border-bottom: solid 4px #009944; margin-bottom: 1em;  }
.proListss-img img{ vertical-align: top; width:100%; }
.proListss-txt{ line-height: 1.5; height: 6em;   }
.proListss-txt h5{ font-size: 1.125rem; }
.proListss-txt h6{ font-style: italic; color: #00672e; font-weight: bold;    }
.proListss-txt p{ color: #818181; margin: .5em 0; font-size: .9rem; }
.proListss-mask{ position: absolute; top: 0; left:0; width: 100%; height: 100%; background: rgba(0,153,68,0.9); overflow: hidden; opacity:0; visibility: hidden; -webkit-transition: all 1.5s; transition: all 1.5s;  }
.hexagon { position: absolute; width: 82px; height: 96px; background: url(../img/hexagon.png) no-repeat 0 0; margin: auto; top: 0; left: 0; bottom: 0; right: 0; transform: scale(.9) rotate(10deg); transition: all .5s .1s; } 
.more{  width: 4em; height: 1em; color: #fff; font-size: .9rem; position:absolute; margin: auto; top: 0; left: 0; bottom: 0; right: 0; transform: scale(.8); transition: all .5s .1s; } 

.proListss li a:hover .proListss-mask{ opacity: 1; visibility: visible; }
.proListss li a:hover .hexagon,
.proListss li a:hover .more{ transform: scale(1) rotate(0); } 

.proListss li:nth-child(10n+2){ -webkit-animation-delay: .4s; animation-delay: .4s;  } 
.proListss li:nth-child(10n+3){ -webkit-animation-delay: .8s; animation-delay: .8s;  }
.proListss li:nth-child(10n+4){ -webkit-animation-delay: .3s; animation-delay: .3s;  }
.proListss li:nth-child(10n+5){ -webkit-animation-delay: .5s; animation-delay: .5s;  }
.proListss li:nth-child(10n+6){ -webkit-animation-delay: .7s; animation-delay: .7s;  }
.proListss li:nth-child(10n+7){ -webkit-animation-delay: .3s; animation-delay: .3s;  }
.proListss li:nth-child(10n+8){ -webkit-animation-delay: .9s; animation-delay: .9s;  }
.proListss li:nth-child(10n+9){ -webkit-animation-delay: .5s; animation-delay: .5s;  }

.proSlogan{ font-size: 1.125rem; line-height: 1.8; letter-spacing: .1em; padding: 0 0 1em 0; color: #464646; width: 80%; margin: 2em auto 0 auto; text-align: center; font-style: italic; font-weight: 400; max-width: 580px;   }
.proSlogan hr{ display: block; width: 3em; height: 1px; background: #009944; margin: 1em auto; }
.proSlogan span{ display: inline-block; }

@media (max-width: 900px){
	.proListss li{ width: 33.3%; padding: 0 2% 1em 2%;  }
}
@media (max-width: 700px){
	.proListss li{ width: 50%;   }
}
@media (max-width: 500px){
	.proListss-txt p{ font-size: .75rem; }
}
@media (max-width: 320px){
	.proListss li{ width: 100%;   }
}




/* ===============  product detail  =============== */
#PDdetail{ background: url(../img/bgPDT.jpg) repeat-x center 0;  padding: 5em 0 3em 0; }

.proDet{ width: 100%;  }
.proDet:after{ content:''; display: block; clear: both; }
.proDet-L{ width: 50%; padding: 0 4em 3em 4em; min-height: 400px; float: left; position:relative; text-align: center;}
.proDet-R{ width: 50%; padding: 0 0 0 2em; min-height: 400px; float: right; }

.proDet ._tit{ padding-bottom: 1em; border-bottom: dotted 1px #888; margin-bottom: 2em; line-height: 1.5;  }
.proDet ._tit h5{ font-size: 2.5rem; font-weight: 500; color: #00672e;  } 
.proDet ._tit h6{ font-style: italic; color: #888; font-size: 1.2rem; }

.proDetSlider{ background: #fff;   box-shadow: 0 0 6px rgba(0,0,0,0.1); border-bottom: solid 4px #009944; text-align: center; /*max-width: 460px;*/ }
.proDetSlider img{ max-width:100%; display: block; margin: 0 auto; }
.proDetSlider-nav{ padding: 1em 0; }
.proDetSlider-nav img{ max-width:100%; display: block; border: solid 1px #b3b3b3;  }
.proDetSlider-nav img:hover{ border-color: #a2a2a2; transition: all .5s;   }
.proDetSlider-nav .slick-slide img{ width: 90%; }

 
@media (max-width:1000px){
	.proDet{ }
	.proDet-L,
	.proDet-R{ width: 100%; float: none;  }
	.proDet-R{ padding-left: 0; }
}

@media (max-width:600px){
	.proDet-L{ padding: 0 2.5em 3em 2.5em; } 
}

.PDcontent{ padding: 0 0 5em 0; }
.PDcontent-tit{ border-bottom: solid 1px #009944; color: #fff;   }
.PDcontent-tit span{ background: #009944; display: inline-block; padding: .8em 3em .8em 1em; font-size: 1.2rem; font-weight: 400; border-top-left-radius: 1em; border-top-right-radius: 1em;  }
.PDcontent-tit span img{ display: inline-block; vertical-align: middle; margin-right: .5em; }
.PDcontent-txt{ padding: 5em 5%; background: #f7f7f7; }
.PDcontent-txt img{ display: inline-block; margin: 5px; }





/*
.zoom {   }
.zoom img {	display: block;     } 
.zoom img::selection { background-color: transparent; }
.zoom { cursor: -webkit-zoom-in !important; cursor: zoom-in !important;  cursor: url(../img/iconZoomIn.cur) 0 0, zoom-in !important;  } 
*/




/* == product contact == */
.pdtContact{ padding: 3.5em 6%; margin-top: 10px;  background: url(../img/bg02.jpg) no-repeat center center; box-shadow: 0 4px 4px rgba(0,0,0,0.15); font-style: italic;   }
.pdtContact-L,
.pdtContact-R{ display: inline-block; vertical-align: middle;  margin-right: -4px;   }
.pdtContact-L{ width: 60%; max-width: 560px;  margin-right: -4px; }
.pdtContact-R{ width: 36%; text-align: center;    }

.aaGradiGray{ display:inline-block; padding: .85em 2em; box-shadow: 0 3px 5px rgba(0,0,0,0.6); border-radius: 50em; 
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #fcfcfc 47%, #d5d5d5 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #ffffff), color-stop(47%, #fcfcfc), color-stop(100%, #d5d5d5));
background: -webkit-linear-gradient(top, #ffffff 0%, #fcfcfc 47%, #d5d5d5 100%);
background: -o-linear-gradient(top, #ffffff 0%, #fcfcfc 47%, #d5d5d5 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #fcfcfc 47%, #d5d5d5 100%);
background: linear-gradient(to bottom, #ffffff 0%, #fcfcfc 47%, #d5d5d5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d5d5d5', GradientType=0 ); }
.aaGradiGray i,
.aaGradiGray span{ display: inline-block; vertical-align: middle; }
.aaGradiGray span{ padding-left: .8em; }
.aaGradiGray:hover{ color: #ff0000; box-shadow: 0 3px 5px rgba(0,0,0,0.7);  }

 
@media (max-width: 750px){
	.pdtContact-L,
	.pdtContact-R{ width: 100%; max-width: none;  }
	.pdtContact-R{ text-align: left; padding-top: 1em;  }
}


/* ===============  about  =============== */
#AB1{ padding: 5em 0; background: url(../img/bgAB0.jpg) no-repeat 0 0; background-size: contain;  }
.tit1{ padding: 2em 0; letter-spacing: .1em; line-height: 1.3;margin-bottom: 1em; }
.tit1 h3{ font-size: 2.5rem; font-weight: 500;  }
.tit1 small{  font-size: 1.125rem; display: block; color: #767676; }
.tit1 span{ display: inline-block; margin-right: -.35em;  } 


.aboutTXT-img{ width: 48%; display: inline-block; padding: 2em 5% 2em 5%; text-align: center;  }
.aboutTXT-txt{ width: 50%; display: inline-block; font-size: 1.125rem; padding: 2em 0;   }
.aboutTXT-txt ul{ line-height: 1.5; margin: 1em 0; }
.aboutTXT-txt li{ padding-left: 1.4em; margin-bottom: .5em; }
.aboutTXT-txt li:before{ content: ''; display: inline-block; vertical-align: middle; background: #2d9157; width: 4px; height: 4px; border-radius: 50em; margin-left: -1em; margin-right: .7em;  }
@media (max-width:1000px){
	.aboutTXT-img,
	.aboutTXT-txt{ width: 100%; }
}

#AB2{ background: rgb(234,234,234,1); background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(234,234,234,1) 90%);}
.tit2{ padding: 2em 0; letter-spacing: .1em; line-height: 1.3; }
.tit2 h3{ font-size: 1.375rem; font-weight: 500;  letter-spacing: .5em; }
.tit2 small{ color: #767676; display: inline-block; }
.story{ background: url(../img/bgAB.png) no-repeat center 0; padding: 5em 0; text-align: center; }
.story h4{ color: #2d9157; font-style: italic; font-weight: 500; font-size: 3rem; letter-spacing: .3em; padding: 1em 0; }
.story h4 span{ display: inline-block; }
.story3item{   }
.story3item li{ width: 33.3%; padding: 3em 5%; display: inline-block; vertical-align: top; margin-right: -4px;   }
.story3item ._img{   }
.story3item ._img img{ max-width: 100%;}
.story3item h5{ color: #2d9157; font-size: 1.5625rem; font-weight: bold; margin: 1em 0;  }

@media (max-width:760px){ 
	.story3item li{ width: 100%; max-width: 500px; margin: 0 auto; }
}
@media (min-width: 760px){
	.story3item li:nth-child(1) ._img{ -webkit-animation-delay: .1s; animation-delay: .1s; }
	.story3item li:nth-child(2) ._img{ -webkit-animation-delay: .3s; animation-delay: .3s; }
	.story3item li:nth-child(3) ._img{ -webkit-animation-delay: .5s; animation-delay: .5s; }	
}
@media (max-width:640px){
	.story h4{ letter-spacing: 0; font-size: 2.5rem; } 
	#AB1{ background-size: 150% auto; }
}
@media (max-width:400px){ 
	.story3item ._img img{ max-width: 200px; }
}


/* ===============  dealer  =============== */
.bgGlobe{ background:url(../img/bgGlobe.png) no-repeat center 230px; }

#dealer-tit{ margin-bottom: 2em; }
#dealer-ans{ padding: .5em 0 1em 0; }
.titMap{ display: table; width: 100%; margin: 30px 0; min-height: 72px; line-height: 1.5em;   }
.titMap span, 
.titMap i{ display: table-cell; vertical-align: middle; } 
.titMap span{  width: 90px; } 
 

.searchDealer{ width: 100%; background: #fff url(../img/bgPen.png) no-repeat right center; color:#666666; padding: 20px 20px 10px 20px;box-shadow: 0 4px 4px rgba(0,0,0,0.15); font-style: italic; margin: 1em auto; }
.searchDealer ul{   }
.searchDealer li{ display: inline-block; vertical-align: middle; font-size: .8125rem; margin-bottom: 10px;  }
.searchDealer li:not(:last-child){ margin-right: 1em;  }
.searchDealer li.hasSelect{ width: 180px; }
@media (max-width:730px){
	.searchDealer li:nth-child(1){ width:100%; }
}

.aa1{ background: #000; color: #fff; display: inline-block; padding: 11px 1.5em;  }
.aaGridPatten{ background:url(../img/bgGrid.jpg) repeat 0 0; padding: .4em 2em .4em 1em; color: #fff; border-radius: 50em;  }
.aaGridPatten i{ font-size: .8em; margin-right: .5em; -webkit-transition: all .3s; transition: all .3s; 
 }
.aaGridPatten:hover i{ color: #ff0000;  }

.distri{ background: url(../img/bgLand.jpg) repeat 0 0; width: 49%; float: left; font-style: italic; padding: 1.5em 2em; line-height: 1.6em; box-shadow: 0 5px 10px rgba(0,0,0,0.2); margin-bottom: 2%;  }

.distri h5{ position:relative; padding-bottom:1em; margin-bottom: 1em; border-bottom: solid 1px #bdbdbd;  }
.distri h5:after{ content:''; display: block; width:40%; height: 1px; position:absolute; bottom: -1px; left:0; background: #ff0000;  }
.distri h5 span{ font-weight: bold; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 3.3em; }

.distri-detail{ height: 8em; margin-bottom: .5em; }
.distri-detail > li{ font-size: .8125rem; color: #666;   }
.distri-detail > li > span{ color: #ff0000; }

@media (min-width: 641px){
	article.distri:nth-of-type(2n+2){ margin-left: 2%;  }
}
@media (max-width: 640px){
	.distri{ width: 100%; margin-bottom: 1em; }
}

 
/* ===============  registration  =============== */
.tit02{ width: 90%;  margin-top: 1em; margin-bottom: 3em;  font-style: italic;  }
.tit02 em{ line-height: 1.5em; display: block; }
.tit02 hr{ width: 52px; margin-top: 1em; margin-bottom: 1em;   }

.formRegBG{ background: #fff; padding: 3em 0 5em 0; margin: 0 auto; }
.formReg{ width: 90%; max-width: 900px; margin: 0 auto;   }

.fillform-col{ width: 100%; /*font-size: .8125rem;*/   }
.fillform-col:after{ content:''; clear:both; display:block; }
div[class^="fillform-grid-"]{ padding: .5em 0; display: block; position:relative;  }

.fillform-col label{ display: inline-block; vertical-align:middle; height: 1em; font-style: italic;
position: absolute; top: 16px; left:1em; bottom:0; /*margin: auto; */ } 

.fillform-grid-w1{ width:100%;   }
.fillform-grid-w2{ float:left; width: 48.5%;   }
.fillform-grid-w2 + .fillform-grid-w2{ margin-left: 3%;  }

.fillform-col input,
.fillform-col textarea{ width: 100%; padding: 7px 1em 7px 9.5em; display: inline-block; vertical-align:middle; border: solid 1px #ccc; -webkit-appearance: none;
border-radius: 0px; }
.fillform-col input:focus,
.fillform-col textarea:focus{ border: solid 1px #ff0000; background:#fff;  }

@media (max-width:900px){
	.fillform-grid-w2{ width: 100%;   }
	.fillform-grid-w2 + .fillform-grid-w2{ margin-left: 0;  }
}

hr.dashTop{ border-top: dotted 1px #ccc; margin: 1.5em 0; background: none;  }
.bgGray{ background: #f6f6f6;  }

.aa2{ display: inline-block; padding: .5em 1.8em; color: #fff; background: #009944;   }
.aa2:hover{ background: #ff0000; color: #fff; }



/* ===============  contact  =============== */
#contact{  padding: 5em 0; }
.formContact{   }
.formContact-L,
.formContact-R{ display: inline-block; vertical-align: top; }
.formContact-L{ width: 35%; padding: 2em 4%; min-height: 470px; background: #ebebeb;  }
.formContact-R{ width: 64%; padding: 0 8% 360px 2%; background: url(../img/bgContact.jpg) no-repeat right bottom; min-height: 470px;   }

@media (max-width: 1020px){ 
	.formContact-L{ width: 43%; padding: 2em 4%; min-height: auto;   }
	.formContact-R{ width: 55%;  padding: 0 0 360px 2%;     }
}

@media (max-width: 880px){ 
	.formContact-L,
	.formContact-R{ width: 100%; display: block; }
	.formContact-R{ padding: 3em 0 400px 0;   }
}
@media (max-width: 500px){  
	.formContact-R{  background-size: 180% auto; padding-bottom: 330px }
}

.formContact-L ._tit{ background: url(../img/phoneSpot.png) no-repeat 0 0; padding-left: 96px; min-height: 60px; margin-bottom: 1em; line-height: 1.3;  }
.formContact-L ._tit h5{ font-weight: bolder; color: #2d9157; font-size: 1.54rem;  }
.formContact-L ._tit small{ font-size: 1rem;}
.formContact-R p{ line-height: 2; font-weight: 400; font-size: 1.125rem; }

.phoneListsss{ padding: 1em 0;   }
.phoneListsss li{ color: #2d9157; padding: 1em 0; border-bottom: dotted 1px #666; font-weight: 500; }
.mainPhone{ background: url(../img/mainPhone.png) no-repeat 0 0;  font-size: 2.125rem; font-weight: 600; color: #2d9157; padding: 0 0 0 50px;  margin: 1em 0;  }
.mainPhone i { display: inline-block; }

 
/* ==========================================================================
Waypoints
========================================================================== */
.hide, .wp1{ visibility: hidden;  }
.visible, .animated.fadeIn  { visibility: visible !important; }