@charset "UTF-8";
@charset "UTF-8";

   html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.clearfix:after,
#news-list:after,
#news-list a:after,
#index-hot-link:after,
footer:after,
#cotton-list:after,
.box-2col:after,
.box-2col-w:after,
.box-3col:after,
.box-4col:after,
.half-box:after,
.ul-cosmetics:after,
.access-ul:after,
.particular-box:after,
.box-eq2:after,
.sitemap-ul:after,
#en-customers:after,
.cream-sheet-pack-box:after,
#history dl:after {
content: "";
display: block;
clear: both;
} #loader {
width: 100%;
height: 100%;
margin: 0;
background: #fff;
opacity: 1;
position: fixed;
top: 0;
left: 0;
z-index: 10000000;
}
#loader #loader-inner {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
width: 400px;
display: none;
}
@media screen and (max-width: 767px) {
#loader #loader-inner {
width: 300px;
}
}
@media screen and (max-width: 575px) {
#loader #loader-inner {
width: 200px;
}
}
a {
color: #005abe;
outline: none;
}
a:hover {
color: #0053af;
}
img {
max-width: 100%;
height: auto;
}
hr {
height: 0;
border: 0;
border-top: 1px solid #ddd;
margin: 30px 0;
}
.article-top-border {
border-top: 1px solid #ddd;
}
body {
-webkit-text-size-adjust: 100%;
font-size: 16px;
font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
line-height: 1.4;
background: #fff;
color: #333;
margin-top: 90px;
}
@media screen and (max-width: 1079px) {
body {
margin-top: 70px;
}
}
@media screen and (max-width: 575px) {
body {
margin-top: 50px;
}
}
#wrapper,
header,
section,
footer,
article {
margin: 0 auto;
} #header-box {
position: fixed;
z-index: 1000000;
background: rgba(255, 255, 255, 0.9);
width: 100%;
top: 0;
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
}
header {
position: relative;
}
#site-title {
font-size: 11px;
margin-left: 20px;
}
@media screen and (min-width: 1080px) {
#site-title {
float: left;
margin-top: 10px;
}
}
@media screen and (max-width: 575px) {
#site-title {
margin-left: 2%;
}
}
#site-title a {
width: 190px;
height: 70px;
display: block;
text-indent: -9999px;
transition: 0.3s;
}
@media screen and (min-width: 1080px) {
#site-title a {
float: left;
}
}
@media screen and (max-width: 575px) {
#site-title a {
height: 50px;
}
}
#site-title a:hover {
opacity: 0.6;
}
#site-title span {
display: none;
}
@media screen and (min-width: 1401px) {
#site-title span {
display: block;
float: left;
margin: 30px 0 0 20px;
}
}
#main-menu {
margin: 20px 0;
}
@media screen and (min-width: 1080px) {
#main-menu {
float: right;
}
}
@media screen and (max-width: 1079px) {
#main-menu {
display: none;
text-align: center;
margin: 10px 0;
}
}
#main-menu li {
font-size: 15px;
text-align: center;
}
@media screen and (min-width: 1080px) {
#main-menu li {
float: left;
}
}
@media screen and (max-width: 1079px) {
#main-menu li {
display: inline-block;
}
}
@media screen and (max-width: 1200px) {
#main-menu li {
font-size: 13px;
}
}
@media screen and (max-width: 767px) {
#main-menu li {
float: left;
display: block;
width: 33.3%;
}
}
@media screen and (min-width: 768px) {
#main-menu li {
transform: skewX(160deg);
border-right: 1px solid #ddd;
}
#main-menu li:last-child {
border-right: none;
}
}
#main-menu a {
text-decoration: none;
color: #333;
padding: 5px 20px;
position: relative;
transition: 0.1s;
display: block;
}
@media screen and (max-width: 1200px) {
#main-menu a {
padding: 5px 12px;
}
}
@media screen and (max-width: 767px) {
#main-menu a {
padding: 20px 0;
}
}
@media screen and (min-width: 768px) {
#main-menu a {
transform: skewX(-160deg);
}
}
#main-menu a:hover {
color: #005abe;
}
#main-menu a:hover .menu-item-description {
color: #333;
}
#main-menu a::before {
content: "";
display: inline-block;
width: 0;
height: 4px;
background: #005abe;
position: absolute;
bottom: -21px;
transform: translateX(-50%);
transition: width 0.1s;
}
@media screen and (max-width: 1200px) {
#main-menu a::before {
bottom: -12px;
}
}
@media screen and (max-width: 767px) {
#main-menu a::before {
bottom: 0;
}
}
@media screen and (min-width: 768px) {
#main-menu a::before {
left: 35%;
}
}
#main-menu a:not(.ios):hover::before {
width: 100%;
}
#main-menu span {
display: block;
}
#main-menu span:first-child {
font-weight: bold;
margin-bottom: 4px;
}
#main-menu .menu-item-description {
font-size: 11px;
color: #005abe;
margin-left: -3px;
font-family: "Josefin Sans", sans-serif;
}
.single-products body:not(.home) #main-menu .menu-item-object-products a::before,
body:not(.home) #main-menu .current-menu-item a::before {
width: 100%;
}
#link-en {
background: #005abe;
color: #fff;
float: right;
width: 60px;
height: 90px;
padding-top: 10px;
text-align: center;
text-decoration: none;
font-size: 12px;
line-height: 12px;
box-sizing: border-box;
transition: 0.3s;
}
@media screen and (max-width: 1079px) {
#link-en {
display: none;
}
}
#link-en:hover {
color: #005abe;
background: #ddd;
}
#link-en:hover #globe {
fill: #005abe;
}
#link-en #globe {
fill: #ffffff;
width: 30px;
transition: 0.3s;
}
#link-en span {
display: block;
font-family: "Josefin Sans", sans-serif;
}
#btn {
display: none;
}
@media screen and (max-width: 1079px) {
#btn {
display: block;
width: 70px;
height: 70px;
right: 0;
top: 0;
position: fixed;
z-index: 100001;
transition: 0.4s;
background: #005abe;
}
}
@media screen and (max-width: 1079px) and (max-width: 575px) {
#btn {
width: 50px;
height: 50px;
}
}
@media screen and (max-width: 1079px) {
#btn:before, #btn:after, #btn span {
display: block;
width: 55%;
position: absolute;
left: 0;
right: 0;
margin: auto;
transition: 0.35s ease-in-out;
}
#btn span {
height: 3px;
background-color: #fff;
top: calc(50% - 1.5px);
}
#btn:before {
content: "";
top: calc(30% - 3px);
border-top: 3px solid #fff;
}
#btn:after {
content: "";
bottom: calc(30% - 3px);
border-bottom: 3px solid #fff;
}
#btn.on span {
display: none;
}
#btn.on:before {
top: calc(50% - 1.5px);
transform: rotate(315deg);
}
#btn.on:after {
bottom: calc(50% - 1.5px);
transform: rotate(-315deg);
}
} #footer-box {
background: #0053af;
color: #fff;
padding: 80px 0;
}
.page-english #footer-box, .page-chinese #footer-box, .page-contact-en #footer-box, .page-contact-finish-en #footer-box, .page-contact-cn #footer-box, .page-contact-finish-cn #footer-box {
padding: 20px;
}
#footer-title {
width: 190px;
height: 50px;
text-indent: -9999px;
margin-bottom: 20px;
}
@media screen and (max-width: 991px) {
#footer-title {
width: 230px;
height: 37px;
}
}
@media screen and (max-width: 767px) {
#footer-title {
width: 300px;
height: 50px;
margin: 0 auto;
}
}
@media screen and (max-width: 575px) {
#footer-title {
width: 230px;
height: 37px;
}
}
#footer-address,
.footer-menu {
width: 33.333%;
float: left;
box-sizing: border-box;
padding-right: 3%;
}
@media screen and (max-width: 767px) {
#footer-address {
float: none;
width: 100%;
text-align: center;
margin-bottom: 40px;
}
}
@media screen and (max-width: 575px) {
#footer-address {
width: 96%;
margin-right: 2%;
margin-left: 2%;
}
}
@media screen and (max-width: 767px) {
.footer-menu {
width: 50%;
}
.footer-menu:last-of-type {
border-right: solid 1px #0683c9;
}
}
@media screen and (max-width: 575px) {
.footer-menu {
font-size: 13px;
}
}
.footer-menu .menu-item-description {
display: none;
}
footer {
margin-bottom: 80px;
}
@media screen and (min-width: 1080px) {
footer {
width: 1080px;
}
}
footer a {
color: #fff;
text-decoration: none;
}
footer a:hover {
color: #fff;
text-decoration: underline;
}
.footer-menu {
border-left: solid 1px #0683c9;
box-sizing: border-box;
padding-left: 20px;
}
#footer-contact {
margin: 20px 0 0;
}
#footer-contact a {
padding: 10px 20px;
border: solid 1px #fff;
display: inline-block;
transition: 0.3s;
}
#footer-contact a:hover {
background: #fff;
color: #0053af;
text-decoration: none;
}
#copyright {
clear: both;
text-align: center;
font-size: 10px;
margin: 0 2%;
}
@media screen and (min-width: 768px) {
#copyright br {
display: none;
}
}
#backtotop {
display: none;
position: fixed;
z-index: 100;
bottom: 50px;
right: 50px;
}
#backtotop a {
font-size: 50px;
}
#backtotop a i {
color: #26517F;
}
@media screen and (max-width: 767px) {
#backtotop {
bottom: 2%;
right: 5%;
}
#backtotop a {
font-size: 40px;
}
} article {
position: relative;
margin: 0 auto;
padding: 30px 0;
box-sizing: border-box;
background: #fff;
}
@media screen and (min-width: 576px) {
article {
min-height: 500px;
}
}
@media screen and (min-width: 1080px) {
article {
width: 1080px;
}
}
@media screen and (max-width: 1079px) {
article {
margin: 0 3% 20px;
}
}
@media screen and (max-width: 991px) {
.submenu + article {
padding: 80px 0 30px;
}
}
@media screen and (max-width: 767px) {
.submenu + article {
padding: 50px 0 30px;
}
}
@media screen and (max-width: 575px) {
.submenu + article {
padding: 0 0 30px;
}
}
.single-news article {
padding: 30px;
max-width: 900px;
margin-top: 50px;
}
article img {
max-width: 100%;
height: auto;
}
article p {
margin: 30px 0;
line-height: 2;
}
article p.lineheight-l {
line-height: 2em;
}
@media screen and (max-width: 767px) {
article p {
font-size: 14px;
line-height: 1.6;
margin: 20px 0;
}
}
article h3 {
margin: 150px 0 80px;
text-align: center;
font-size: 46px;
}
@media screen and (max-width: 991px) {
article h3 {
font-size: 40px;
margin: 90px 0 70px;
}
}
@media screen and (max-width: 767px) {
article h3 {
font-size: 30px;
margin: 90px 0 30px;
}
}
@media screen and (max-width: 575px) {
article h3 {
font-size: 24px;
}
}
.single-news article h3 {
font-size: 36px;
margin: 40px 0 auto;
text-align: left;
}
article h4 {
font-size: 30px;
margin: 100px 0 80px;
text-align: center;
}
@media screen and (max-width: 991px) {
article h4 {
font-size: 26px;
}
}
@media screen and (max-width: 767px) {
article h4 {
font-size: 22px;
margin: 100px 0 40px;
}
}
@media screen and (max-width: 575px) {
article h4 {
font-size: 18px;
font-weight: bold;
}
article h4 span {
font-weight: normal;
}
}
.single-news article h4 {
margin: 40px 0 auto;
text-align: left;
}
article h5 {
font-size: 20px;
margin: 20px 0;
}
@media screen and (max-width: 991px) {
article h5 {
font-size: 18px;
}
}
@media screen and (max-width: 767px) {
article h5 {
font-size: 16px;
}
}
@media screen and (max-width: 575px) {
article h5 {
font-size: 14px;
font-weight: bold;
}
}
article table {
width: 100%;
}
#recruit-flow h4 {
margin: 100px auto 0;
}
.post-type-archive-news h3,
.tax-news-cat h3 {
margin: 150px 0 80px;
text-align: center;
font-size: 46px;
}
@media screen and (max-width: 991px) {
.post-type-archive-news h3,
.tax-news-cat h3 {
font-size: 40px;
margin: 90px 0 70px;
}
}
@media screen and (max-width: 767px) {
.post-type-archive-news h3,
.tax-news-cat h3 {
font-size: 30px;
margin: 90px 0 30px;
}
}
@media screen and (max-width: 575px) {
.post-type-archive-news h3,
.tax-news-cat h3 {
font-size: 24px;
}
}
@media screen and (max-width: 767px) {
.post-type-archive-news p.subtitle-en,
.tax-news-cat p.subtitle-en {
margin: -30px 0 70px;
}
}
.headline span {
position: relative;
display: inline-block;
padding: 0 55px;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif;
}
@media screen and (max-width: 767px) {
.headline span {
padding: 0 35px;
}
}
.headline span:before, .headline span:after {
content: "";
position: absolute;
top: 50%;
display: inline-block;
height: 2px;
background-color: #333;
width: 60px;
}
@media screen and (max-width: 991px) {
.headline span:before, .headline span:after {
width: 50px;
}
}
@media screen and (max-width: 767px) {
.headline span:before, .headline span:after {
width: 30px;
}
}
.headline span:before {
left: -30px;
}
.headline span:after {
right: -30px;
}
@media screen and (max-width: 991px) {
.headline span:before {
left: 0;
}
.headline span:after {
right: 0;
}
}
#en-customers {
background: #f7f7fb;
padding: 20px 30px;
box-sizing: border-box;
}
#en-customers li {
font-size: 14px;
}
@media screen and (min-width: 576px) {
#en-customers li {
width: 32%;
float: left;
margin: 10px 2% 10px 0;
}
}
#en-customers li:nth-child(3n) {
margin-right: 0;
} .bx-wrapper {
border: 0 !important;
box-shadow: none !important;
left: 0 !important;
}
#slider-box .bx-viewport img {
width: 100%;
height: auto;
}
#slider-box .bx-wrapper .bx-pager.bx-default-pager a {
border-radius: 0;
height: 5px;
width: 50px;
background: #bbb;
}
#slider-box .bx-wrapper .bx-pager.bx-default-pager a:hover, #slider-box .bx-wrapper .bx-pager.bx-default-pager a.active, #slider-box .bx-wrapper .bx-pager.bx-default-pager a:focus {
background: #005abe;
}
@media screen and (max-width: 767px) {
#recruit-slider-box .bx-wrapper {
margin-bottom: 30px;
}
}
#recruit-slider {
width: 100%;
}
.slider-catch-inner {
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
text-align: center;
color: #fff;
}
@media screen and (max-width: 767px) {
.slider-catch-inner {
width: 80%;
}
}
.slider-catch-inner .active {
background: #fff;
color: #005abe;
}
.catch-text {
font-size: 32px;
}
@media screen and (max-width: 1200px) {
.catch-text {
font-size: 26px;
}
}
@media screen and (max-width: 1079px) {
.catch-text {
font-size: 22px;
}
}
@media screen and (max-width: 767px) {
.catch-text {
font-size: 18px;
}
}
@media screen and (max-width: 575px) {
.catch-text {
font-size: 16px;
}
}
.catch-inner-color p {
color: #333;
}
.catch-button {
border: solid 2px #005abe;
background: #005abe;
border-radius: 50px;
margin-top: 40px;
padding: 10px 30px;
font-size: 18px;
display: inline-block;
position: relative;
text-indent: 0.4em;
transition: 0.3s;
}
@media screen and (max-width: 1079px) {
.catch-button {
padding: 7px 15px;
font-size: 14px;
}
}
@media screen and (max-width: 575px) {
.catch-button {
padding: 4px 15px;
font-size: 12px;
}
}
.catch-button:before {
font-family: Fontawesome;
content: "\f054";
left: 1em;
position: absolute;
top: 50%;
margin-top: -6px;
font-size: 60%;
}
@media screen and (max-width: 575px) {
.catch-button:before {
margin-top: -4px;
}
}
@media screen and (max-width: 1079px) {
footer,
#banner-box {
width: 96%;
margin-right: 2%;
margin-left: 2%;
}
}
#index-message {
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/img/bg-top-contact.png) no-repeat right bottom, url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/img/bg-top-contact2.png) no-repeat left bottom;
}
@media screen and (max-width: 991px) {
#index-message {
background-size: 40%;
}
}
#index-message .page-title {
margin-top: 0;
}
#index-message-inner {
margin-bottom: 60px;
}
@media screen and (max-width: 1079px) {
#index-message-inner,
#index-recruit-inner,
#index-contact-inner {
padding-right: 5%;
padding-left: 5%;
}
}
#index-message-inner p,
#index-recruit-inner p,
#index-contact-inner p {
margin: 20px 0;
}
@media screen and (max-width: 767px) {
#index-message-inner p,
#index-recruit-inner p,
#index-contact-inner p {
font-size: 13px;
}
}
#index-news,
#archive-news,
#single-news {
background: #f7f7fb;
}
#index-news #news-list,
#archive-news #news-list,
#single-news #news-list {
background: #fff;
padding: 20px;
margin: 20px auto 40px;
box-sizing: border-box;
}
@media screen and (min-width: 1080px) {
#index-news #news-list,
#archive-news #news-list,
#single-news #news-list {
max-width: 900px;
}
}
@media screen and (max-width: 1079px) {
#index-news #news-list,
#archive-news #news-list,
#single-news #news-list {
padding: 10px;
width: 94%;
margin: 20px 3% 40px;
}
}
#index-news #news-list li,
#archive-news #news-list li,
#single-news #news-list li {
clear: both;
box-sizing: border-box;
border-bottom: solid 1px #ddd;
text-align: left;
}
#index-news #news-list li:last-child,
#archive-news #news-list li:last-child,
#single-news #news-list li:last-child {
border: none;
}
#index-news #news-list li p,
#archive-news #news-list li p,
#single-news #news-list li p {
margin: 10px;
box-sizing: border-box;
}
@media screen and (min-width: 992px) {
#index-news #news-list li p,
#archive-news #news-list li p,
#single-news #news-list li p {
float: left;
}
#index-news #news-list li p:first-child,
#archive-news #news-list li p:first-child,
#single-news #news-list li p:first-child {
width: 80px;
}
#index-news #news-list li p:last-child,
#archive-news #news-list li p:last-child,
#single-news #news-list li p:last-child {
min-width: 740px;
}
}
@media screen and (max-width: 991px) {
#index-news #news-list li p,
#archive-news #news-list li p,
#single-news #news-list li p {
font-size: 14px;
}
}
@media screen and (max-width: 767px) {
#index-news #news-list li p,
#archive-news #news-list li p,
#single-news #news-list li p {
font-size: 12px;
}
}
@media screen and (max-width: 991px) {
#index-news #news-list li p .list-date,
#archive-news #news-list li p .list-date,
#single-news #news-list li p .list-date {
padding: 3px 5px;
display: inline-block;
}
}
#index-news #news-list li p .list-cat,
#archive-news #news-list li p .list-cat,
#single-news #news-list li p .list-cat {
transition: 0.3s;
background: #005abe;
color: #fff;
font-size: 10px;
padding: 3px 5px;
margin-right: 15px;
width: 50px;
text-align: center;
border: solid 1px #005abe;
display: inline-block;
}
@media screen and (min-width: 992px) {
#index-news #news-list li p .list-cat,
#archive-news #news-list li p .list-cat,
#single-news #news-list li p .list-cat {
float: left;
}
}
@media screen and (max-width: 991px) {
#index-news #news-list li p .list-cat,
#archive-news #news-list li p .list-cat,
#single-news #news-list li p .list-cat {
margin: 1px 0 0 10px;
vertical-align: top;
}
}
#index-news #news-list li p .news-list-title,
#archive-news #news-list li p .news-list-title,
#single-news #news-list li p .news-list-title {
display: inline-block;
}
@media screen and (min-width: 992px) {
#index-news #news-list li p .news-list-title,
#archive-news #news-list li p .news-list-title,
#single-news #news-list li p .news-list-title {
width: 663px;
}
}
#index-news #news-list li a,
#archive-news #news-list li a,
#single-news #news-list li a {
transition: 0.3s;
text-decoration: none;
color: #333;
}
#index-news #news-list li a:hover,
#archive-news #news-list li a:hover,
#single-news #news-list li a:hover {
color: #005abe;
}
#index-news #news-list li a:hover span,
#archive-news #news-list li a:hover span,
#single-news #news-list li a:hover span {
color: #005abe;
background: #fff;
}
section {
position: relative;
padding-bottom: 100px;
}
.home section {
padding: 80px 0 40px;
text-align: center;
}
@media screen and (max-width: 575px) {
.home section {
padding: 40px 0;
}
}
#index-google-map,
#access-map {
width: 100%;
}
#index-google-map iframe,
#access-map iframe {
width: 100%;
vertical-align: bottom;
}
@media screen and (max-width: 575px) {
#index-google-map iframe,
#access-map iframe {
height: 400px;
}
}
#access-map {
margin: 0;
padding-bottom: 0;
}
#recruit-guidelines {
min-height: 0;
}
#index-hot-link li {
position: relative;
text-align: center;
}
@media screen and (min-width: 768px) {
#index-hot-link li {
width: 33.33%;
float: left;
}
}
#index-hot-link li p {
transition: 0.3s;
display: inline-block;
}
@media screen and (max-width: 1079px) {
#index-hot-link li p {
font-size: 13px;
}
}
@media screen and (max-width: 991px) {
#index-hot-link li p {
font-size: 12px;
}
}
#index-hot-link li:hover p {
border-bottom: solid 1px #fff;
}
#index-hot-link h4 {
font-size: 28px;
margin: 0 0 10px;
}
@media screen and (max-width: 1079px) {
#index-hot-link h4 {
font-size: 24px;
}
}
@media screen and (max-width: 991px) {
#index-hot-link h4 {
font-size: 18px;
margin: 0 0 5px;
}
}
@media screen and (max-width: 767px) {
#index-hot-link h4 {
font-size: 24px;
}
}
#index-hot-link h4 i {
font-size: 24px;
}
#index-hot-link h5 {
font-size: 14px;
margin-bottom: 10px;
}
@media screen and (max-width: 991px) {
#index-hot-link h5 {
font-size: 12px;
margin-bottom: 5px;
}
}
#index-hot-link a {
color: #fff;
opacity: 1;
display: block;
}
@media screen and (max-width: 767px) {
#index-hot-link a {
height: 320px;
}
}
@media screen and (max-width: 575px) {
#index-hot-link a {
height: auto;
}
}
#index-hot-link img {
vertical-align: middle;
margin: 0;
padding: 0;
}
@media screen and (max-width: 767px) {
#index-hot-link img {
margin: -65px;
}
}
@media screen and (max-width: 575px) {
#index-hot-link img {
margin: 0;
}
}
#index-hot-link .hot-link-inner {
z-index: 10;
width: 80%;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
}
.news-time {
text-align: right;
margin: 0 0 10px;
}
.news-time:before {
content: "\f017";
font-family: Fontawesome;
margin-right: 5px;
color: #005abe;
}
#news-wrapper {
padding-top: 30px;
}
.news-title {
margin: 10px 0;
font-size: 18px;
font-weight: bold;
position: relative;
padding-bottom: 0.5em;
border-bottom: 2px solid #ddd;
}
.news-title::after {
position: absolute;
bottom: -2px;
left: 0;
z-index: 2;
content: "";
width: 20%;
height: 2px;
background-color: #005abe;
} .alignleft {
float: left;
margin: 0 20px 20px 0;
}
.alignright {
float: right;
margin: 0 0 20px 20px;
}
.wp-caption {
max-width: 100%;
}
.pagination-box {
clear: both;
margin: 20px 0;
}
#pagination {
color: #333;
padding: 20px 0;
text-align: center;
}
#pagination a {
color: #333;
}
#pagination a:hover {
border: 1px solid #005abe;
}
#pagination .current {
background: #005abe;
color: #fff;
}
#pagination a,
.page-numbers {
background: #fff none repeat scroll 0 0;
padding: 5px 10px;
text-decoration: none;
border: 1px solid #ddd;
}
#single-pagination {
background: #fff none repeat scroll 0 0;
margin-top: 20px;
}
.navi-pre-next {
margin: 40px auto;
max-width: 900px;
}
.navi-pre-next .prev,
.navi-pre-next .next {
width: 48%;
float: left;
background: #fff;
padding: 10px;
box-sizing: border-box;
}
.navi-pre-next .prev {
text-align: right;
margin-left: 4%;
}
.navi-pre-next a {
text-decoration: none;
color: #333;
}
.navi-pre-next a:hover {
text-decoration: underline;
color: #333;
}
.gallery-item {
margin-right: 2px;
}
.gallery-item img {
border: none !important;
} .gallery {
overflow: hidden;
margin: 40px 0;
}
.gallery-item {
float: left;
margin-top: 0;
margin-bottom: 20px;
margin-left: 0;
}
.gallery-item img {
border: 2px solid #fff !important;
max-height: 133px;
width: auto;
}
.gallery-columns-1 .gallery-item {
width: 100%;
margin-right: 0;
}
.gallery-columns-2 .gallery-item {
width: 49%;
margin-right: 1%;
}
.gallery-columns-3 .gallery-item {
width: 32%;
margin-right: 1%;
}
.gallery-columns-4 .gallery-item {
width: 24%;
margin-right: 1%;
}
.gallery-icon {
text-align: center;
}
.gallery-caption {
text-align: center;
font-size: 14px;
} .wpcf7 p {
margin: 20px 0;
line-height: 22px;
}
.wpcf7 textarea {
width: 100%;
}
.wpcf7 textarea,
.wpcf7 input[type=text],
.wpcf7 input[type=email],
.wpcf7 input[type=tel],
.wpcf7 select {
border-radius: 0;
max-width: 100%;
padding: 10px 5px;
box-sizing: border-box;
}
.wpcf7 textarea _::-webkit-full-page-media,
.wpcf7 textarea _:future,
.wpcf7 textarea :root .css_selector,
.wpcf7 input[type=text] _::-webkit-full-page-media,
.wpcf7 input[type=text] _:future,
.wpcf7 input[type=text] :root .css_selector,
.wpcf7 input[type=email] _::-webkit-full-page-media,
.wpcf7 input[type=email] _:future,
.wpcf7 input[type=email] :root .css_selector,
.wpcf7 input[type=tel] _::-webkit-full-page-media,
.wpcf7 input[type=tel] _:future,
.wpcf7 input[type=tel] :root .css_selector,
.wpcf7 select _::-webkit-full-page-media,
.wpcf7 select _:future,
.wpcf7 select :root .css_selector {
-webkit-appearance: none;
}
.wpcf7 input[type=submit],
.wpcf7 .wpcf7c-btn-back {
background: #005abe none repeat scroll 0 0;
border: solid 1px #005abe;
color: #fff;
font-size: 16px;
font-weight: normal;
padding: 10px 30px;
text-align: center;
letter-spacing: 1em;
text-indent: 1em;
}
.page-contact-en .wpcf7 input[type=submit],
.page-contact-en .wpcf7 .wpcf7c-btn-back {
letter-spacing: 0;
text-indent: 0;
}
.wpcf7 input[type=submit]:hover,
.wpcf7 .wpcf7c-btn-back:hover {
background: #fff none repeat scroll 0 0;
color: #005abe;
cursor: pointer;
}
.wpcf7 .wpcf7c-btn-back {
margin-right: 20px;
}
.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select {
background: #ffffff none repeat scroll 0 0;
border: 1px solid #d8d8d8;
box-shadow: 0 1px 1px 0 rgba(180, 180, 180, 0.1);
font-size: 12px;
margin: 5px 0;
padding: 10px;
}
.wpcf7c-conf {
background: none !important;
border: none !important;
box-shadow: none !important;
font-weight: bold;
}
.wpcf7-submit {
-webkit-appearance: none;
border-radius: 0;
padding: 10px 40px;
background: #005abe;
color: #fff;
font-weight: bold;
border: none;
}
.button-submit {
text-align: center;
}
.wpcf7-form .button-submit input[type=submit],
.wpcf7-form .button-submit input[type=submit]:hover {
border-radius: 5px;
border: solid 2px #005abe;
font-size: 14px;
letter-spacing: 1em;
padding-left: 2em;
} .text-l {
font-size: 26px;
line-height: 1.6;
}
@media screen and (max-width: 767px) {
.text-l {
font-size: 20px;
line-height: 1.4;
}
}
.page-title {
font-weight: normal;
text-align: center;
font-size: 40px;
line-height: 42px;
margin: 50px 0;
color: #444;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif;
}
.page-title span {
display: block;
font-size: 20px;
}
@media screen and (max-width: 991px) {
.page-title {
font-size: 32px;
line-height: 36px;
margin: 30px 0;
}
.page-title span {
font-size: 14px;
}
}
@media screen and (max-width: 767px) {
.page-title {
font-size: 28px;
line-height: 32px;
margin: 30px 0;
}
.page-title span {
font-size: 14px;
}
}
@media screen and (max-width: 575px) {
.page-title {
font-size: 22px;
line-height: 24px;
margin: 30px 0;
}
.page-title span {
font-size: 12px;
}
}
.font-en {
font-family: "Josefin Sans", sans-serif;
}
.normal-ol {
margin: 30px 0 30px 1em;
list-style: decimal-leading-zero inside;
}
.normal-ol li {
display: table-row;
counter-increment: table-ol;
text-indent: -1em;
margin-left: 1em;
line-height: 2;
}
@media screen and (max-width: 767px) {
.normal-ol li {
font-size: 14px;
line-height: 1.4;
}
}
.normal-ol li:before {
content: counter(table-ol) ".";
color: #005abe;
margin-right: 0.3em;
line-height: 2;
margin-bottom: 0.4em;
text-indent: 0;
font-size: 20px;
}
@media screen and (max-width: 767px) {
.normal-ol li:before {
font-size: 14px;
line-height: 1.4;
}
}
.normal-ul {
margin: 25px 0;
padding-left: 1em;
}
.normal-ul li {
position: relative;
padding-left: 0.2em;
line-height: 1.1em;
margin: 10px 0;
}
.normal-ul li::before {
color: #005abe;
font-family: FontAwesome;
content: "\f105";
margin-right: 5px;
position: absolute;
left: -1em;
top: 0;
}
.form-normal {
max-width: 800px;
margin: 50px auto;
background: #f7f7fb;
padding: 30px;
box-sizing: border-box;
}
.form-normal tr {
border-bottom: solid 1px #ddd;
}
.form-normal th,
.form-normal td {
padding: 10px 0;
}
.form-normal th {
text-align: left;
vertical-align: middle;
}
@media screen and (max-width: 767px) {
.form-normal {
font-size: 14px;
}
}
@media screen and (max-width: 575px) {
.form-normal th,
.form-normal td {
display: block;
width: 100%;
border: none;
padding: 10px;
box-sizing: border-box;
}
.form-normal th {
background: #005abe;
color: #fff;
}
.form-normal td {
border: 1px solid #ddd;
border-bottom: none;
}
.form-normal td,
.form-normal td:first-of-type {
border-top: none;
}
.form-normal textarea,
.form-normal input[type=text],
.form-normal input[type=email],
.form-normal input[type=tel] {
width: 100%;
}
}
.table-normal {
max-width: 1000px;
word-break: break-all;
word-wrap: break-all;
margin: 50px 0;
}
.table-normal th,
.table-normal td {
border-bottom: 1px solid #ddd;
padding: 15px 20px;
vertical-align: middle;
font-size: 14px;
box-sizing: border-box;
}
.table-normal th:first-of-type,
.table-normal td:first-of-type {
border-top: 1px solid #ddd;
}
.table-normal th {
font-weight: bold;
text-align: left;
width: 20%;
}
@media screen and (max-width: 767px) {
.table-normal th {
width: 25%;
}
}
@media screen and (max-width: 575px) {
.table-normal th,
.table-normal td {
display: block;
width: 100%;
border: none;
}
.table-normal th {
background: #005abe;
color: #fff;
}
.table-normal td {
border: 1px solid #ddd;
}
.table-normal td,
.table-normal td:first-of-type {
border-top: none;
}
}
.table-stripes .even-row {
background: #f7f7fb;
}
.link-button,
.link-button-2 {
text-align: center;
}
.link-button a,
.link-button-2 a {
font-size: 14px;
color: #fff;
background: #005abe;
border: solid 1px #005abe;
padding: 15px 50px;
text-decoration: none;
display: inline-block;
margin: 40px 0;
letter-spacing: 0.2em;
transition: 0.3s;
position: relative;
}
@media screen and (max-width: 575px) {
.link-button a,
.link-button-2 a {
font-size: 13px;
padding: 15px 30px;
}
}
.link-button a:hover,
.link-button-2 a:hover {
color: #005abe;
background: #fff;
}
.link-button a:before,
.link-button-2 a:before {
font-family: Fontawesome;
content: "\f054";
font-size: 90%;
margin-right: 5px;
}
.link-button-2 a {
position: inline-block;
}
.link-button-2 a:first-child {
margin-right: 20px;
}
@media screen and (max-width: 575px) {
.link-button-2 a {
margin: 40px 0 0;
}
}
.phone {
margin: 20px 0;
color: #005abe;
font-size: 40px;
font-family: "Oswald", sans-serif;
}
#index-contact .phone, .page-contact .phone {
font-size: 50px;
margin: 0;
}
@media screen and (max-width: 575px) {
#index-contact .phone, .page-contact .phone {
font-size: 34px;
}
}
.phone-box {
border: solid 4px #f7f7fb;
padding: 20px 30px;
box-sizing: border-box;
margin: 50px auto;
max-width: 800px;
}
.phone-box h4 {
margin: 20px auto;
}
.phone-box p {
text-align: center;
}
@media screen and (min-width: 576px) {
.scale {
overflow: hidden;
text-align: center;
}
.scale img {
max-width: 102%;
width: 102%; backface-visibility: hidden; overflow: hidden;
transition: transform 0.2s ease-in;
}
.scale:hover img {
transform: scale(1.1);
}
}
.wide-table-box {
overflow-x: scroll;
}
.wide-table-box th,
.wide-table-box td {
min-width: 60px;
white-space: nowrap;
}
.wide-table-box::-webkit-scrollbar {
width: 5px;
height: 5px;
background: #bbb;
}
.wide-table-box::-webkit-scrollbar:horizontal {
width: 5px;
background: #bbb;
}
.wide-table-box::-webkit-scrollbar-thumb {
background: #555;
border-radius: 2px;
}
.wide-table-box::-webkit-scrollbar-thumb:horizontal {
background: #555;
border-radius: 2px;
}
.wide-table-box::-webkit-scrollbar-track-piece:start {
background: #bbb;
}
.wide-table-box::-webkit-scrollbar-track-piece:end {
background: #bbb;
}
.wide-table-box::-webkit-scrollbar-corner {
background: transparent;
}
.img-circle {
border-radius: 1000px;
}
#cotton-list {
margin-top: 40px;
border-top: 1px solid #ddd;
border-left: 1px solid #ddd;
}
#cotton-list li {
float: left;
box-sizing: border-box;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
position: relative;
width: 20%;
}
#cotton-list li:last-child {
border: none;
}
#cotton-list li:last-child p {
position: absolute;
top: 50%;
left: 50%;
text-align: center;
transform: translateY(-50%) translateX(-50%);
margin: 0;
padding: 0;
font-weight: bold;
font-size: 14px;
}
@media screen and (max-width: 991px) {
#cotton-list li {
width: 25%;
}
}
@media screen and (max-width: 767px) {
#cotton-list li {
width: 33.333%;
}
}
@media screen and (max-width: 575px) {
#cotton-list li {
width: 50%;
}
}
#cotton-list .cotton-list-inner {
position: absolute;
margin: 0;
top: 12px;
left: 12px;
right: 12px;
z-index: 100;
text-align: left;
}
#cotton-list .cotton-list-inner h5 {
font-weight: normal;
font-size: 12px;
text-align: left;
margin: 0;
}
#cotton-list .cotton-list-inner h5 span {
display: block;
font-size: 16px;
font-family: "Josefin Sans", sans-serif;
}
#cotton-list .cotton-list-inner p.cottom-attention {
top: 20px;
background: #44546a;
color: #fff;
margin: 5px 0;
padding: 2px 5px;
display: inline;
}
#cotton-list p {
padding: 10px;
font-size: 12px;
text-align: left;
line-height: 1.4;
}
#cotton-list p.cotton-name {
margin: 0;
padding: 0;
}
#cotton-list img {
vertical-align: top;
}
.half-box {
margin: 50px 0;
background: #f7f7fb;
}
@media screen and (min-width: 768px) {
.half-box .half-img {
float: right;
width: 50%;
}
}
@media screen and (max-width: 767px) {
.half-box .half-img {
text-align: center;
}
}
.half-box .half-img img {
vertical-align: bottom;
}
.half-box .half-text {
padding: 20px 30px;
word-break: break-all;
box-sizing: border-box;
}
@media screen and (max-width: 991px) {
.half-box .half-text {
padding: 10px 20px;
}
}
@media screen and (min-width: 768px) {
.half-box .half-text {
width: 50%;
}
}
@media screen and (max-width: 1079px) {
.half-box .half-text h5 {
marginm: 10px 0;
}
.half-box .half-text p {
line-height: 1.6;
font-size: 14px;
margin: 20px 0;
}
}
@media screen and (min-width: 768px) {
.opposite .half-img {
float: left;
}
.opposite .half-text {
float: right;
}
}
.half-img a,
.box-3col a,
.box-2col a {
display: block;
position: relative;
}
.half-img a:before,
.box-3col a:before,
.box-2col a:before {
font-family: Fontawesome;
content: "\f055";
position: absolute;
font-size: 25px;
left: 10px;
top: 5px;
transition: 0.3s;
color: #ddd;
}
.half-img a:hover:before,
.box-3col a:hover:before,
.box-2col a:hover:before {
color: #005abe;
}
.box-2col,
.box-2col-w,
.box-3col,
.box-4col {
margin: 40px 0;
}
@media screen and (max-width: 575px) {
.box-2col,
.box-2col-w,
.box-3col,
.box-4col {
margin: 0;
}
}
.box-2col.gray li,
.box-2col-w.gray li,
.box-3col.gray li,
.box-4col.gray li {
border: solid 1px #ddd;
background: #f7f7fb;
}
.box-2col.gray li p,
.box-2col-w.gray li p,
.box-3col.gray li p,
.box-4col.gray li p {
margin-left: 5%;
margin-right: 5%;
}
.box-2col p,
.box-2col-w p,
.box-3col p,
.box-4col p {
line-height: 1.4;
}
.box-2col li,
.box-2col-w li,
.box-3col li,
.box-4col li {
box-sizing: border-box;
width: 32%;
margin: 0 2% 50px 0;
float: left;
}
.box-2col li:nth-child(3n),
.box-2col-w li:nth-child(3n),
.box-3col li:nth-child(3n),
.box-4col li:nth-child(3n) {
margin-right: 0;
}
@media screen and (max-width: 575px) {
.box-2col li,
.box-2col-w li,
.box-3col li,
.box-4col li {
float: none;
width: 100%;
margin: 20px 0;
background: #f7f7fb;
padding: 3%;
}
.box-2col li img,
.box-2col-w li img,
.box-3col li img,
.box-4col li img {
border-color: #f7f7fb;
}
}
.box-2col li a,
.box-2col-w li a,
.box-3col li a,
.box-4col li a {
display: block;
}
.box-2col li a:hover img,
.box-2col-w li a:hover img,
.box-3col li a:hover img,
.box-4col li a:hover img {
border: 2px solid #005abe;
}
.box-2col img,
.box-2col-w img,
.box-3col img,
.box-4col img {
width: 100%;
transition: 0.3s;
border: 2px solid #fff;
box-sizing: border-box;
}
.box-2col h5,
.box-2col-w h5,
.box-3col h5,
.box-4col h5 {
font-size: 18px;
margin: 30px 0;
text-align: center;
}
@media screen and (max-width: 767px) {
.box-2col h5,
.box-2col-w h5,
.box-3col h5,
.box-4col h5 {
font-size: 15px;
}
}
@media screen and (max-width: 575px) {
.box-2col h5,
.box-2col-w h5,
.box-3col h5,
.box-4col h5 {
font-size: 18px;
}
}
.box-2col .text-center,
.box-2col-w .text-center,
.box-3col .text-center,
.box-4col .text-center {
text-align: center;
}
.box-2col .font-en,
.box-2col-w .font-en,
.box-3col .font-en,
.box-4col .font-en {
text-align: center;
color: #005abe;
display: block;
font-size: 14px;
margin-top: -20px;
}
@media screen and (max-width: 767px) {
.box-2col .font-en,
.box-2col-w .font-en,
.box-3col .font-en,
.box-4col .font-en {
font-size: 13px;
}
}
@media screen and (max-width: 575px) {
.box-2col .font-en,
.box-2col-w .font-en,
.box-3col .font-en,
.box-4col .font-en {
font-size: 12px;
}
}
.box-2col,
.box-2col-w {
margin: 40px auto;
}
.box-2col li,
.box-2col-w li {
width: 49%;
}
.box-2col li:nth-child(3n),
.box-2col-w li:nth-child(3n) {
margin-right: 2%;
}
.box-2col li:nth-child(2n),
.box-2col-w li:nth-child(2n) {
margin-right: 0;
}
@media screen and (max-width: 575px) {
.box-2col li,
.box-2col-w li {
float: none;
width: 100%;
margin: 20px 0;
background: #f7f7fb;
padding: 3%;
}
.box-2col li img,
.box-2col-w li img {
border-color: #f7f7fb;
}
}
.box-2col {
max-width: 700px;
}
.box-4col li {
width: 23.5%;
}
.box-4col li:nth-child(3n) {
margin-right: 2%;
}
.box-4col li:nth-child(4n) {
margin-right: 0;
}
@media screen and (max-width: 767px) {
.box-4col li {
width: 49%;
}
.box-4col li:nth-child(2n) {
margin-right: 0;
}
}
@media screen and (max-width: 575px) {
.box-4col li {
float: none;
width: 100%;
margin: 20px 0;
background: #f7f7fb;
padding: 3%;
}
.box-4col li img {
border-color: #f7f7fb;
}
}
@media screen and (max-width: 575px) {
.box-4col li {
float: left;
width: 49%;
margin: 20px 0;
background: #f7f7fb;
padding: 3%;
margin-right: 2%;
}
.box-4col li:nth-child(2n) {
margin-right: 0;
}
.box-4col li h5 {
font-size: 13px;
}
.box-4col li .font-en {
font-size: 10px;
}
.box-4col li img {
border-color: #f7f7fb;
}
.box-4col li p {
font-size: 12px;
}
}
#catch-box h2,
#catch-box p,
#no-catch-box h2,
#no-catch-box p {
text-align: left;
margin: 0 auto;
}
@media screen and (min-width: 1201px) {
#catch-box h2,
#catch-box p,
#no-catch-box h2,
#no-catch-box p {
width: 1080px;
}
}
#catch-box h2,
#no-catch-box h2 {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif;
}
#catch-box h2.white,
#no-catch-box h2.white {
color: #fff;
}
#catch-box p,
#no-catch-box p {
margin: 10px auto 0;
color: #005abe;
}
#catch-box p.white,
#no-catch-box p.white {
color: #fff;
}
#catch-box {
height: 500px;
background-size: cover;
background-position: top center;
background-repeat: no-repeat;
position: relative;
}
#catch-box #catch-box-inner {
width: 100%;
position: absolute;
top: 50%;
transform: translateY(-50%) translateX(0);
-webkit-transform: translateY(-50%) translateX(0);
}
@media screen and (max-width: 1200px) {
#catch-box {
height: 400px;
}
#catch-box #catch-box-inner {
width: 80%;
left: 10%;
}
}
@media screen and (max-width: 1079px) {
#catch-box {
height: 350px;
}
}
@media screen and (max-width: 991px) {
#catch-box {
height: 270px;
}
}
@media screen and (max-width: 767px) {
#catch-box {
height: 170px;
}
}
.tax-news-cat #catch-box, .post-type-archive-news #catch-box, .single-news #catch-box {
background-image: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/img/news-catch.jpg);
}
#no-catch-box {
margin: 250px 0 80px;
}
@media screen and (max-width: 991px) {
#no-catch-box {
margin: 200px 0 50px;
}
}
@media screen and (max-width: 991px) {
#no-catch-box {
margin: 150px 0 0;
}
}
#no-catch-box h2,
#no-catch-box p {
text-align: center;
}
.submenu {
text-align: center;
box-sizing: border-box;
margin: 0 auto;
background: rgba(0, 90, 190, 0.85);
top: -62px;
left: 0;
right: 0;
z-index: 2;
}
@media screen and (min-width: 992px) {
.submenu {
position: absolute;
}
}
@media screen and (max-width: 991px) {
.submenu {
top: -1px;
}
}
.submenu ul {
text-align: center;
}
@media screen and (max-width: 767px) {
.submenu ul {
width: 99%;
}
}
.submenu ul li {
display: inline-block;
border-right: solid 1px #fff;
transform: skewX(160deg);
margin: 15px 0;
}
.submenu ul li:last-child {
border-right: none;
}
.submenu ul li a {
transform: skewX(-160deg);
display: block;
text-decoration: none;
padding: 5px 20px;
color: #fff;
}
@media screen and (max-width: 991px) {
.submenu ul li {
font-size: 14px;
}
.submenu ul li a {
padding: 7px 12px;
}
}
@media screen and (max-width: 767px) {
.submenu ul li {
font-size: 13px;
margin: 10px 0;
}
}
@media screen and (max-width: 575px) {
.submenu ul li {
font-size: 12px;
}
.submenu ul li a {
padding: 5px;
}
}
.submenu ul li span {
position: relative;
display: block;
}
.submenu ul li span::before {
content: "";
display: inline-block;
width: 0;
height: 4px;
background: #fff;
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
transition: width 0.2s;
}
@media screen and (max-width: 767px) {
.submenu ul li span::before {
bottom: -10px;
}
}
.submenu ul li span:not(.ios):hover::before {
width: 100%;
}
.subtitle-en {
font-family: "Josefin Sans", sans-serif;
display: block;
font-size: 16px;
color: #005abe;
}
p.subtitle-en {
text-align: center;
font-size: 20px;
margin-top: -70px;
margin-bottom: 100px;
}
.home p.subtitle-en {
text-align: center;
margin-top: -20px;
margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
p.subtitle-en {
margin: -30px 0 70px;
font-size: 12px;
}
}
.patent {
text-align: center;
width: 100%;
border: solid 1px #ddd;
padding: 5px 0;
font-family: "Josefin Sans", sans-serif;
background: #fff;
margin: 15px 0;
}
.ul-cosmetics {
margin: 40px 0;
}
.ul-cosmetics li {
width: 25%;
float: left;
padding: 0 2%;
margin-bottom: 20px;
box-sizing: border-box;
text-align: center;
}
@media screen and (max-width: 767px) {
.ul-cosmetics li {
width: 33.333%;
}
}
@media screen and (max-width: 575px) {
.ul-cosmetics li {
width: 50%;
}
}
.ul-cosmetics li img {
border: 1px solid #ddd;
transition: 0.3s;
}
.ul-cosmetics li a {
text-decoration: none;
transition: 0.3s;
display: block;
}
.ul-cosmetics li a:hover {
opacity: 0.7;
}
.ul-cosmetics li a:hover p {
color: #005abe;
}
.ul-cosmetics li a:hover img {
border: 1px solid #aaa;
}
.ul-cosmetics li a p {
color: #333;
padding-left: 1em;
text-indent: -1em;
}
@media screen and (max-width: 1079px) {
.ul-cosmetics li a p {
text-align: left;
line-height: 1.2;
}
}
.ul-cosmetics li a p:before {
font-family: Fontawesome;
content: "\f054";
font-size: 80%;
margin-right: 5px;
color: #005abe;
}
.bg-gray {
background: #f7f7fb;
}
.bg-gray article {
background: none;
margin-bottom: 0;
}
.border-box {
border: solid 1px #ddd;
box-sizing: border-box;
padding-bottom: 20px;
background: #fff;
margin: 100px 0;
}
.border-box h5 {
margin: 0 0 50px;
padding: 20px 0;
color: #fff;
background: #005abe;
}
.border-box img {
width: 90%;
}
.border-box .border-box-text {
margin: 0 auto;
padding: 0 30px;
}
.recruit-title {
margin: 80px auto;
text-align: center;
font-size: 46px;
}
@media screen and (max-width: 767px) {
.recruit-title {
margin: 0 auto 40px;
font-size: 36px;
}
}
@media screen and (max-width: 575px) {
.recruit-title {
font-size: 28px;
}
}
.recruit-subtitle {
font-size: 30px;
padding: 150px 0 20px;
text-align: center;
margin: 0 auto 60px;
border-bottom: solid 1px #333;
}
@media screen and (min-width: 1080px) {
.recruit-subtitle {
max-width: 1080px;
}
}
@media screen and (max-width: 767px) {
.recruit-subtitle {
font-size: 24px;
padding: 60px 0 20px;
}
}
.recruit-cat-ul {
text-align: center;
margin-bottom: 100px;
}
.recruit-cat-ul li {
display: inline-block;
}
@media screen and (max-width: 767px) {
.recruit-cat-ul li {
font-size: 14px;
}
}
@media screen and (max-width: 575px) {
.recruit-cat-ul li {
font-size: 12px;
}
}
.recruit-cat-ul li a {
color: #333;
text-decoration: none;
padding: 10px;
border-right: 1px solid #ddd;
display: block;
}
.recruit-cat-ul li a:hover {
color: #005abe;
}
@media screen and (max-width: 575px) {
.recruit-cat-ul li a {
color: #fff;
background: #005abe;
border: solid 1px #005abe;
padding: 5px 10px;
margin: 0 5px 10px;
}
.recruit-cat-ul li a:hover {
background: #fff;
}
}
.recruit-cat-ul li:last-child a {
border: none;
}
.recruit-cat-box {
padding: 0 0 150px;
}
@media screen and (max-width: 767px) {
.recruit-cat-box {
padding-bottom: 50px;
}
}
.recruit-cat-box article {
padding: 30px;
}
.recruit-cat-box:nth-child(odd) {
background: #f7f7fb;
}
.recruit-cat-box:nth-child(even) article {
background: #f7f7fb;
}
.access-ul {
margin: 50px 0;
}
.access-ul li {
background: #fff;
box-sizing: border-box;
}
@media screen and (min-width: 768px) {
.access-ul li {
width: 32%;
float: left;
margin-right: 2%;
}
}
.access-ul li h4 {
margin: 0;
padding: 20px 0;
font-size: 20px;
background: #005abe;
color: #fff;
font-weight: bold;
}
.access-ul li h5 {
font-size: 16px;
font-weight: bold;
text-align: center;
}
.access-ul li:nth-child(3n) {
margin-right: 0;
}
.access-ul li div {
padding: 5%;
}
.access-ul li p {
text-align: center;
font-size: 14px;
}
.access-ul li i {
color: #ccc;
}
.particular-box {
background: #fff;
}
.particular-box:first-of-type {
margin-top: 100px;
}
.particular-box:last-of-type {
margin-bottom: 200px;
}
@media screen and (min-width: 576px) {
.particular-box {
display: flex;
justify-content: center;
}
}
@media screen and (min-width: 768px) {
.particular-box {
align-items: center;
}
}
@media screen and (max-width: 767px) {
.particular-box:first-of-type {
margin-top: 0;
}
.particular-box:last-of-type {
margin-bottom: 100px;
}
}
.particular-img,
.particular-text {
position: relative;
}
@media screen and (min-width: 576px) {
.particular-img,
.particular-text {
width: 50%;
}
}
.particular-img img,
.particular-text img {
vertical-align: bottom;
}
.particular-img a,
.particular-text a {
display: block;
}
@media screen and (max-width: 575px) {
.particular-img {
height: 340px;
overflow: hidden;
}
}
@media screen and (min-width: 576px) {
.particular-text:before {
position: absolute;
top: 50%;
left: -100px;
margin-top: -50px;
content: "";
display: inline-block;
border: 50px solid transparent;
}
.particular-text:nth-of-type(even):before {
border-right-color: #fff;
}
.particular-text:nth-of-type(odd):before {
left: auto;
right: -100px;
border-left-color: #fff;
z-index: 1;
}
}
@media screen and (max-width: 991px) {
.particular-text:before {
top: 60%;
left: -50px;
border: 25px solid transparent;
}
.particular-text:nth-of-type(odd):before {
right: -50px;
}
}
.particular-text {
padding: 30px 40px;
box-sizing: border-box;
}
.particular-text h4 {
font-size: 20px;
font-weight: bold;
margin: 0;
border-bottom: solid 1px #777;
padding-bottom: 30px;
color: #005abe;
}
@media screen and (max-width: 1079px) {
.particular-text h4 {
padding-bottom: 10px;
}
}
@media screen and (max-width: 1079px) {
.particular-text {
padding: 20px;
}
.particular-text p {
line-height: 1.6;
font-size: 14px;
}
}
@media screen and (max-width: 991px) {
.particular-text {
padding: 20px 20px 0;
}
.particular-text h4 {
font-size: 17px;
}
.particular-text p {
line-height: 1.5;
}
}
@media screen and (max-width: 767px) {
.particular-text {
padding: 20px;
}
.particular-text h4 {
font-size: 15px;
}
.particular-text p {
font-size: 13px;
}
}
.bg-blue,
.bg-blue-2 {
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/img/img-blue.jpg) no-repeat center center/cover;
margin: 100px 0 0;
}
.bg-blue article,
.bg-blue-2 article {
position: relative;
background: none;
min-height: 0;
padding: 50px 0;
margin-bottom: 0;
}
.bg-blue article h3,
.bg-blue article p,
.bg-blue-2 article h3,
.bg-blue-2 article p {
color: #fff;
}
.bg-blue article h3,
.bg-blue-2 article h3 {
margin: 30px 0;
}
.bg-blue article h3 span:before, .bg-blue article h3 span:after,
.bg-blue-2 article h3 span:before,
.bg-blue-2 article h3 span:after {
background-color: #fff;
}
.bg-blue article h4,
.bg-blue-2 article h4 {
color: #fff;
margin: 60px auto 30px;
text-align: center;
}
.bg-blue-2 {
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/img/bg-blue-2.jpg) no-repeat center center/cover;
}
.bg-logo {
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/img/bg-logo.png) no-repeat center center;
}
@media screen and (max-width: 1079px) {
.bg-logo {
background-size: 80%;
}
}
.postid-39 .half-img {
padding: 20px;
box-sizing: border-box;
}
.faq-ul {
margin: 50px 0;
}
.faq-ul li {
background: #fff;
padding: 20px 30px;
margin-bottom: 20px;
box-sizing: border-box;
}
.faq-ul li h5 {
border-bottom: solid 1px #ddd;
padding-bottom: 5px;
}
.faq-ul li h5 .font-en {
font-size: 40px;
margin-right: 5px;
color: #005abe;
}
@media screen and (max-width: 767px) {
.faq-ul li h5 .font-en {
font-size: 30px;
}
}
.faq-ul li h5 .font-en:after {
content: ". ";
}
.page-oem section,
.post-type-archive-recruit section,
.page-access section,
.page-contact section,
.page-english section,
.page-contact-en section,
.page-company section {
padding-bottom: 0;
}
.tax-news-cat section,
.post-type-archive-news section,
.single-news section {
padding-bottom: 40px;
}
.flowchart {
margin: 100px 0;
}
.flowchart h5 {
margin-top: 30px;
}
.flowchart li {
text-align: center;
padding: 20px 30px;
background: #f7f7fb;
position: relative;
margin-bottom: 50px;
text-align: center;
}
.flowchart li:after {
content: "";
position: absolute;
width: 0;
height: 0;
left: 0;
right: 0;
bottom: -45px;
margin: 10px auto;
border-style: solid;
border-color: #beddff transparent transparent transparent;
border-width: 20px 20px 0 20px;
z-index: 1;
}
.flowchart li:nth-child(2):after {
border-top-color: #8bc2ff;
}
.flowchart li:nth-child(3):after {
border-top-color: #58a7ff;
}
.flowchart li:nth-child(4):after {
border-top-color: #005abe;
}
.flowchart li:last-child:after {
content: none;
}
@media screen and (min-width: 576px) {
.box-eq2 .box-eq2-inner {
width: 48%;
float: left;
}
.box-eq2 .box-eq2-inner:first-child {
margin-right: 4%;
}
}
@media screen and (max-width: 575px) {
.box-eq2 .box-eq2-inner {
margin: 40px 5%;
}
}
.box-eq2 .box-eq2-inner h4 {
margin: 50px 0;
}
.box-eq2 .box-eq2-inner h5 {
font-weight: bold;
color: #26517F;
}
.box-eq1 {
display: flex;
justify-content: center;
}
.box-eq1 .box-eq1-inner {
width: 100%;
}
@media screen and (min-width: 768px) {
.box-eq1 .box-eq1-inner {
width: 50%;
max-width: 480px;
}
}
.box-eq1 .box-eq1-inner h4 {
margin: 50px 0;
}
.box-eq1 .box-eq1-inner h5 {
font-weight: bold;
color: #26517F;
}
@media screen and (max-width: 767px) {
#eco-lisence img {
width: 70%;
}
}
@media screen and (max-width: 575px) {
#eco-lisence img {
width: 50%;
}
}
.sitemap-ul {
margin: 20px;
}
.sitemap-ul div {
padding-bottom: 40px;
background: #f7f7fb;
border: solid 1px #ddd;
box-sizing: border-box;
}
@media screen and (min-width: 576px) {
.sitemap-ul div {
width: 32%;
float: left;
margin-right: 2%;
}
}
@media screen and (max-width: 991px) {
.sitemap-ul div {
font-size: 14px;
}
}
.sitemap-ul div:last-child {
margin-right: 0;
}
.sitemap-ul h4 {
font-size: 20px;
margin: 0 0 40px;
padding: 20px 0;
color: #fff;
background: #005abe;
}
.sitemap-ul h4 a {
color: #fff;
text-decoration: none;
}
.sitemap-ul li {
margin: 10px;
text-indent: -1em;
margin-left: 2em;
}
.sitemap-ul li:before {
font-family: Fontawesome;
content: "\f0da";
font-size: 80%;
color: #005abe;
margin-right: 5px;
}
.sitemap-ul li a {
color: #333;
text-decoration: none;
}
.sitemap-ul li a:hover {
color: #005abe;
text-decoration: underline;
}
.box-m {
max-width: 800px;
margin: 0 auto;
}
.ul-circle {
margin-bottom: 40px;
}
@media screen and (min-width: 576px) {
.ul-circle {
display: flex;
justify-content: space-around;
align-items: center;
}
}
.ul-circle li {
background: #e1efff;
color: #26517F;
border-radius: 250px;
height: 250px;
width: 250px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
font-weight: bold;
}
@media screen and (max-width: 991px) {
.ul-circle li {
height: 200px;
width: 200px;
}
}
@media screen and (max-width: 767px) {
.ul-circle li {
height: 170px;
width: 170px;
font-size: 14px;
}
}
@media screen and (max-width: 575px) {
.ul-circle li {
height: auto;
font-size: 14px;
margin: 0 auto 20px;
padding: 10px 5px;
width: 60%;
}
}
.cream-sheet-pack-box {
margin: 50px auto;
}
@media screen and (min-width: 576px) {
.cream-sheet-pack-box {
display: flex;
justify-content: space-around;
}
}
.cream-sheet-pack-box div {
max-width: 420px;
width: 50%;
margin: 0 auto;
}
@media screen and (max-width: 575px) {
.cream-sheet-pack-box div {
width: 100%;
}
}
.cream-sheet-pack-box div p {
margin: 10px;
}
.box-single {
border: #f7f7fb 3px solid;
max-width: 800px;
margin: 0 auto 150px;
padding: 0 0 20px;
text-align: center;
}
.box-single h5 {
background: #f7f7fb;
color: #26517F;
padding: 30px 0;
margin: 0;
}
.box-single p {
margin: 10px 5%;
text-align: left;
}
.cotton-workflow {
background: #f7f7fb;
padding: 20px 5%;
margin: 100px 0 0;
box-sizing: border-box;
}
.cotton-workflow h4 {
margin: 30px 0;
padding-bottom: 20px;
border-bottom: solid 2px #ccc;
}
.address-p {
font-size: 22px;
text-align: center;
}
#bg-building article {
background: none;
margin-top: -100px;
}
#bg-building article h3 {
margin: 0;
}
@media screen and (max-width: 1200px) {
#bg-building article h3 {
margin-top: 100px;
}
}
@media screen and (max-width: 575px) {
#bg-building article h3 {
margin-top: 300px;
}
}
@media screen and (max-width: 444px) {
#bg-building article h3 {
margin-top: 250px;
}
}
@media screen and (min-width: 576px) {
#bg-building article h4:first-of-type {
margin: 0 0 80px;
}
}
@media screen and (max-width: 575px) {
#bg-building article h4:first-of-type {
margin-top: 0;
}
}
#bg-building article .about-table tr:first-of-type th:first-of-type,
#bg-building article .about-table tr:first-of-type td:first-of-type {
border: none;
}
.img-sp {
display: none;
}
@media screen and (max-width: 575px) {
.img-sp {
display: inline;
}
}
@media screen and (max-width: 575px) {
.img-pc {
display: none;
}
}
@media screen and (max-width: 1079px) {
.page-english #site-title, .page-contact-en #site-title, .page-contact-finish-en #site-title, .page-chinese #site-title, .page-contact-cn #site-title, .page-contact-finish-cn #site-title {
float: left;
}
}
@media screen and (max-width: 1079px) {
.page-english #link-en, .page-contact-en #link-en, .page-contact-finish-en #link-en, .page-chinese #link-en, .page-contact-cn #link-en, .page-contact-finish-cn #link-en {
display: block;
right: 0;
width: 50px;
height: 70px;
font-size: 12px;
}
.page-english #link-en #globe, .page-contact-en #link-en #globe, .page-contact-finish-en #link-en #globe, .page-chinese #link-en #globe, .page-contact-cn #link-en #globe, .page-contact-finish-cn #link-en #globe {
width: 30px;
height: 30px;
}
.page-english #link-en span, .page-contact-en #link-en span, .page-contact-finish-en #link-en span, .page-chinese #link-en span, .page-contact-cn #link-en span, .page-contact-finish-cn #link-en span {
margin-top: 7px;
}
}
@media screen and (max-width: 575px) {
.page-english #link-en, .page-contact-en #link-en, .page-contact-finish-en #link-en, .page-chinese #link-en, .page-contact-cn #link-en, .page-contact-finish-cn #link-en {
width: 40px;
height: 50px;
font-size: 10px;
}
.page-english #link-en #globe, .page-contact-en #link-en #globe, .page-contact-finish-en #link-en #globe, .page-chinese #link-en #globe, .page-contact-cn #link-en #globe, .page-contact-finish-cn #link-en #globe {
width: 18px;
height: 18px;
}
.page-english #link-en span, .page-contact-en #link-en span, .page-contact-finish-en #link-en span, .page-chinese #link-en span, .page-contact-cn #link-en span, .page-contact-finish-cn #link-en span {
margin-top: 2px;
}
}
.oem-img {
text-align: center;
margin: 60px 0 40px;
}
#history {
max-width: 992px;
margin: 0 auto;
}
#history dl {
clear: left;
overflow: hidden;
}
#history dt,
#history dd {
float: left;
}
#history dt {
text-align: center;
background: #005abe;
color: #fff;
padding-bottom: 40px;
box-sizing: border-box;
float: left;
width: 60px;
}
#history dt .history-year {
margin: 0;
display: block;
position: relative;
}
#history dt .history-year span {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-family: "Josefin Sans", sans-serif;
}
#history dd {
width: 100%;
margin-left: -60px;
padding-left: 60px;
box-sizing: border-box;
}
@media screen and (max-width: 767px) {
#history dd {
position: relative;
}
#history dd::before {
content: "";
border-top: solid 1px #005abe;
width: 50px;
position: absolute;
left: 60px;
top: 50%;
}
}
@media screen and (max-width: 575px) {
#history dd {
padding-left: 30px;
}
#history dd::before {
width: 20px;
}
}
@media screen and (max-width: 991px) {
#history dd .history-photo p,
#history dd .history-box p {
font-size: 13px;
}
#history dd .history-photo .history-title,
#history dd .history-box .history-title {
font-size: 20px;
}
}
@media screen and (min-width: 768px) {
#history dd .history-photo,
#history dd .history-box {
float: left;
width: 48%;
box-sizing: border-box;
}
}
#history dd .history-photo {
position: relative;
}
@media screen and (min-width: 768px) {
#history dd .history-photo::before {
content: "";
border-top: solid 1px #005abe;
width: 50px;
position: absolute;
left: 0;
top: 50%;
}
}
@media screen and (min-width: 576px) {
#history dd .history-photo {
margin-right: 4%;
padding-left: 50px;
}
}
@media screen and (max-width: 767px) {
#history dd .history-photo {
padding-bottom: 10px;
}
}
@media screen and (max-width: 575px) {
#history dd .history-photo {
margin-left: 50px;
padding: 10px;
background: #f7f7fb;
}
}
@media screen and (max-width: 767px) {
#history dd .history-box {
padding-left: 50px;
}
}
@media screen and (max-width: 575px) {
#history dd .history-box {
margin-left: 50px;
padding: 0 10px 10px;
background: #f7f7fb;
}
}
#history dd p {
margin: 10px 0;
font-size: 14px;
line-height: 1.4;
}
@media screen and (max-width: 575px) {
#history dd p {
font-size: 12px;
line-height: 1.2;
margin: 5px 0;
}
}
#history dd p.history-cat {
display: inline-block;
background: #73ba93;
color: #fff;
padding: 5px 10px;
margin-top: 0;
}
@media screen and (max-width: 767px) {
#history dd p.history-cat {
font-size: 10px;
}
}
#history dd p.cat-blue {
background: #70c6dc;
}
#history dd p.cat-pink {
background: #ff91b0;
}
#history dd .history-title {
text-align: left;
margin: 10px 0;
font-size: 30px;
}
#history .dl-null dd::before {
content: none;
}
#history .triangle-top,
#history .triangle-bottom {
background: #fff;
position: relative;
}
#history .triangle-top::before,
#history .triangle-bottom::before {
position: absolute;
content: "";
top: 0;
left: 0;
border-right: 75px solid transparent;
border-bottom: 50px solid #005abe;
}
#history .triangle-bottom::before {
top: auto;
bottom: 10px;
border-bottom: none;
border-top: 30px solid #005abe;
border-right: 30px solid transparent;
border-left: 30px solid transparent;
}
.post-type-archive-recruit #catch-box-inner h2,
.post-type-archive-recruit #catch-box-inner p,
.page-history #catch-box-inner h2,
.page-history #catch-box-inner p {
text-shadow: 2px 2px 2px #000;
}
.page-company #catch-box-inner h2,
.page-company #catch-box-inner p {
text-shadow: 1px 1px 1px #fff, 1px 1px 1px #fff, 1px 1px 1px #fff;
}
#playPause {
display: none;
}
@media screen and (min-width: 576px) {
.text-center-pc {
text-align: center;
}
}
body.page-chinese {
font-family: "SimSun", "sans-serif";
}
.page-chinese #catch-box h2,
.page-chinese #no-catch-box h2,
.page-chinese .font-en,
.page-chinese .headline span {
font-family: "SimSun", "sans-serif";
}
#top-banner {
text-align: center;
}
#top-banner a {
border: solid 2px #005abe;
padding: 20px 50px;
text-decoration: none;
margin: 80px auto;
display: inline-block;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
#top-banner a {
padding: 15px 40px;
margin: 20px auto 50px;
font-size: 14px;
}
}
#top-banner a:hover {
background: #005abe;
color: #fff;
}
#company-initiatives {
padding-bottom: 80px;
}
#company-initiatives h4 {
color: #005abe;
font-weight: bold;
font-size: 24px;
}
@media screen and (min-width: 768px) {
#company-initiatives h4 {
font-size: 32px;
}
}
#company-initiatives h5 {
font-size: 20px;
font-weight: bold;
border-bottom: solid 1px #ddd;
padding-bottom: 5px;
margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
#company-initiatives h5 {
font-size: 24px;
}
}
#company-initiatives h6 {
font-weight: bold;
font-size: 16px;
margin: 20px auto;
}
@media screen and (min-width: 768px) {
#company-initiatives h6 {
font-size: 18px;
}
}
#company-initiatives ul {
margin: 20px auto 40px;
padding-left: 1em;
font-size: 14px;
}
@media screen and (min-width: 768px) {
#company-initiatives ul {
font-size: 16px;
}
}
#company-initiatives ul li {
list-style: disc;
}
article h4 span.h4-s {
margin-top: 20px;
font-size: 60%;
display: block;
color: #005abe;
}
p.mask-notice {
font-size: 12px;
color: #fff;
background: #555;
margin: 0 auto 10px;
text-align: center;
padding: 2px;
width: 70px;
}
h5.cream-sheets-pack-heading-center {
font-weight: bold;
color: #005abe;
text-align: center;
font-size: 20px;
margin-top: 100px;
}
@media screen and (min-width: 768px) {
h5.cream-sheets-pack-heading-center {
font-size: 26px;
}
}
h5.cream-sheets-pack-heading-center span {
display: block;
margin-top: 10px;
font-size: 70%;
color: #666;
}
@media screen and (min-width: 768px) {
.cream-sheet-pack-box div {
max-width: 47%;
}
}
.cream-sheet-pack-box div p.p-image {
margin: 0;
}
.heading-blue {
color: #005abe;
font-weight: bold;
}
.cream-sheets-pack-text-box {
border: solid 1px #ddd;
padding: 40px;
margin: 100px auto;
}
.cream-sheets-pack-text-box h6 {
text-align: center;
font-weight: bold;
font-size: 20px;
}
.cream-sheets-pack-text-box h6 span {
display: block;
margin-top: 10px;
font-size: 70%;
}
.cream-sheets-pack-text-box .cream-sheet-pack-box {
margin: 0;
}
@media screen and (min-width: 768px) {
.company-logo {
display: flex;
}
}
.company-logo .company-logo-img {
width: 100%;
margin-right: 20px;
text-align: center;
margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
.company-logo .company-logo-img {
width: 160px;
margin-bottom: 0;
}
}
.company-logo .company-logo-text {
width: 100%;
}
.company-logo .company-logo-text p:first-child {
margin-top: 0;
}.bx-wrapper {
position: relative;
margin-bottom: 60px;
padding: 0;
*zoom: 1;
-ms-touch-action: pan-y;
touch-action: pan-y;
}
.bx-wrapper img {
max-width: 100%;
display: block;
}
.bxslider {
margin: 0;
padding: 0; -webkit-perspective: 1000;
}
ul.bxslider {
list-style: none;
}
.bx-viewport { -webkit-transform: translateZ(0);
} .bx-wrapper {
-moz-box-shadow: 0 0 5px #ccc;
-webkit-box-shadow: 0 0 5px #ccc;
box-shadow: 0 0 5px #ccc;
border: 5px solid #fff;
background: #fff;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
position: absolute;
bottom: -30px;
width: 100%;
} .bx-wrapper .bx-loading {
min-height: 50px;
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/js/images/bx_loader.gif) center center no-repeat #ffffff;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2000;
} .bx-wrapper .bx-pager {
text-align: center;
font-size: .85em;
font-family: Arial;
font-weight: bold;
color: #666;
padding-top: 20px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
background: #666;
text-indent: -9999px;
display: block;
width: 10px;
height: 10px;
margin: 0 5px;
outline: 0;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
background: #000;
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
display: inline-block;
vertical-align: bottom;
*zoom: 1;
*display: inline;
}
.bx-wrapper .bx-pager-item {
font-size: 0;
line-height: 0;
} .bx-wrapper .bx-prev {
left: 10px;
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/js/images/controls.png) no-repeat 0 -32px;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
background-position: 0 0;
}
.bx-wrapper .bx-next {
right: 10px;
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/js/images/controls.png) no-repeat -43px -32px;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
background-position: -43px 0;
}
.bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
margin-top: -16px;
outline: 0;
width: 32px;
height: 32px;
text-indent: -9999px;
z-index: 9999;
}
.bx-wrapper .bx-controls-direction a.disabled {
display: none;
} .bx-wrapper .bx-controls-auto {
text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
display: block;
text-indent: -9999px;
width: 10px;
height: 11px;
outline: 0;
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/js/images/controls.png) -86px -11px no-repeat;
margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
display: block;
text-indent: -9999px;
width: 9px;
height: 11px;
outline: 0;
background: url(//www.nichiei-cosme.co.jp/wp-content/themes/nichiei/js/images/controls.png) -86px -44px no-repeat;
margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
background-position: -86px -33px;
} .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
text-align: left;
width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
right: 0;
width: 35px;
} .bx-wrapper .bx-caption {
position: absolute;
bottom: 0;
left: 0;
background: #666;
background: rgba(80, 80, 80, 0.75);
width: 100%;
}
.bx-wrapper .bx-caption span {
color: #fff;
font-family: Arial;
display: block;
font-size: .85em;
padding: 10px;
}
 .animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}.headShake{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-name:headShake;animation-name:headShake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes wobble{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{0%,11.1%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{0%,11.1%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}.bounceIn{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotateY(-1turn);transform:perspective(400px) rotateY(-1turn);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);transform:perspective(400px) translateZ(150px) rotateY(-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);transform:perspective(400px) translateZ(150px) rotateY(-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) rotateY(-1turn);transform:perspective(400px) rotateY(-1turn);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);transform:perspective(400px) translateZ(150px) rotateY(-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);transform:perspective(400px) translateZ(150px) rotateY(-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-20deg);transform:perspective(400px) rotateY(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateY(-5deg);transform:perspective(400px) rotateY(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-20deg);transform:perspective(400px) rotateY(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateY(-5deg);transform:perspective(400px) rotateY(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateY(-15deg);transform:perspective(400px) rotateY(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateY(-15deg);transform:perspective(400px) rotateY(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center;transform-origin:center;opacity:1}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center;transform-origin:center;opacity:1}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes jackInTheBox{0%{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes jackInTheBox{0%{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.jackInTheBox{-webkit-animation-name:jackInTheBox;animation-name:jackInTheBox}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}@keyframes rollOut{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}