/*
Theme Name: OLAS
Version: 1.0
*/
html {overflow-x:hidden;background:#fff; height:100%; margin:0; padding:0;}
body{ margin:0; padding:0;  height:100%; font-family:"sailec-light";}
.hidden_y0{ overflow-y:hidden;}
a{  text-decoration:none; padding:0; margin:0}
ul{ margin:0; padding:0;list-style:none}
li{ margin:0; padding:0;}
.left{ float:left}
.right{ float:right}
img{ border:none; margin:0; padding:0}
p{margin:0; padding:0;}
input,textarea,select,button {outline:none; border:none; margin:0; padding:0}
dd,dt,dl{ margin:0; padding:0 }
h1,h2,h3,h4,h5{ margin:0; padding:0; font-weight:normal}
.text_left{ text-align:left}
.text_right{ text-align:right}
.clear{ clear:both}
.margin_112{ width:100%; height:112px;}
.sample_box{width: 91.6%; height: auto; overflow: hidden; margin: 0 auto; }
.section_sample h2,h3,h4,h5{font-family: "sailec-light";color: #000;margin-bottom: 10px;margin-top: 16px}
.section_sample h2{font-size: 36px;}
.section_sample h3{font-size: 33px;}
.section_sample h4{font-size: 30px;}
.section_sample h5{font-size: 27px;}
.section_sample ul li{font-family:"sailec-light";  line-height:32px; height:auto; margin-bottom:14px; padding-left:39px; background:url(images/li_left.png) 6px 14px no-repeat  }
.section_sample blockquote{font-size: 24px;color: #000;line-height: 32px;font-family: "sailec-light"}
.section_sample table{margin: 10px 0}
.section_sample table th{color: white;font-weight: 700;background-color: #000;padding: 10px;}
.section_sample table td{padding: 7px;text-align: center;}
.section_sample ul{margin: 10px 0}
@media screen and (-webkit-min-device-pixel-ratio:0){ .section_sample ol{ /*padding-left: 20px!important*/; } }
.section_sample ol{list-style-type:none;counter-reset:sectioncounter;padding: 0;position: relative;}
.section_sample ol li:before {content:counter(sectioncounter) "."; counter-increment:sectioncounter; position: absolute;left: 0;}
.section_sample ol li{padding-left: 36px;font-family: "sailec-light"; color: #000; line-height: 32px; height: auto; margin-bottom: 14px;}
.section_sample a{position: relative;color:#000;font-family:"sailec-light";font-weight: normal;transition: All 0.3s ease-in-out; -webkit-transition: All 0.3s ease-in-out; -moz-transition: All 0.3s ease-in-out; -o-transition: All 0.3s ease-in-out;}
.section_sample p{font-size: 24px; line-height: 32px; color: #000; margin-bottom: 30px;} .section_sample li{font-size: 24px; line-height: 32px; color: #000; margin-bottom: 30px;} .section_sample a:hover{}

::-moz-selection { /* Code for Firefox */
    color: #fff;
    background: #000;
}

::selection {
    color: #fff; 
    background: #000;
}

@font-face{
font-family:'sailec-light';
src:url('font/sailec-light.ttf') format('truetype')
}
header{ width:91.6%; height:226px;  margin:0 auto;background:#fff; }
.logo{ display:block; width:205px; height:57px; float:left;  margin-top:83px;}
.pc_nav{}
.noanimation .logo{animation:noanimation 2s forwards;-moz-animation:noanimation 2s forwards; -webkit-animation:noanimation 2s forwards; -o-animation:noanimation 2s forwards;}
.logo img{ display:block; width:100%; }
.mobile_nav{ display:none}
.pc_nav{ float:right; margin-top:90px;}
.pc_nav ul{}
.pc_nav ul li{ float:left; height:57px; line-height:57px; margin-left:38px}
.pc_nav ul li a{ font-size:24px; color:#000;}
.pc_nav ul li a:before{ content:""; width:0; height:2px; background:#000; display:block;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out; margin-bottom:13px}
.pc_nav ul li a:hover:before{ width:100%}
.pc_nav ul .active a:before{ width:100%}
.main01{ width:91.6%; margin:0 auto; height:-moz-calc(100% - 226px); height:-webkit-calc(100% - 226px); height:calc(100% - 226px); position:relative; overflow:hidden;animation:journal_post 2s forwards;-moz-animation:journal_post 2s forwards; -webkit-animation:journal_post 2s forwards; -o-animation:journal_post 2s forwards; }
.main01_left{ float:left; width:44.75%; height:auto; overflow:hidden; position:absolute; left:0; bottom:7.2%}
.main01_left p{ font-size:36px; color:#000;line-height: 46px;}
.main01_right{ float:right; width:49.4%; height:auto; overflow:hidden; position:absolute; right:0; bottom:8.3%}
.main01_right img{ display:block; width:100%; height:auto;}
.main02{ width:100%; height:auto; overflow:hidden; background:#eee;}
.main02_box{ width:91.6%; height:auto; overflow:hidden; margin:0 auto; padding-top:84px; padding-bottom:120px;animation: journal_post 2s forwards; -moz-animation: journal_post 2s forwards; -webkit-animation: journal_post 2s forwards; -o-animation: journal_post 2s forwards;}
.home_products_left{width:49.4%;left:0; top:0; height:auto; overflow:hidden; float:left; margin-bottom:80px;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;}
.home_products_left_move{left:0!important; top:0!important;width:100%!important;position:fixed; z-index:999}
    
.home_products_left h2{font-size:36px; color:#000; line-height:46px; height:auto; overflow:hidden; width:auto; display:inline-block; cursor:pointer; margin-bottom:41px;}
.home_products_left h2 a{font-size:36px; color:#000; line-height:46px; }
.home_products_left h2:before{ content:""; width:0; height:2px; background:#000; display:block;transition:All 0.5s ease-in-out;-webkit-transition:All 0.5s ease-in-out;-moz-transition:All 0.5s ease-in-out;-o-transition:All 0.5s ease-in-out; margin-bottom:26px}
.home_products_left h2:hover:before{ width:100%}
.products_link{ display:block; transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out; position:relative;}
.products_link img{ width:100%; display:block;height: auto;}
.addanimation{opacity:1;}
.products_link:hover{
    -webkit-filter: grayscale(90%);
    -moz-filter: grayscale(90%);
    -ms-filter: grayscale(90%);
    -o-filter: grayscale(90%); 
    filter: grayscale(90%);
    }
.products_link02:hover{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%); 
    filter: grayscale(0%);
    }
    
    
.home_products_right{ width: 49.4%; left: 0; top: 0; height: auto; overflow: hidden; float: right; margin-bottom: 80px; transition: All 0.3s ease-in-out; -webkit-transition: All 0.3s ease-in-out; -moz-transition: All 0.3s ease-in-out; -o-transition: All 0.3s ease-in-out;}
 .home_products_right h2{font-size:36px; color:#000; line-height:46px; height:auto; overflow:hidden; width:auto; display:inline-block; cursor:pointer;margin-bottom:41px;}
.home_products_right h2 a{font-size:36px; color:#000; line-height:46px; }
.home_products_right h2:before{ content:""; width:0; height:2px; background:#000; display:block;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out; margin-bottom:26px}
.home_products_right h2:hover:before{ width:100%}
.h2_hover:before{ width:100%!important}
.main03{ width:100%; height:auto; overflow:hidden; background:#fff;animation:journal_post 2s forwards;-moz-animation:journal_post 2s forwards; -webkit-animation:journal_post 2s forwards; -o-animation:journal_post 2s forwards;}
.main03_box{ width:91.6%; height:auto; overflow:hidden; margin:0 auto; padding-bottom:47px}
.main03_box h2{font-size:36px; color:#000; line-height:46px;padding:0 0 19px 0; border-bottom:2px solid #000}
.main03_box ul{}
.main03_box ul li{ height:auto; overflow:hidden; color:#000; padding:18px 0; border-bottom:2px solid #000; transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;}
.main03_box ul li a{ font-size:36px; color:#000; }

.main03_box ul li a .journal_l{ float:left;font-size:36px; line-height:46px;  color:#000; transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;}
.main03_box ul li a .journal_r{ float:right; font-size:36px;line-height:46px;  color:#000; text-align:right}
.main03_box ul li a:hover .journal_l{-webkit-transform: translate(10px, 0);-moz-transform: translate(10px, 0);-ms-transform: translate(10px, 0);-o-transform: translate(10px, 0);transform: translate(10px, 0);}
.main03_box ul li a:hover .journal_l_new{-webkit-transform: translate(0, 0);-moz-transform: translate(0, 0);-ms-transform: translate(0, 0);-o-transform: translate(0, 0);transform: translate(0, 0);}

footer{ width:100%; height:auto; overflow:hidden; padding-top:47px; padding-bottom:104px}
.footer_main{ width:91.6%; height:auto; overflow:visible; margin:0 auto;}
.footer_box01{ float:left}
.footer_box01 a{ font-size:24px; color:#000; display:inline-block; line-height:30px; height:auto; overflow:hidden}
.footer_box01 a:before{content:""; width:0; height:2px; background:#000; display:block;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out; margin-bottom:15px}
.footer_box01 a:hover:before{ width:100%}
.footer_box02{ float:left; margin-left:248px; position:relative}
.footer_box02 p{ height:auto; overflow:hidden; padding-right:16px}
div.wpcf7-validation-errors{ margin:10px 0 0 0!important; border:none!important; padding:0!important}
.newsletter_box{height:auto; overflow:hidden}
.newsletter_left{ float:left; height:auto; overflow:hidden}
.footer_box02 label{ float:left;font-size:24px; color:#000; line-height:30px; height:30px; margin-top:17px }
.email{ float:left;margin-left:17px; margin-top:17px  }
.e_mail{ display:block; width:276px;  line-height:30px; height:30px;  background:none;font-size:24px; color:#000;font-family:"sailec-light"; border-bottom:2px solid #000;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;-webkit-appearance:none; border-radius:0;}
.e_mail:focus { border-bottom:2px solid rgba(0,0,0,0)}
::-webkit-input-placeholder {   
    color:    #000;  
}
:-moz-placeholder { 
   color:    #000;  
   opacity:  1;  
}
::-moz-placeholder { 
   color:    #000;  
   opacity:  1;  
}
:-ms-input-placeholder { 
   color:    #000;  
}
.sign_button{ float:left; display:block; cursor:pointer; margin-left:55px; position:relative}
.sign_button input{background:none;font-size:24px; color:#000; font-family:"sailec-light"; cursor:pointer;}
.sign_button:before{    content: "";
    width: 0;
    height: 2px;
    background: #000;
    display: block;
    transition: All 0.3s ease-in-out;
    -webkit-transition: All 0.3s ease-in-out;
    -moz-transition: All 0.3s ease-in-out;
    -o-transition: All 0.3s ease-in-out;
    margin-bottom:17px;
    }
div.wpcf7 .ajax-loader{ position:absolute; right:-16px; bottom:0}
.sign_button:hover:before{ width:100%}
.footer_box03{ float:right}
.footer_box03 a{ font-size:24px; color:#000; display:inline-block; line-height:30px; height:auto; overflow:hidden}
.ig_link{ margin-right:25px}
.footer_box03 a:before{content:""; width:0; height:2px; background:#000; display:block;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out; margin-bottom:15px}
.footer_box03 a:hover:before{ width:100%}
/*about*/
.about_main{ width:100%; height:auto; overflow:hidden; background:#fff;animation:journal_post 2s forwards;-moz-animation:journal_post 2s forwards; -webkit-animation:journal_post 2s forwards; -o-animation:journal_post 2s forwards; }
.about_box{ width:91.6%; height:auto; overflow:hidden; margin:0 auto; min-height:600px}
.text_main_left{ width:71.8%}
.about_box p{ font-size:36px; line-height:46px; color:#000; margin-bottom:30px}
/*product*/
.product_main{ 
    width:91.6%; height:auto; overflow:hidden; position:relative; margin:0 auto
}
@keyframes product_main {
0%{
width:100%;
top:-226px;
}
50%{
top:0;
width:100%;
}
100% {
top:0;
width:91.6%;
}
}
@-moz-keyframes product_main {
0%{
width:100%;
top:-226px;
}
50%{
top:0;
width:100%;
}
100% {
top:0;
width:91.6%;
}
}
@-webkit-keyframes product_main {
0%{
width:100%;
top:-226px;
}
50%{
top:0;
width:100%;
}
100% {
top:0;
width:91.6%;
}
}
@-o-keyframes product_main {
0%{
width:100%;
top:-226px;
}
50%{
top:0;
width:100%;
}
100% {
top:0;
width:91.6%;
}
}
.product_main_box01{ width:100%; height:auto; overflow:hidden; margin-bottom:120px}
.product_main img{ width:100%; display:block;height: auto;}
.product_main_box02{ width:100%; height:auto; overflow:hidden; margin-bottom:120px}
.products_main_box02_left{width:44.9%; float:left;animation:journal_post 2s forwards;-moz-animation:journal_post 2s forwards; -webkit-animation:journal_post 2s forwards; -o-animation:journal_post 2s forwards;}
.products_paragraph{ width:100%; height:auto; overflow:hidden}
.products_paragraph h2{ font-size:36px; color:#000; line-height:46px; margin-bottom:80px}
.products_paragraph p{ font-size:24px; line-height:32px; color:#000; }
.products_paragraph a{ font-size:24px; line-height:32px; color:#000; margin-top:30px; display:inline-block;}
.products_paragraph a:after{  content:""; display:block; width:100%; height:2px; background:#000;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;}
.products_paragraph a:hover:after{ width:0}
.parameter{ width:100%; height:auto; overflow:hidden; margin-top:99px}
.materials{ float:left; width:41.5%;}
.materials:before{ content:""; display:block; width:26px; height:2px; background:#000; margin-bottom:20px;}
.dimensions{ float:right; width:41.5%;}
.dimensions:before{ content:""; display:block; width:26px; height:2px; background:#000; margin-bottom:20px;}
.parameter li{font-size:24px; line-height:32px; color:#000; word-wrap:break-word;}
.products_main_box02_right{width:36.1%; float:right; position:relative}
.product_main_box03{ width:74.5%;height:auto; overflow:hidden; margin-bottom:120px; position:relative}
.product_main_box04{ width:36.1%; margin-left:38.4%;height:auto; overflow:hidden; margin-bottom:70px; position:relative}
.product_main_box_new{height:auto; overflow:hidden; margin-bottom:120px; position:relative}
.w38{width:36.1%}
.w48{width:48.9%}
.w58{width:62.5%}
.w68{width:74.5%}
.w78{width:87.3%}
.w88{ width:100%}
.col0{ margin-left:0}
.col1{ margin-left:12.7%}
.col2{ margin-left:25.5%}
.col3{ margin-left:37.5%}
.col4{ margin-left:51.1%}
.col5{ margin-left:63.9%}
.products_main_box02_right img,.product_main_box03 img,.product_main_box04 img{ /*opacity:0*/}
/*post*/
.journal_bg{ width:100%; height:100%; background:#eee;animation:journal_post 2s forwards;-moz-animation:journal_post 2s forwards; -webkit-animation:journal_post 2s forwards; -o-animation:journal_post 2s forwards; position:absolute; left:0; top:0; z-index:1}
.journal_post{ width:100%; height:auto; overflow:hidden; position:relative}

@keyframes journal_post {
0%   {

opacity:0
}
100% {

opacity:1
}
}
@-moz-keyframes journal_post {
0%   {

opacity:0
}
100% {

opacity:1
}
}
@-webkit-keyframes journal_post {
0%   {

opacity:0
}
100% {

opacity:1
}
}
@-o-keyframes journal_post {
0%   {

opacity:0
}
100% {

opacity:1
}
}


@keyframes noanimation {
0%   {

opacity:1
}
100% {

opacity:1
}
}
@-moz-keyframes noanimation {
0%   {

opacity:1
}
100% {

opacity:1
}
}
@-webkit-keyframes noanimation {
0%   {

opacity:1
}
100% {

opacity:1
}
}
@-o-keyframes noanimation {
0%   {

opacity:1
}
100% {

opacity:1
}
}




.journal_post_main{ width:91.6%; height:auto; overflow:hidden; margin:0 auto; position:relative; z-index:2}
.journal_title{ width:100%; height:auto; overflow:hidden; padding:18px 0; border-bottom:2px solid #000; margin-top:95px;margin-bottom:60px}

.journal_title h2{ float:left; font-size:36px; line-height:46px; color:#000;}
.date{ float:right; font-size:36px; line-height:46px;  color:#000}
.journal_post_main .text_main_left p{ font-size:24px; line-height:32px; color:#000; margin-bottom:30px}
.journal_post_main .text_main_left img{ width:100%; display:block; margin-top:80px;height: auto;}
.journal_post_main .text_main_left{animation:fadein 1.5s forwards;-moz-animation:fadein 1.5s forwards; -webkit-animation:fadein 1.5s forwards; -o-animation:fadein 1.5s forwards; }
.pre_next_link{ width:100%; height:46px; margin-top:102px; margin-bottom:105px;animation:fadein 1.5s forwards;-moz-animation:fadein 1.5s forwards; -webkit-animation:fadein 1.5s forwards; -o-animation:fadein 1.5s forwards; }
.pre_next_link a{ font-size:36px; line-height:46px; color:#000}
.pre_next_link a:before{    content: "";
    width: 0;
    height: 2px;
    background: #000;
    display: block;
    transition: All 0.3s ease-in-out;
    -webkit-transition: All 0.3s ease-in-out;
    -moz-transition: All 0.3s ease-in-out;
    -o-transition: All 0.3s ease-in-out;
    margin-bottom: 15px;}
    
.pre_next_link a:hover:before{ width:100%}
.pre{ float:left}
.next{ float:right}



@keyframes fadein{
0%   {
opacity:0
}
100% {
opacity:1
}
}
@-moz-keyframes fadein {
0%   {
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes fadein {
0%   {
opacity:0
}
100% {
opacity:1
}
}
@-o-keyframes fadein {
0%   {
opacity:0
}
100% {
opacity:1
}
}

/*move*/
.img_move{ }
.begin_move{  position:absolute; left:0; bottom:50%; z-index:999}
.cover_img{

}
@keyframes cover_img {
0%   {
opacity:0
}
70%  {
opacity:0
}
70.1%  {
opacity:1
}
100% {
opacity:1
}
}
@-moz-keyframes cover_img {
0%   {
opacity:0
}
70%  {
opacity:0
}
70.1%  {
opacity:1
}
100% {
opacity:1
}
}
@-webkit-keyframes cover_img {
0%   {
opacity:0
}
70%  {
opacity:0
}
70.1%  {
opacity:1
}
100% {
opacity:1
}
}
@-o-keyframes cover_img {
0%   {
opacity:0
}
70%  {
opacity:0
}
70.1%  {
opacity:1
}
100% {
opacity:1
}
}
.cover_line{position:absolute;  top:0; background:#000; z-index:10; display:block}
.cover_line_move{
    animation:cover_line_move 1.5s forwards;
    -moz-animation:cover_line_move 1.5s forwards;
    -webkit-animation:cover_line_move 1.5s forwards;
    -o-animation:cover_line_move 1.5s forwards; 
}
@keyframes cover_line_move {
0%   {
width:2px;
height:0;
left:0;
}
33%  {
width:2px;
height:100%;
left:0;
}
45%  {
width:2px;
height:100%;
left:0;
}
70%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
70.1%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
100% {
width:2px;
height:100%;
left:100%;
opacity:0;
}
}
@-moz-keyframes cover_line_move {
0%   {
width:2px;
height:0;
left:0;
}
33%  {
width:2px;
height:100%;
left:0;
}
45%  {
width:2px;
height:100%;
left:0;
}
70%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
70.1%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
100% {
width:2px;
height:100%;
left:100%;
opacity:0;
}
}
@-webkit-keyframes cover_line_move {
0%   {
width:2px;
height:0;
left:0;
}
33%  {
width:2px;
height:100%;
left:0;
}
45%  {
width:2px;
height:100%;
left:0;
}
70%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
70.1%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
100% {
width:2px;
height:100%;
left:100%;
opacity:0;
}
}
@-o-keyframes cover_line_move {
0%   {
width:2px;
height:0;
left:0;
}
33%  {
width:2px;
height:100%;
left:0;
}
45%  {
width:2px;
height:100%;
left:0;
}
70%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
70.1%  {
width:2px;
height:100%;
left:100%;
opacity:1;
}
100% {
width:2px;
height:100%;
left:100%;
opacity:0;
}
}



.cover{position:absolute;  top:0; width:100%; height:100%; background:#eee; z-index:9;}
.cover_move{
    animation:cover_move 1.5s forwards;
    -moz-animation:cover_move 1.5s forwards;
    -webkit-animation:cover_move 1.5s forwards;
    -o-animation:cover_move 1.5s forwards;  
}
@keyframes cover_move {
0%   {
width:100%;
height:100%;
left:0;
right:auto
}
33%  {
width:100%;
height:100%;
left:0;
right:auto
}
44.9%  {
width:100%;
height:100%;
left:0;
right:auto
}
45%  {
width:100%;
height:100%;
left:auto;
right:0
}
70%  {
width:0;
height:100%;
left:auto;
right:0
}
100% {
width:0;
height:100%;
left:auto;
right:0
}
}
@-moz-keyframes cover_move {
0%   {
width:100%;
height:100%;
left:0;
right:auto
}
33%  {
width:100%;
height:100%;
left:0;
right:auto
}
44.9%  {
width:100%;
height:100%;
left:0;
right:auto
}
45%  {
width:100%;
height:100%;
left:auto;
right:0
}
70%  {
width:0;
height:100%;
left:auto;
right:0
}
100% {
width:0;
height:100%;
left:auto;
right:0
}
}
@-webkit-keyframes cover_move {
0%   {
width:100%;
height:100%;
left:0;
right:auto
}
33%  {
width:100%;
height:100%;
left:0;
right:auto
}
44.9%  {
width:100%;
height:100%;
left:0;
right:auto
}
45%  {
width:100%;
height:100%;
left:auto;
right:0
}
70%  {
width:0;
height:100%;
left:auto;
right:0
}
100% {
width:0;
height:100%;
left:auto;
right:0
}
}
@-o-keyframes cover_move {
0%   {
width:100%;
height:100%;
left:0;
right:auto
}
33%  {
width:100%;
height:100%;
left:0;
right:auto
}
44.9%  {
width:100%;
height:100%;
left:0;
right:auto
}
45%  {
width:100%;
height:100%;
left:auto;
right:0
}
70%  {
width:0;
height:100%;
left:auto;
right:0
}
100% {
width:0;
height:100%;
left:auto;
right:0
}
}
@media screen and (max-width: 1300px) {
.main01_left {width: 54.75%;left: 2%; bottom: 45.2%; z-index: 2;}
.main01_right {width: 100%;bottom: 8.3%;}
.footer_box02{ margin-left:50px}
}
@media screen and (max-width: 1099px) {
.footer_box_new{ height:auto; overflow:hidden}
.footer_box02{ margin-left:0; float:none;}
}
@media screen and (max-width: 900px) {
.main01{ height:auto; overflow:hidden; margin-bottom:80px}
.main01_left { width:100%; position:static}
.main01_right {width: 100%; position:static; margin-bottom:54px;}
.home_products_left{ width:100%; margin-bottom:60px}
.home_products_right{ width:100%}
.main02_box{ padding-top:64px; padding-bottom:100px}
.main03_box ul li a .journal_r{ display:none;}
.main03_box ul li{width:100%;}
.main03_box ul li a .journal_l{ width:100%;  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.journal_l_new{ white-space:normal!important}
.journal_r_new{ display:block!important; float:left!important}
.journal_title{ height:auto; overflow:hidden;}
.journal_title h2{ float:none; line-height:46px;}
.date{ float:none; line-height:46px}
.text_main_left{ width:100%}
}
@media (max-width: 769px) {
.pre_next_link a:before{ display:none}
.sign_button:before,.footer_box01 a:before,.footer_box03 a:before{ display:none}
.w38,.w48,.w58,.w68,.w78{width:100%}
.col0,.col1,.col2,.col3,.col4,.col5{ margin-left:0}
.products_main_box02_left,.products_main_box02_right{ width:100%; float:none; }
.product_main_box01{ margin-bottom:90px}
.product_main_box02,.product_main_box03,.product_main_box04{ width:100%; float:none; margin-left:0; margin-bottom:50px}
.product_main_box_new{ margin-bottom:50px}
.products_main_box02_right{ margin-top:82px}
.materials,.dimensions{ width:100%; float:none}
.dimensions{ margin-top:90px}
.products_link:hover{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(90%); 
    filter: grayscale(0%);
    }
	
@keyframes product_main {
0%{
top:0;
width:91.6%;
}
50%{
top:0;
width:91.6%;
}
100% {
top:0;
width:91.6%;
}
}
@-moz-keyframes product_main {
0%{
top:0;
width:91.6%;
}
50%{
top:0;
width:91.6%;
}
100% {
top:0;
width:91.6%;
}
}
@-webkit-keyframes product_main {
0%{
top:0;
width:91.6%;
}
50%{
top:0;
width:91.6%;
}
100% {
top:0;
width:91.6%;
}
}
@-o-keyframes product_main {
0%{
top:0;
width:91.6%;
}
50%{
top:0;
width:91.6%;
}
100% {
top:0;
width:91.6%;
}
}

.home_products_left_move{left:0!important; top:0!important;width:100%!important;position:relative!important; z-index:999}	
.home_products_left h2{ display:block!important}
.home_products_right h2{ display:block!important}
.main02_box{ width:91.6%!important}
}
@media screen and (max-width: 680px) {
.newsletter_left{ float:none}
.sign_button{ float:none; margin:10px 0 0 0; display:inline-block}
.sign_button:before{ margin-bottom:10px}
}
@media screen and (max-width: 641px) {
.home_products_left h2:before,.home_products_right h2:before{ display:none}

.nav_footer{ width:100%; position:absolute; bottom:0;padding-bottom: 10px; padding-top: 16px;}
.hidden_y{ overflow-y:hidden;}
header{ height:164px; width:84%}
.logo{ margin:51px 0 0 0; position:relative; z-index:999}
.pc_nav{ display:none}
.mobile_nav{ display:block;}
.mobile_nav_box{ width:100%; height:100%; background:#eee; position:absolute; left:0; top:0; z-index:9; display:none; transition:All 0.5s ease-in-out;-webkit-transition:All 0.5s ease-in-out;-moz-transition:All 0.5s ease-in-out;-o-transition:All 0.5s ease-in-out; }
.mobile_nav_box_show{ 
display:block; 
animation:mobile_nav_box_show .8s forwards;
-moz-animation:mobile_nav_box_show .8s forwards;
-webkit-animation:mobile_nav_box_show .8s forwards;
-o-animation:mobile_nav_box_show .8s forwards;
}
@keyframes mobile_nav_box_show {
0%{
opacity:0
}
100% {
opacity:1
}
}
@-moz-keyframes mobile_nav_box_show {
0%{
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes mobile_nav_box_show {
0%{
opacity:0
}
100% {
opacity:1
}
}
@-o-keyframes mobile_nav_box_show {
0%{
opacity:0
}
100% {
opacity:1
}
}

.mobile_nav_box ul{ width:84%; margin:0 auto; padding-top:182px}
.mobile_nav_box ul li{ height:82px; line-height:82px; border-bottom:2px solid #000}
.mobile_nav_box ul li a{ font-size:36px; color:#000;}
.menu{position:absolute; right:8%; top:66px; width:28px; height:28px; cursor:pointer; display:block;z-index:99;}
.noanimation .menu{animation:noanimation 2s forwards;-moz-animation:noanimation 2s forwards; -webkit-animation:noanimation 2s forwards; -o-animation:noanimation 2s forwards;}
.menu:before{content:""; position:absolute; right:0; top:13px; width:28px; height:2px; background:#000;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out; }
.menu:after{ content:"";position:absolute; right:0; top:13px; width:28px; height:2px; background:#000;transition:All 0.3s ease-in-out;-webkit-transition:All 0.3s ease-in-out;-moz-transition:All 0.3s ease-in-out;-o-transition:All 0.3s ease-in-out;}
.menu_click:before{
transform:rotate(45deg);
-ms-transform:rotate(45deg); 
-moz-transform:rotate(45deg);   
-webkit-transform:rotate(45deg);
-o-transform:rotate(45deg);
}
.menu_click:after{
transform:rotate(-45deg);
-ms-transform:rotate(-45deg); 
-moz-transform:rotate(-45deg);  
-webkit-transform:rotate(-45deg);
-o-transform:rotate(-45deg);
}
.main01,.main02_box,.main03_box,.footer_main,.journal_post_main,.about_box,.product_main{ width:84%!important}
.footer_box02{ margin-left:0;  }
.email{width:-moz-calc(100% - 133px); width:-webkit-calc(100% - 133px); width:calc(100% - 133px); margin-left:10px}
.e_mail{ width:100%}

}
@media (max-width: 415px){
    .section_sample h2{font-size: 18px;line-height: 23px;}
    .section_sample h3,.section_sample h4,.section_sample h5{font-size: 17px;line-height: 22px;}
    .section_sample p,.section_sample ol li,.section_sample ul li,.section_sample blockquote,.section_sample th{font-size: 16px;line-height: 20px;margin-bottom: 15px;}
    .section_sample ol li{padding-left: 24px;}
    .section_sample ul li{padding-left: 24px;background: url(images/li_left.png) 3px 7px no-repeat;}

.sign_button input{ font-size:16px}
header{ height:82px}
.logo{ width:102.5px; height:28.5px; margin-top:33px;}
.menu{ top:33px}
.mobile_nav_box ul li{ height:41px; line-height:41px}
.mobile_nav_box ul li a{ font-size:18px}
.mobile_nav_box ul{ padding-top:100px}
.footer_box01 a,.footer_box03 a{ font-size:16px}
.footer_box02 label{ font-size:16px;}
.email{font-size:16px;width: -moz-calc(100% - 91px);width: -webkit-calc(100% - 91px);width: calc(100% - 91px);}
.sign_button{ font-size:16px}
.main01_right{ margin-bottom:27px}
.main01_left p{font-size:18px; line-height:26px}
.main01{ margin-bottom:40px}
.main02_box{ padding:32px 0 50px 0}
.home_products_left,.home_products_right{ margin-bottom:30px}
.home_products_left h2,.home_products_right h2{ font-size:18px; line-height:23px; margin-bottom:20px;}
.home_products_left h2:before,.home_products_right h2:before{ margin-bottom:13px;}

.main03_box h2{ font-size:18px; line-height:23px; padding-bottom:10px;}
.main03_box ul li{ padding:9px 0; font-size:18px; line-height:23px;}
.main03_box ul li a .journal_l,.main03_box ul li a .journal_r{ font-size:18px; line-height:23px;}

.main03_box{ padding-bottom:23px}
footer{ padding:16px 0 88px 0;}
.margin_112{ height:56px}
.journal_title{ margin-top:63px; margin-bottom:30px; padding:9px 0}
.journal_title h2,.date{ font-size:18px; line-height:23px}
.journal_post_main .text_main_left p{ font-size:16px; line-height:20px; margin-bottom:15px}
.journal_post_main .text_main_left img{ margin-top:40px}
.pre_next_link{ margin-top:51px; margin-bottom:52.5px}
.pre_next_link a{ font-size:18px; line-height:23px;}
.about_box p{ font-size:18px; line-height:23px;}
.about_box{ min-height:0}
.product_main_box01{ margin-bottom:45px}
.products_paragraph h2{ font-size:24px; line-height:30px; margin-bottom:30px}
.products_paragraph p{ font-size:16px; line-height:20px}
.products_paragraph a{ font-size:16px; line-height:20px; margin-top:15px}
.parameter{ margin-top:50px}
.dimensions{ margin-top:45px}
.parameter li{ font-size:16px; line-height:20px;}
.products_main_box02_right{ margin-top:41px}
.product_main_box02, .product_main_box03, .product_main_box04{ margin-bottom:25px;}
.product_main_box_new{ margin-bottom:25px}

}
