@charset "utf-8"; /*********** responsive **********/ @media screen and (max-width: 768px){ /****** img *****/ img{ max-width: 100%; height: auto; width :auto; } /****** siteCommon ******/ .siteCommon .wrapper{ width:100%; } /****** fb_like_box ******/ .fbbox_top{ top: 25px; height: 350px; margin: 20px 15px; position:static !important; display: block !important; } .fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] { width: 100% !important; } .fbfluid .fbcomments, .fbfluid .fb_iframe_widget, .fbfluid .fb_iframe_widget[style], .fbfluid .fb_iframe_widget iframe[style], .fbfluid .fbcomments iframe[style], .fbfluid .fb_iframe_widget span{ width: 100%! important; } /****** visual ******/ .visualBox{ display:none; /*position:relative; margin-top:60px; height:485px;*/ }/* .bgstretcher, .bgstretcher ul, .bgstretcher ul li{ position:absolute; top:0; left:0; }*/ .bgstretcher{ display:none; /*background:black; overflow:hidden; width:100%; position:fixed; z-index:1; position:absolute; top:0; left:0;*/ }/* .visualBox #slideNav ul{ padding-top:200px; text-align:center; } .visualBox #slideNav ul li{ display:none; }*/ /* copy .visualBox .introBox{ position:absolute; width:100%; height:485px; top:0; left:0; } .visualBox .introBox .copyBox{ width:100%; margin:35px auto 0; } .visualBox .introBox .copyBox h1{ text-indent:-100%; height:0; }*/ /****** mainContent ******/ .mainContent{ width:100%; margin:0 auto; text-align:center; } .mainContent .menu{ display:inline-block; /display:inline; /zoom:1; margin:22px 15px 10px; } .mainContent .menu a figure{ line-height:0; filter:alpha(opacity=100); -moz-opacity:1; opacity:1; -webkit-transition:opacity .5s ease; -moz-transition:-moz-opacity .5s ease; -o-transition:filter .5s ease; transition:opacity .5s ease; } .mainContent .menu a:hover figure{ filter:alpha(opacity=50); -moz-opacity:.5; opacity:.5; } .mainContent .menu a h1{ padding:12px 0; background-color:#f0f0f0; -webkit-transition:background-color .5s ease; -moz-transition:background-color .5s ease; -o-transition:background-color .5s ease; transition:background-color .5s ease; font-size:0.8em; /*14px*/ text-align:center; } .mainContent .menu a:hover h1{background-color:#fcfcfc;} /****** footer ******/ footer{ /*margin-top:30px;*/ } footer .footerProducts{ background:#f0f0f0; } /* footerValue */ footer .footerValue{ display:none; /*width:950px; height:162px; margin:0 auto;*/ } /* image */ #image{ display:none; /*width:300px; height:162px; overflow:hidden;*/ } footer .image{ display:none; /*float:left; width:300px; height:162px; list-style:none; overflow:hidden; position:relative;*/ } footer .image li{ display:none; /*width:300px; height:162px; display:inline; float:left;*/ } /* bana */ footer .bana{ display:none; /*float:right; width:620px;*/ } footer .serviceBana1, footer .serviceBana2{ display:none; /*padding-top:22px; background:#f0f0f0;*/ } footer .serviceBana1 ul, footer .serviceBana2 ul{ display:none; /*margin-top:8px; overflow:hidden;*/ } footer .serviceBana1 li{ display:none; /*float:right; margin-left:44px;*/ } footer .serviceBana2 li{ display:none; /*float:right; margin-left:44px;*/ } footer .serviceBana1 li:last-child, footer .serviceBana2 li:last-child{ display:none; /*margin-left:0;*/ } footer .serviceBana1 li a, footer .serviceBana2 li a{ display:none; /*filter:alpha(opacity=100); -moz-opacity:1; opacity:1; -webkit-transition:opacity .5s ease; -moz-transition:-moz-opacity .5s ease; -o-transition:filter .5s ease; transition:opacity .5s ease;*/ } footer .serviceBana1 li a:hover, footer .serviceBana2 li a:hover{ display:none; /*filter:alpha(opacity=50); -moz-opacity:.5; opacity:.5;*/ } footer .footerMenu{ display:none; } /* fade slider */ #slides { margin:60px auto 0; overflow:hidden; position:relative; height:0px; } .slides ul { list-style:none; position:relative; } .slides ul li img{ width:100vw; } #copy img{ width:100%; position: relative; top: 140px; left: 28%; } /* keyframes #anim_slides */ @-webkit-keyframes anim_slides { 0% { opacity:0; } 6% { opacity:1; } 24% { opacity:1; } 30% { opacity:1; } 40% { opacity:0; } 100% { opacity:0; } } @-moz-keyframes anim_slides { 0% { opacity:0; } 6% { opacity:1; } 24% { opacity:1; } 30% { opacity:1; } 40% { opacity:0; } 100% { opacity:0; } } .slides ul li { opacity:0; position:absolute; top:0; /* css3 animation */ -webkit-animation-name: anim_slides; -webkit-animation-duration: 14.0s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: normal; -webkit-animation-delay: 0; -webkit-animation-play-state: running; -webkit-animation-fill-mode: forwards; -moz-animation-name: anim_slides; -moz-animation-duration: 14.0s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -moz-animation-direction: normal; -moz-animation-delay: 0; -moz-animation-play-state: running; -moz-animation-fill-mode: forwards; } /* css3 delays */ .slides ul li:nth-child(2), .slides ul li:nth-child(2) section { -webkit-animation-delay: 5.0s; -moz-animation-delay: 5.0s; } .slides ul li:nth-child(3), .slides ul li:nth-child(3) section { -webkit-animation-delay: 10.0s; -moz-animation-delay: 10.0s; } .slides ul li:nth-child(1), .slides ul li:nth-child(1) section { -webkit-animation-delay: 0.0s; -moz-animation-delay: 0.0s; } .slides ul li img { display:block; } /* keyframes #anim_titles */ @-webkit-keyframes anim_titles { 0% { left:10%; opacity:1; } 5% { left:10%; opacity:1; } 20% { left:10%; opacity:1; } 25% { left:10%; opacity:1; } 100% { left:10%; opacity:1; } } @-moz-keyframes anim_titles { 0% { left:10%; opacity:1; } 5% { left:10%; opacity:1; } 20% { left:10%; opacity:1; } 25% { left:10%; opacity:1; } 100% { left:10%; opacity:1; } } .slides ul li section { /*background-color:#000000;*/ /*border-radius:10px 10px 10px 10px;*/ /*box-shadow:0 0 5px #FFFFFF inset;*/ /*color:#FFFFFF;*/ /*font-size:26px;*/ /*left:10%;*/ margin:0 auto; padding:0px; position:absolute; top:10%; /*width:200px;*/ /* css3 animation */ -webkit-animation-name: anim_titles; -webkit-animation-duration: 15.0s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: normal; -webkit-animation-delay: 0; -webkit-animation-play-state: running; -webkit-animation-fill-mode: forwards; -moz-animation-name: anim_titles; -moz-animation-duration: 15.0s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -moz-animation-direction: normal; -moz-animation-delay: 0; -moz-animation-play-state: running; -moz-animation-fill-mode: forwards; } }