@charset "UTF-8";
 #keyVisual {
overflow: hidden;
z-index: 0;
position: fixed;
bottom: 0;
right: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
width: 100vw ;
height: 100vh;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/kv_poster.jpg) center center no-repeat;
background-size: cover;
}
#keyVisual video {
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
min-width: 100%;
min-height: 100%;
object-fit: cover;
}
@media (max-width:767px) {
#keyVisual {
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/kv_poster_sm.jpg) center top no-repeat;
background-size: 100% auto;
}
#keyVisual video { display: none; }
#keyVisual video.play { display: initial; }
} #mainContent {
position: relative;
margin-top: -80px;
-webkit-transform: translate(0, 80px);
transform: translate(0, 80px);
}
.shown #mainContent {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
.shown.in #mainContent {
transition: .6s ease-out;
}
@media (max-width: 767px) {
#mainContent {
margin-top: 0;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
.shown #mainContent {
margin-top: -60px;
}
} #scroll {
z-index: 90;
position: absolute;
top: 0;
left: 0;
right: 0;
width: 100%;
font-size: 14px;
line-height: 80px;
text-align: center;
letter-spacing: .1em;
}
#scroll span {
overflow: hidden;
display: inline-block;
line-height: 1em;
}
#scroll i {
font-style: normal;
display: inline-block;
-webkit-transform: translate3d(0,100%,1px);
transform: translate3d(0,100%,1px);
}
#scroll:not(.over) i {
animation-delay: 1s;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-timing-function: cubic-bezier(0.80, 0, 0.20, 1);
animation-name: flipout;
}
@keyframes flipout {
35% {
-webkit-transform: translate3d(0,0,1px);
transform: translate3d(0,0,1px);
}
65% {
-webkit-transform: translate3d(0,0,1px);
transform: translate3d(0,0,1px);
}
100% {
-webkit-transform: translate3d(0,-100%,1px);
transform: translate3d(0,-100%,1px);
}
}
#scroll.over {
opacity: 0;
-webkit-transform: translateY(-2em);
transform: translateY(-2em);
}
#scroll.over.in {
transition: .2s ease-in-out;
}
@media (max-width: 767px) {
#scroll {
font-size: 12px;
line-height: 60px;
}
} nav {
z-index: 100000;
position: absolute;
top: 100vh;
bottom: 0;
left: 20px;
width: 220px;
min-height: 100vh;
background: #fff;
}
.shown nav {
-webkit-transform: translateY(-80px);
transform: translateY(-80px);
}
.shown.in nav {
transition: .6s ease-out;
}
nav.fixed {
position: fixed;
top: 0;
-webkit-transform: translateY(0);
transform: translateY(0);
}
nav.fixed-f {
position: fixed !important;
top: 0;
-webkit-transform: translateY(0);
transform: translateY(0);
}
@media (min-width: 768px) {
nav {
height: 100vh;
}
nav h1 {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
nav ul {
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-47.5%);
transform: translateY(-47.5%);
}
}
@media (max-width: 767px) {
nav {
position: fixed;
top: 0;
bottom: auto;
left: 0 !important;
width: 100%;
min-height: 0;
background: transparent;
-webkit-transform: translate3d(0, -100%, 3px);
transform: translate3d(0, -100%, 3px);
}
.shown nav {
-webkit-transform: translate3d(0, 0%, 3px);
transform: translate3d(0, 0%, 3px);
}
nav::after {
content: "";
display: block;
z-index: 0;
position: absolute;
top: -2px;
left: 0;
width: 100%;
height: 60px;
border-bottom: 2px solid #E6EEF2;
transition: .42s ease-in-out;
background: #fff;
-webkit-transform: translate3d(0, -100%, 1px);
transform: translate3d(0, -100%, 1px);
}
nav.scroll-in::after,
.sp-menu-open nav::after {
-webkit-transform: translate3d(0, 0%, 1px);
transform: translate3d(0, 0%, 1px);
}
}
nav h1 {
z-index: 10;
display: flex;
justify-content: center;
align-items: center;
height: 80px;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
nav h1 .logo {
width: 120px;
}
nav ul {
z-index: 1;
position: relative; }
nav li {
position: relative;
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
transition: .2s;
}
nav li a {
width: 120px;
display: block;
font-size: 12px;
line-height: 40px;
color: #7b7b7b;
white-space: nowrap;
text-align: left;
}
nav:not(.scroll-in) a {
cursor: default;
}
nav .mover {
position: absolute;
z-index: 0;
left: 0;
top: 0;
width: 100%;
height: 40px;
transition: 1.4s ease-in-out; }
nav .mover::after {
content: "";
display: block;
position: absolute;
z-index: 0;
bottom: 0;
left: 0;
width: 100%;
height: 0;
transition-duration: .7s;
background: #eee;
}
nav.scroll-in .mover::after {
height: 100%;
}
nav .mover.moving::after {
animation-duration: 1.2s;
animation-iteration-count: 1;
animation-timing-function: ease-in-out;
}
nav .mover.moving.up::after {
animation-name: grow-fat-up;
}
nav .mover.moving.down::after {
animation-name: grow-fat-down;
}
@keyframes grow-fat-up {
0% {
height: 100%;
}
50% {
height: 140%;
bottom: 15px;
}
100% {
height: 100%;
}
}
@keyframes grow-fat-down {
0% {
height: 100%;
}
50% {
height: 140%;
bottom: -30px;
}
100% {
height: 100%;
}
}
nav .mover::before {
z-index: 1;
content: "";
display: block;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
border-top: 0px solid transparent;
border-bottom: 0px solid transparent;
border-left: 0px solid #cfe5f9;
transition: .4s;
}
nav.scroll-in .mover::before { }
nav span {
display: inline-block;
overflow: hidden;
line-height: 1em;
}
@media (min-width: 768px) {
nav span {
-webkit-transform: translateY(.1em);
transform: translateY(.1em);
}
}
nav i {
display: inline-block;
font-style: normal;
line-height: 1em;
transition: 1.2s;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
@media (min-width: 768px) {
nav.scroll-in ul li:not(.current):hover {
background: rgba(0,0,0,0.03);
}
nav.scroll-in i {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
nav.scroll-in li:nth-child(1) i { transition-delay: 0s; }
nav.scroll-in li:nth-child(2) i { transition-delay: .1s; }
nav.scroll-in li:nth-child(3) i { transition-delay: .2s; }
nav.scroll-in li:nth-child(4) i { transition-delay: .3s; }
nav.scroll-in li:nth-child(5) i { transition-delay: .4s; }
nav.scroll-in li:nth-child(6) i { transition-delay: .5s; }
nav.scroll-in li:nth-child(7) i { transition-delay: .6s; }
nav.scroll-in li:nth-child(8) i { transition-delay: .7s; }
nav.scroll-in li:nth-child(9) i { transition-delay: .8s; }
 nav.scroll-in li:nth-child(10) i { transition-delay: .9s; }
 nav.scroll-in li:nth-child(11) i { transition-delay: 1.0s; }
}
@media (max-width: 767px) {
nav h1 {
position: relative;
justify-content: flex-start;
height: 60px;
padding-left: 20px;
text-align: left;
}
nav .logo {
width: 100px;
}
#menuBtnSp {
position: absolute;
right: 20px;
bottom: 10px;
height: 40px;
width: 40px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/hex_menu.png) center center no-repeat;
background-size: auto 100%;
}
#menuBtnSp::before,
#menuBtnSp::after,
#menuBtnSp i {
content: "";
position: absolute;
left: 50%;
top: 50%;
display: block;
height: 2px;
width: 20px;
background: #898989;
transition: .42s ease-in-out;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#menuBtnSp::before { top: 65%; }
#menuBtnSp::after { top: 35%; }
.sp-menu-open #menuBtnSp i { opacity: 0; }
.sp-menu-open #menuBtnSp::before {
top: 50%;
-webkit-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg);
}
.sp-menu-open #menuBtnSp::after {
top: 50%;
-webkit-transform: translate(-50%, -50%) rotate(-45deg);
transform: translate(-50%, -50%) rotate(-45deg);
}
nav ul {
position: absolute;
top: 0;
right: 0;
height: 100vh;
width: 100vw;
margin-top: 60px;
padding: 0 0 60px 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
background: #fff;
transition: .48s ease-in-out;
-webkit-transform: translate3d(0, 100%, -1px);
transform: translate3d(0, 100%, -1px);
}
.sp-menu-open nav ul {
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
nav li a {
overflow: hidden;
position: relative;
width: 100%;
margin-bottom: 1em;
padding-left: 20px;
font-size: 22px;
line-height: 1em;
font-weight: bold;
color: #2D2F44;
}
nav li a::before {
content: "";
position: absolute;
display: block;
top: 0;
left: 0;
width: 2px;
height: 1em;
background: #0096DF;
transition: 1.2s; }
nav .mover {
display: none;
}
nav i {
transition-delay: 0s;
transition: .21s ease-in-out;
}
.sp-menu-open nav li:nth-child(1) i,
.sp-menu-open nav li:nth-child(1) a::before { transition-delay: .4s; }
.sp-menu-open nav li:nth-child(2) i,
.sp-menu-open nav li:nth-child(2) a::before { transition-delay: .5s; }
.sp-menu-open nav li:nth-child(3) i,
.sp-menu-open nav li:nth-child(3) a::before { transition-delay: .6s; }
.sp-menu-open nav li:nth-child(4) i,
.sp-menu-open nav li:nth-child(4) a::before { transition-delay: .7s; }
.sp-menu-open nav li:nth-child(5) i,
.sp-menu-open nav li:nth-child(5) a::before { transition-delay: .8s; }
.sp-menu-open nav li:nth-child(6) i,
.sp-menu-open nav li:nth-child(6) a::before { transition-delay: .9s; }
.sp-menu-open nav li:nth-child(7) i,
.sp-menu-open nav li:nth-child(7) a::before { transition-delay: 1.0s; }
.sp-menu-open nav li:nth-child(8) i,
.sp-menu-open nav li:nth-child(8) a::before { transition-delay: 1.1s; }
.sp-menu-open nav li:nth-child(9) i,
.sp-menu-open nav li:nth-child(9) a::before { transition-delay: 1.2s; }
.sp-menu-open nav li:nth-child(10) i,
.sp-menu-open nav li:nth-child(10) a::before { transition-delay: 1.3s; }
.sp-menu-open nav li:nth-child(11) i,
.sp-menu-open nav li:nth-child(11) a::before { transition-delay: 1.4s; }	
.sp-menu-open nav i,
.sp-menu-open nav li a::before {
transition: 1.3s;
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
} .content-section {
position: relative;
overflow: hidden;
margin-left: 220px;
margin-bottom: 20px;
padding-bottom: 100px;
transition: .42s ease-in-out;
background: transparent;
}
.content-section.reset{
background: transparent;
}
.content-section:not(#news):not(.shown) {
opacity: 0;
-webkit-transform: translateY(80px);
transform: translateY(80px);
}
.content-section.shonw:not(#news) {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
.content-section .inner {
z-index: 1;
position: relative;
width: 60%;
margin: auto;
}
.content-bg,
.content-cover {
position: absolute;
z-index: 0;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #f9f9f9;
}
.content-bg div,
.content-cover div {
position: absolute;
height: 100%;
width: 20%;
border-left: 2px solid #E6EEF2;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.content-bg div:nth-child(1),
.content-cover div:nth-child(1) {
z-index: 1;
left: 20%;
border-left: 0;
}
.content-bg div:nth-child(2),
.content-cover div:nth-child(2) {
left: 40%;
}
.content-bg div:nth-child(3),
.content-cover div:nth-child(3) {
left: 60%;
}
.content-bg div:nth-child(4),
.content-cover div:nth-child(4) {
left: 80%;
}
.content-bg div:nth-child(5),
.content-cover div:nth-child(5) {
left: 100%;
}
.content-bg div:nth-child(5)::before,
.content-cover div:nth-child(5)::before {
content: "";
display: block;
position: absolute;
width: 2px;
top: 0;
bottom: 0;
left: -2px;
background: #E6EEF2;
}
#news .content-bg div { opacity: 0; }
#news.over .content-bg div {
opacity: 1;
transition: .84s;
}
@media (max-width:767px) {
.content-section {
margin-bottom: 10px;
padding-bottom: 60px;
}
.content-bg div:nth-child(5)::before,
.content-cover div:nth-child(5)::before {
left: -1px;
}
}
.content-cover {
z-index: 10;
}
#news .content-cover div {
z-index: 1;
background: #f9f9f9;
border: none;
}
.content-cover div::before {
content: "";
position: absolute;
top: 0;
right: 100%;
height: 0;
width: 2px;
background: #E6EEF2;
} .content-cover div::after {
content: "";
position: absolute;
top: 0;
right: -1px;
height: 100%;
width: 2px;
background: #f9f9f9;
}
#news.shown.in .content-cover div::before {
height: 100%;
transition-duration: .21s;
}
.content-cover div:nth-child(2)::before { transition-delay: 0s; }
.content-cover div:nth-child(3)::before { transition-delay: .21s; }
.content-cover div:nth-child(4)::before { transition-delay: .42s; }
.content-cover div:nth-child(5)::before { transition-delay: .63s; }
.content-cover div:nth-child(6)::before { transition-delay: .84s; }
.content-cover.over div::before {
top: auto;
bottom: 0;
height: 0 !important;
}
#news.over .content-cover div::after { display: none; }
#news.over .content-cover div {
width: 0;
border-width: 0;
transition: .01s !important;
transition-delay: 0s !important;
}
@media (max-width: 767px) {
.content-section {
margin-left: 0;
}
.content-section .inner {
width: auto;
margin: 0 10px;
}
.content-bg {
margin: 0 10px;
}
.content-cover {
left: 12px;
right: 10px;
}
.content-bg div,
.content-cover div {
width: 50%;
-webkit-transform: translateX(0);
transform: translateX(0);
}
.content-bg div:nth-child(4) {
left: 0;
}
.content-bg div:nth-child(5) {
border-right: 2px solid #eee;
left: 50%;
}
.content-cover div:nth-child(3) {
transition-delay: 0s;
left: 0;
}
.content-cover div:nth-child(4) {
transition-delay: .3s;
left: 50%;
}
.content-cover div:nth-child(5) {
transition-delay: .6s;
left: 100%;
-webkit-transform: translateX(0);
transform: translateX(0);
}
.content-bg div:nth-child(-n+3),
.content-cover div:nth-child(-n+2) {
display: none !important;
}
}
.section-title {
display: inline-block;
position: relative;
overflow: hidden;
margin: 90px 0;
padding: 0 0 0 40px;
font-size: 40px;
color: transparent;
}
.section-title.over {
color: inherit;
}
.section-title::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background: #0096DF;
transition: 0s;
transition-delay: .21s;
}
.section-title.over::before {
width: 2px;
}
.section-title::after {
z-index: 10;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #0096DF;
transition: .35s cubic-bezier(0.73, 0, 0.38, 1);
-webkit-transform: translate3d(-101%, 0, 1px);
transform: translate3d(-101%, 0, 1px);
} .section-title.shown::after {
-webkit-transform: translate3d(0%, 0, 1px);
transform: translate3d(0%, 0, 1px);
}
.section-title.over::after {
transition-delay: .21s !important;
-webkit-transform: translate3d(101%, 0, 1px);
transform: translate3d(101%, 0, 1px);
}
.section-title span {
display: block;
line-height: 1em;
letter-spacing: .05em;
transition: 0s;
transition-delay: .35s;
color: transparent;
}
.section-title.over span {
color: inherit;
}
.section-title .sub {
margin-top: .5em;
font-size: 16px;
font-weight: normal;
color: transparent;
transition: 0s;
transition-delay: .35s;
}
.section-title.over .sub {
color: #7b7b7b;
}
.section-title i {
font-style: normal;
}
#news .inner::after,
#vision .inner::after,
#mission .inner::after {
content: "";
position: absolute;
bottom: 0;
left: -20px;
width: 33.333333%;
background-position: right bottom;
background-repeat: no-repeat;
background-size: auto 100%;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
#vision .inner::after {
height: 239px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_vision.png);
}
#mission .inner::after {
height: 314px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_mission.png);
}
#news .inner::after {
opacity: 0;
height: 285px;
transition: .42s ease-in-out;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_news.png);
}
#news.over .inner::after {
opacity: 1;
transition-delay: .05s;
}
@media (max-width: 767px) {
.section-title {
margin: 55px 0 60px;
padding-left: 30px;
font-size: 28px;
}
#news .inner::after,
#vision .inner::after,
#mission .inner::after {
position: relative;
display: block;
left: auto;
bottom: auto;
width: 100%;
margin-top: 60px;
background-position: center center;
-webkit-transform: translateX(0);
transform: translateX(0);
}
} .content-header {
position: relative;
margin: 90px auto;
padding-left: 40px;
font-size: 20px;
font-weight: bold;
color: #0096DF;
}
.section-title + .content-header { margin-top: 0; }
.content-header::before {
content: "";
z-index: 1;
position: absolute;
left: 0;
top: 50%;
opacity: 0;
display: block;
width: 40px;
height: 100%;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
transition-delay: .7s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.content-header.shown::before  {
opacity: 1;
-webkit-transform: translate(-50%, -55%);
transform: translate(-50%, -55%);
}
.content-header span {
display: inline-block;
overflow: hidden;
-webkit-transform: translateY(.1em);
transform: translateY(.1em);
}
.content-header i {
display: inline-block;
font-style: normal;
transition: .42s;
transition-delay: .7s;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.content-header.shown i {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.content-item {
position: relative;
font-size: 16px;
line-height: 2em;
}
#vision .content-item,
#mission .content-item {
padding-left: 40px;
}
#vision .content-item::before,
#mission .content-item::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 2px;
height: 100%;
background: #0096DF;
}
@media (max-width: 767px) {
.content-header {
margin: 60px auto;
padding-left: 60px!important;
}
.content-header::before {
-webkit-transform: translate(0, -55%) !important;
transform: translate(0, -55%) !important;
}
#vision .content-item,
#mission .content-item {
padding-left: 30px;
}
} .btn {
position: relative;
overflow: hidden;
display: block;
width: 100%;
text-align: center;
line-height: 40px;
color: #000;
}
.btn i {
height: 1em;
line-height: 1em;
display: block;
float: left;
font-style: normal;
}
.btn span {
position: relative;
z-index: 1;
display: inline-block;
}
.btn .over-wrap {
display: block;
height: 40px;
width: 100%;
background-color: #cfe5f9;
}
.btn .flap,
.btn .flip {
overflow: hidden;
position: absolute;
top: 50%;
left: 50%;
height: 1em;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.btn .flap i {
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.btn:hover .flap i {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.btn .flip i {
color: #fff;
transition: .42s cubic-bezier(.645, .045, .355, 1);
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.btn:hover .flip i {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
.btn i:nth-child(1) { transition-delay: .15s; }
.btn i:nth-child(2) { transition-delay: .1s; }
.btn i:nth-child(3) { transition-delay: .05s; }
.btn i:nth-child(4) { transition-delay: 0s; }
.btn:hover i:nth-child(1) { transition-delay: 0s; }
.btn:hover i:nth-child(2) { transition-delay: .05s; }
.btn:hover i:nth-child(3) { transition-delay: .1s; }
.btn:hover i:nth-child(4) { transition-delay: .15s; }
.btn-flipflap {
margin-top: 100px;
font-size: 105%;
letter-spacing: .05em;
}
.btn-flipflap .over-wrap::before {
content: "";
position: absolute;
z-index: 0;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: #0096df;
transition: .42s cubic-bezier(.645, .045, .355, 1);;
-webkit-transform: translateX(-101%);
transform: translateX(-101%);
}
.btn-flipflap .over-wrap:hover::before {
-webkit-transform: translateX(0%);
transform: translateX(0%);
} .news-item {
margin-bottom: 20px;
overflow: hidden;
}
.news-item:last-child {
margin-bottom: 0;
}
.news-header {
display: flex;
justify-content: space-between;
align-items: center;
opacity: 0;
position: relative;
min-height: 40px;
padding: 4px 60px 4px 20px;
font-size: 14px;
font-weight: normal;
transition: .42s ease-in-out;
background: #fff;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
#news.over .news-header {
opacity: 1;
transition-delay: .4s;
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
#news.over .news-item:nth-child(2) .news-header { transition-delay: .5s; }
#news.over .news-item:nth-child(3) .news-header { transition-delay: .6s; }
#news.over .news-item:nth-child(4) .news-header { transition-delay: .7s; }
#news.over .news-item:nth-child(5) .news-header { transition-delay: .8s; }
#news .news-header .title {
display: inline-block;
line-height: 1.4em;
overflow: hidden;
flex-shrink: 100;
padding-right: 20px;
}
#news .news-header .text-wrapper{
display: inline-block;
line-height: 1em;
}
#news .news-header .date {
display: inline-block;
line-height: 1em;
overflow: hidden;
flex-shrink: 0;
text-align: right;
}
#news .news-header .title i,
#news .news-header .date i {
display: inline-block;
font-style: normal;
transition: .35s;
transition-delay: 1.2s;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
#news.over .news-header .title i,
#news.over .news-header .date i {
-webkit-transform: translateY(0);
transform: translateY(0);
} @media (min-width:768px) {
#news .news-header .title {
position: relative;
padding: 0 90px 0 0;
line-height: 1.5em;
}
#news .news-header .date {
position: absolute;
top: 14px;
right: 60px;
}
}
@media (max-width:767px) {
.news-header {
padding: 12px 60px 12px 16px;
flex-direction: column;
justify-content: center;
align-items: flex-start;
}
#news .news-header .title {
line-height: 1.8em;
}
#news .news-header .title,
#news .news-header .date {
line-height: 2em;
}
}
#news .btn .over-wrap {
opacity: 0;
transition: .35s ease-in-out;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
#news.over .btn .over-wrap {
opacity: 1;
transition-delay: .9s;
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
@media (max-width:767px) {
#news .btn {
width: auto;
margin: 60px 50px;
}
#news .over-wrap {
height: 60px;
}
}
.news-header .date {
font-size: 12px;
}
.news-header a {
overflow: hidden;
display: block;
position: absolute;
right: 0;
top: 0;
width: 40px;
height: 40px;
background-color: #cfe5f9;
}
.news-header a::before {
content: "";
position: absolute;
z-index: 0;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: #0096df;
transition: .42s cubic-bezier(.645, .045, .355, 1);;
-webkit-transform: translateX(-101.1%);
transform: translateX(-101.1%);
}
.news-header .title a {
width: auto;
height: auto;
background-color: transparent;
position: static;
color: #2D2F44;
}
.news-header .title a::before {
display: none;
}
.news-header a:hover::before {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
.news-header a.hover::before {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
.news-header .external span {
overflow: hidden;
z-index: 1;
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 40px;
height: 40px;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.news-header .external i {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
transition: .42s cubic-bezier(.645, .045, .355, 1);
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_external.png);
background-position: 14px center;
background-repeat: no-repeat;
background-size: 16px auto;
}
.news-header .external i.flip {
filter: berightness(10);
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_external_white.png);
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.news-header .external:hover i.flap {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.news-header .external:hover i.flip {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
.news-header .close span,
.news-header .open span {
overflow: hidden;
z-index: 1;
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 1em;
height: 1em;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.news-header .close i,
.news-header .open i {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.news-header .open i.flip,
.news-header .close i.flip {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.news-header .open:hover i.flip,
.news-header .close:hover i.flip {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
.news-header .open:hover i.flap,
.news-header .close:hover i.flap {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.news-header .open.hover i.flip,
.news-header .close.hover i.flip {
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
.news-header .open.hover i.flap,
.news-header .close.hover i.flap {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.news-header .open i::before,
.news-header .open i::after,
.news-header .close i::before,
.news-header .close i::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
height: 2px;
width: 0.5em;
background: #000;
transition: .2s;
}
.news-header .open i.flip::before,
.news-header .open i.flip::after,
.news-header .close i.flip::before,
.news-header .close i.flip::after {
background: #fff;
}
.news-header .close i::before {
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, 100%) rotate(-45deg);
}
.news-header .close i::after {
-webkit-transform: translate(-50%, -50%) rotate(90deg);
transform: translate(-50%, -100%) rotate(45deg);
}
.news-header .open i::before {
-webkit-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg);
}
.news-header .open i::after {
-webkit-transform: translate(-50%, -50%) rotate(-45deg);
transform: translate(-50%, -50%) rotate(-45deg);
}
.news-item .article {
display: none;
padding: 32px 20px 40px 20px;
background: #fff;
font-size: 14px;
color: #7C7D8A;
word-break: break-word;
}
.news-item.open .article {
display: block;
}
.news-item .article img {
width: 100%;
height: auto;
display: block;
}
.news-item .article a:link {
text-decoration: underline;
}
@media (max-width:767px) {
.news-item .article {
padding: 40px 10px 60px;
}
} #corevalues .spacer {
position: absolute;
bottom: -36px;
left: 0;
width: 100%;
}
#corevalues .spacer span {
position: absolute;
top: 0;
left: 0;
height: 2px;
width: 40px;
background: #E6EEF2;
-webkit-transform: translate3d(-50%, -50%, 1px);
transform: translate3d(-50%, -50%, 1px);
}
#corevalues .spacer span:nth-child(2) { left: 33.333333%; }
#corevalues .spacer span:nth-child(3) { left: 66.666666%; }
#corevalues .spacer span:nth-child(4) { left: 100%; }
@media (max-width: 767px) {
#corevalues .spacer { display: none; }
}
#corevalues .content-item {
font-size: 14px;
line-height: 2.2em;
}
#corevalues .content-item:not(:last-child) { margin-bottom: 80px; }
#corevalues .content-item::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 33.333333%;
background-position: center bottom;
background-repeat: no-repeat;
background-size: auto 100%;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
@media (max-width:1400px) {
#corevalues .content-item::after { left: -20px; }
}
#corevalues .content-header {
margin: 0 auto 50px;
}
#corevalues .content-header.parentheses {
padding-left: 30px;
}
#corevalues .content-item .content-header {
margin: 0 auto 45px;
font-size: 18px;
line-height: 1.8em;
color: inherit;
}
@media (min-width:768px) {
#corevalues .content-item .content-header span {
-webkit-transform: translateY(.4em);
transform: translateY(.4em);
}
}
#corevalues .content-item .content-header::before {
opacity: 1;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#corevalues .content-item:nth-of-type(1)::after {
height: 156px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue01.png);
}
#corevalues .content-item:nth-of-type(2)::after {
height: 129px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue02.png);
}
#corevalues .content-item:nth-of-type(3)::after {
height: 120px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue03.png);
}
#corevalues .content-item:nth-of-type(4)::after {
height: 101px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue04.png);
}
#corevalues .content-item:nth-of-type(5)::after {
height: 111px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue05.png);
}
#corevalues .content-item:nth-of-type(6)::after {
height: 123px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue06.png);
}
#corevalues .content-item:nth-of-type(1) .content-header::before,
#corevaluesSlider .slide01 .content-header::before { background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex_num01.png); }
#corevalues .content-item:nth-of-type(2) .content-header::before,
#corevaluesSlider .slide02 .content-header::before { background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex_num02.png); }
#corevalues .content-item:nth-of-type(3) .content-header::before,
#corevaluesSlider .slide03 .content-header::before { background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex_num03.png); }
#corevalues .content-item:nth-of-type(4) .content-header::before,
#corevaluesSlider .slide04 .content-header::before { background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex_num04.png); }
#corevalues .content-item:nth-of-type(5) .content-header::before,
#corevaluesSlider .slide05 .content-header::before { background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex_num05.png); }
#corevalues .content-item:nth-of-type(6) .content-header::before,
#corevaluesSlider .slide06 .content-header::before { background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hex_num06.png); }
#corevaluesSlider .content-item .content-header {
line-height: 1em;
}
#corevaluesSlider .content-item .content-header::before {
opacity: 1;
top: -20px;
left: 50%;
transition: 0s;
transition-delay: 0s;
-webkit-transform: translate(-50%, -100%) !important;
transform: translate(-50%, -100%) !important;
}
.modal .content-item .content-text {
display: block;
position: relative;
margin: 0 10px 10px;
border: 2px solid #eee;
padding: 35px 0 50px;
}
.modal .content-item .content-text span {
position: relative;
z-index: 1;
}
.modal .content-item .content-text::before {
z-index: 0;
box-sizing: border-box;
content: "";
display: block;
position: absolute;
width: 2px;
top: 0;
bottom: 0;
left: 50%;
background: #eee;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#corevaluesSlider .content-item .content-text::after {
z-index: 1;
content: "";
display: block;
margin: 60px 0 0;
background-position: center center;
background-repeat: no-repeat;
background-size: auto 100%;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#corevaluesSlider .slide01 .content-text::after {
height: 141px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue01.png);
}
#corevaluesSlider .slide02 .content-text::after {
height: 117px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue02.png);
}
#corevaluesSlider .slide03 .content-text::after {
height: 108px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue03.png);
}
#corevaluesSlider .slide04 .content-text::after {
height: 97px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue04.png);
}
#corevaluesSlider .slide05 .content-text::after {
height: 101px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue05.png);
}
#corevaluesSlider .slide06 .content-text::after {
height: 111px;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_corevalue06.png);
}
.modal .content-header {
margin: 85px 0 20px;
padding-left: 0;
color: inherit;
text-align: center;
font-size: 1rem;
}
.modal .content-header span {
line-height: 1.1em;
}
.modal .content-text {
font-size: 14px;
line-height: 1.8em;
}
@media (max-width:767px) {
#corevalues { padding-bottom: 40px; }
#corevalues .content-item:not(:last-child) {
margin-bottom: 120px;
}
#corevalues .content-item::before {
content: "";
display: block;
position: absolute;
z-index: 0;
width: 160px;
height: 160px;
top: 50%;
left: 50%;
border-radius: 100%;
border: 40px solid #fff;
background: #D6E8F9;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#corevalues .content-item::after {
z-index: 1;
width: 240px;
height: 240px;
top: 50%;
left: 50%;
background-position: center center;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#corevalues .content-item:nth-of-type(1)::after {
height: 141px;
}
#corevalues .content-item:nth-of-type(2)::after {
height: 117px;
}
#corevalues .content-item:nth-of-type(3)::after {
height: 108px;
}
#corevalues .content-item:nth-of-type(4)::after {
height: 97px;
}
#corevalues .content-item:nth-of-type(5)::after {
height: 101px;
}
#corevalues .content-item:nth-of-type(6)::after {
height: 111px;
}
#corevalues .content-item .content-header {
z-index: 2;
height: 240px;
width: 240px;
margin: 80px auto 35px;
padding: 0;
font-size: 14px;
text-align: center;
}
#corevalues .content-item .content-header::before {
z-index: 1;
top: 0;
left: 50%;
height: 43px;
-webkit-transform: translate(-50%, -50%) !important;
transform: translate(-50%, -50%) !important;
}
#corevalues .content-item .content-header span {
position: absolute;
z-index: 2;
display: block;
bottom: 2em;
left: 50%;
overflow: visible;
white-space: nowrap;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#corevalues .content-item .content-header .spbtn {
content: "";
display: block;
position: absolute;
z-index: 1;
bottom: 0;
left: 50%;
width: 0;
height: 0;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_caret_right.png) center center no-repeat;
background-size: cover;
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
}
#corevalues .content-item .content-header.shown .spbtn {
animation-duration: 2s;
animation-iteration-count: 1;
animation-timing-function: ease-out;
animation-name: flashing;
}
#corevalues .content-item .content-header.over .spbtn {
width: 40px;
height: 40px;
}
#corevalues .content-item .content-header .spbtn::after {
content: "";
opacity: 0;
display: block;
position: absolute;
z-index: 1;
top: 0;
bottom: 0;
right: 0;
left: 0;
border-radius: 50%;
background: #0c9adf;
}
#corevalues .content-item .content-header.shown .spbtn::after {
animation-duration: 2s;
animation-iteration-count: 1;
animation-timing-function: ease-out;
animation-name: flashing-opacity;
}
#corevalues .content-text { display: none; }
}
#businessmodelFigure {
opacity: 0;
margin-top: 100px;
font-weight: bold;
transition: .42s ease-in-out;
-webkit-transform: translate3d(0,40px,1px);
transform: translate3d(0,40px,1px);
}
#businessmodelFigure.shown {
opacity: 1;
-webkit-transform: translate3d(0,0,1px);
transform: translate3d(0,0,1px);
}
#businessmodelFigure .box-bordered {
padding: 0.8em 0;
border: 2px solid #dbdbdb;
line-height: 1em;
text-align: center;
}
#businessmodelFigure .box-bordered.dk { border-color: #0096f0; }
#businessmodelFigure .top .center {
padding: 0 15px;
width: 33.333333%;
margin: auto;
}
#businessmodelFigure .tc02 {
position: relative;
margin-top: 28px;
}
#businessmodelFigure .tc02::before {
content: "";
display: block;
position: absolute;
top: -2px;
left: 0;
width: 100%;
height: 22px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/caret_up.png) center bottom no-repeat;
background-size: auto 100%;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
#businessmodelFigure .tc03 {
position: relative;
margin: 28px 0;
padding: 8px 10px;  
}
#businessmodelFigure .tc03::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 50%;
width: 5px;
height: 28px;
background: #dbdbdb;
-webkit-transform: translate(-50%, -100%);
transform: translate(-50%, -100%);
}
#businessmodelFigure .tc03::after {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 50%;
width: 5px;
height: 30px;
background: #dbdbdb;
-webkit-transform: translate(-50%, 100%);
transform: translate(-50%, 100%);
}
#businessmodelFigure .bottom {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#businessmodelFigure .bottom .center {
width: 100%;
}
#businessmodelFigure .bottom .left,
#businessmodelFigure .bottom .right {
width: 33.333333%;
padding: 0 15px;
}
#businessmodelFigure .bottom .bc01 {
position: relative;
}
#businessmodelFigure .bc01::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 66.666666%;
height: 4px;
background: #dbdbdb;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#businessmodelFigure .bl01,
#businessmodelFigure .br01 {
position: relative;
margin: 28px 0;
}
#businessmodelFigure .bl01::before,
#businessmodelFigure .br01::before {
content: "";
display: block;
position: absolute;
bottom: -2px;
left: 0;
width: 100%;
height: 22px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/caret_bottom.png) center bottom no-repeat;
background-size: auto 100%;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
#businessmodelFigure .bl01::after,
#businessmodelFigure .br01::after {
content: "";
display: block;
position: absolute;
top: -2px;
left: 50%;
width: 5px;
height: 30px;
background: #dbdbdb;
-webkit-transform: translate(-50%, -100%);
transform: translate(-50%, -100%);
}
@media (max-width: 1190px) {
#businessmodelFigure .top .center {
width: 50%;
padding: 0;
}
#businessmodelFigure .bottom .left,
#businessmodelFigure .bottom .right {
width: 49%;
padding: 0;
} 
#businessmodelFigure .bc01::after {
width: 50%;
}
@media (max-width: 767px) {
#businessmodelFigure {
margin-top: 60px;
}
}
}
#technology .content-item {
overflow: hidden;
}
#technology .content-item img {
opacity: 0;
transition: .42s ease-in-out;
transition-delay: 1s;
-webkit-transform: translate3d(0,40px,1px); 
transform: translate3d(0,40px,1px); 
}
#technology.over .content-item img {
opacity: 1;
-webkit-transform: translate3d(0,0,1px); 
transform: translate3d(0,0,1px); 
}
#technology .btn-more::before,
#technology .btn-more::after {
content: "";
display: block;
z-index: 10;
position: absolute;
top: 12px;
right: 12px;
width: 16px;
height: 16px;
transition: .42s cubic-bezier(.645, .045, .355, 1);
transition-delay: 0s;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_external.png);
background-position: center center;
background-repeat: no-repeat;
background-size: 100% auto;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#technology .btn-more::after {
top: auto;
bottom: 12px;
height: 0;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_external_white.png);
}
#technology .btn-more:hover::before {
height: 0;
transition-delay: .2s;
}
#technology .btn-more:hover::after {
height: 16px;
transition-delay: .2s;
}
@media (max-width:767px) {
#technology .btn {
width: auto;
margin: 60px 50px 0;
}
#technology .over-wrap {
height: 60px;
}
#technology .btn-more::before {
top: 22px;
}
#technology .btn-more::after {
bottom: 22px;
}
}
#energysolutions .content-item {
overflow: hidden;
}
#energysolutions .content-item img {
opacity: 0;
transition: .42s ease-in-out;
transition-delay: 1s;
-webkit-transform: translate3d(0,40px,1px); 
transform: translate3d(0,40px,1px); 
}
#energysolutions.over .content-item img {
opacity: 1;
-webkit-transform: translate3d(0,0,1px); 
transform: translate3d(0,0,1px); 
}
#energysolutions .btn-more::before,
#energysolutions .btn-more::after {
content: "";
display: block;
z-index: 10;
position: absolute;
top: 12px;
right: 12px;
width: 16px;
height: 16px;
transition: .42s cubic-bezier(.645, .045, .355, 1);
transition-delay: 0s;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_external.png);
background-position: center center;
background-repeat: no-repeat;
background-size: 100% auto;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#energysolutions .btn-more::after {
top: auto;
bottom: 12px;
height: 0;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_external_white.png);
}
#energysolutions .btn-more:hover::before {
height: 0;
transition-delay: .2s;
}
#energysolutions .btn-more:hover::after {
height: 16px;
transition-delay: .2s;
}
@media (max-width:767px) {
#energysolutions .btn {
width: auto;
margin: 60px 50px 0;
}
#energysolutions .over-wrap {
height: 60px;
}
#energysolutions .btn-more::before {
top: 22px;
}
#energysolutions .btn-more::after {
bottom: 22px;
}
}
#ourteam .content-item:not(:last-child) { margin-bottom: 100px; }
#ourteam .content-item h4 {
margin: 31px 0 23px;
font-size: 16px;
font-weight: normal;
line-height: 1em;
}
#ourteam .content-item .content-text {
font-size: 14px;
line-height: 2em;
}
.modal .member-img {
margin: 60px auto -2px;
padding: 0 10px;
width: auto;
}
.modal h4 {
position: absolute;
top: 0;
width: 100%;
text-align: center;
font-weight: normal;
font-size: 14px;
line-height: 60px;
}
.modal h4 strong {
font-weight: bold;
}
@media (max-width: 767px) {
#ourteam .content-item:not(:last-child) { margin-bottom: 60px; }
#ourteam .content-item h4 {
position: relative;
margin: 0;
padding: 13px 40px 13px 13px;
font-size: 14px;
background: #fff;
}
#ourteam .content-item h4::after {
z-index: 1;
content: "";
display: block;
position: absolute;
right: 0;
top: 0;
width: 40px;
height: 40px;
background: #cfe5f9 url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_caret_right2.png) center center no-repeat;
background-size: auto 12px;
}
#ourteam .content-item .content-text {
display: none;
}
}
#contact .content-item {
font-size: 14px;
}
#contact form {
margin-top: 100px;
}
#contact .input-wrapper {
overflow: hidden;
margin-bottom: 20px;
}
#contact input {
opacity: 0;
display: block;
width: 100%;
border: 2px solid transparent;
border-radius: 0;
padding: 6px 13px;
font-size: 16px;
-webkit-appearance: none;
transition: .42s ease-in-out;
transition-delay: .8s;
-webkit-transform: translate3d(0, 40px, 1px);
transform: translate3d(0, 40px, 1px);
}
#contact .input-wrapper:nth-of-type(2) input {
transition-delay: .9s;
}
#contact textarea {
opacity: 0;
display: block;
width: 100%;
border: 2px solid transparent;
border-radius: 0;
padding: 6px 13px;
resize: vertical;
font-size: 16px;
-webkit-appearance: none;
transition: .42s ease-in-out;
transition-delay: 1s;
-webkit-transform: translate3d(0, 40px, 1px);
transform: translate3d(0, 40px, 1px);
}
#contact.over input,
#contact.over textarea {
opacity: 1;
-webkit-transform: none;
transform: none;
}
#contact input:focus,
#contact textarea:focus {
outline: none;
border-color: #0096DF;
}
#contact input.error,
#contact textarea.error {
background-color: #ffcccc;
transition: .21s ease-in-out;
transition-delay: 0s !important;
}
#contact input.valid,
#contact textarea.valid {
transition: .21s ease-in-out;
transition-delay: 0s !important;
}
@media (max-width:767px) {
#contact .btn {
width: auto;
margin: 60px 50px 0;
}
#contact .over-wrap {
height: 60px;
}
}
#about .content-item {
font-size: 14px;
}
#about .content-item:not(:last-child) { margin-bottom: 100px; }
#about .logo-img {
margin-bottom: 1em;
}
#about .logo-img {
position: relative;
height: 200px;
background: #fff;
}
#about .logo {
position: absolute;
top: 50%;
left: 50%;
width: 305px;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#about small {
font-size: 75%;
}
#about caption {
margin-bottom: 30px;
text-align: left;
font-weight: bold;
}
#about th {
white-space: nowrap;
font-weight: normal;
text-align: left;
}
#about td.margin {
padding-left: 2em;
padding-right: 2em;
}
@media (max-width: 767px) {
#about .logo {
width: 185px;
}
#about caption {
margin-bottom: 0;
}
#about table {
line-height: 1.5em;
}
#about th {
font-weight: bold;
display: inline-block;
margin: 30px 0 10px;
}
#about td {
display: block;
width: 100%;
}
#about td.margin {
display: inline-block;
width: auto;
padding: 0;
}
} #news-content{
padding-top: 80px;
}
.news-page h2.archive-news{
text-align: center;
width: 100%;
margin: 36px 0 90px;
}
.news-section-title{
font-size: 18px;
font-weight: bold;
}
.news-image-left::before{
content: "";
position: absolute;
top: 26px;
left: -55px;
width: 110px;
background-color: transparent;
background-position: right bottom;
background-repeat: no-repeat;
background-size: auto 100%;
height: 80px;
transition: .42s ease-in-out;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_newslist_left.png);
opacity: 1;
transition-delay: .05s;
z-index: 20;
}
.news-image-right::before{
content: "";
position: absolute;
top: 11px;
right: -94px;
width: 152px;
background-color: transparent;
background-position: right bottom;
background-repeat: no-repeat;
background-size: auto 100%;
height: 98px;
transition: .42s ease-in-out;
background-image: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/illust_newslist_right.png);
opacity: 1;
transition-delay: .05s;
z-index: 20;
}
.news-page .section-title.archive-news::before{
display: none;
}
.news-section-title-tag{
font-size: 18px;
font-weight: normal;
padding-left: 18px;
}
.pager a,
.pager span{
display:inline-block;
width:50px;
height:50px;
line-height:44px;
vertical-align:middle;
text-align:center;
color:#2D2F44;
margin:0 -1px;
font-weight: normal;
}
.pager{
margin: 75px auto -25px;
text-align:center;
font-family: "roboto slab";
}
.pager svg{
width:12px;
height:12px;
display:block;
margin:19px auto;
}
.pager * {
fill:#fff;
font-size: 20px;
font-weight: bold;
color: #2D2F44;
}
.pager span{
position: relative;
}
.pager span::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
transition-delay: .7s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager span.current::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
transition-delay: .7s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager span.page-numbers.dots span::before{
content: none;
}
.page-numbers.dots span{
right: 4px;
letter-spacing: -8px;
font-size: 15px;
top: 0px;
}
.pager a{
position: relative;
}
.pager a:hover{
position: relative;
color: #fff;
transition: .42s;
}
.pager a::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager a:hover::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager span.current{
color: #fff;
}
.page-numbers.prev,
.page-numbers.next{
display: none;
}
.ar_rev{
-moz-transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
-o-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
}
.cat-list{
margin-bottom: 20px; 
position: relative;
}
.cat-list.page-all{
margin-bottom: 90px; 
position: relative;
}
.cat-list ul{
display: flex;
display: -webkit-flex;
-webkit-justify-content: center;
justify-content: center;
flex-wrap: wrap;
margin: 0 -5px;
transition: .42s;
}
.cat-list ul.all{
display: flex;
display: -webkit-flex;
-webkit-justify-content: center;
justify-content: center;
flex-wrap: wrap;
margin: 0 -5px;
transition: .42s;
margin-bottom: 20px;
}
.cat-list ul li a {
display: block;
padding: 10px 0 10px 0;
-webkit-border-radius: 20px 20px;
border-radius: 20px 20px;
border-style: solid; 
border-width: 1px; 
border-color: #CFCFCF;
-webkit-transition-property: background-color;
transition-property: background-color;
color: #2D2F44;
text-align: center;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat-list ul li a:hover {
border-color: #0096DF;
color: #fff;
background-color: #0096DF;
font-weight: bold;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat-list ul li a.on {
border-color: #0096DF;
color: #fff;
background-color: #0096DF;
font-weight: bold;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat-list ul li {
height: 34px;
width: calc((100% / 3) - 10px);
min-width: 140px;
font-size: 14px;
line-height: 14px;
margin:0 5px 20px;
box-sizing: border-box;
position: relative;
}
.cat-list .spacer {
position: relative;
bottom: 55px;
left: 0;
width: 100%;
}
.cat-list .spacer span {
position: absolute;
top: 0;
left: 0;
height: 2px;
width: 40px;
background: #E6EEF2;
-webkit-transform: translate3d(-50%, -50%, 1px);
transform: translate3d(-50%, -50%, 1px);
}
.cat-list .spacer span:nth-child(2) { left: 33.333333%; }
.cat-list .spacer span:nth-child(3) { left: 66.666666%; }
.cat-list .spacer span:nth-child(4) { left: 100%; }
@media (max-width: 767px) {
.cat-list .spacer,
.tag-list .spacer{ display: none; }
}
.content-item .spacer.second {
position: relative;
bottom: 58px;
left: 0;
width: 100%;
}
.content-item .spacer.second span {
position: absolute;
top: 0;
left: 0;
height: 2px;
width: 40px;
background: #E6EEF2;
-webkit-transform: translate3d(-50%, -50%, 1px);
transform: translate3d(-50%, -50%, 1px);
}
.content-item .spacer.second span:nth-child(2) { left: 33.333333%; }
.content-item .spacer.second span:nth-child(3) { left: 66.666666%; }
.content-item .spacer.second span:nth-child(4) { left: 100%; }
.tag-list{
position: relative;
}
.tag-list ul{
display: flex;
display: -webkit-flex;
-webkit-justify-content: center;
justify-content: center;
flex-wrap: wrap;
width: 130%;
right: 15%;
position: relative;
margin-bottom: 90px;
transition: .42s;
}
@media (max-width:767px ) {
.pc{
display: none;
}
.content-item .spacer.second{
display: none;
}
.tag-list ul{
display: flex;
display: -webkit-flex;
-webkit-justify-content: center;
justify-content: center;
flex-wrap: wrap;
width: 100%;
left: 0;
position: relative;
margin-bottom: 20px;
transition: .42s;
}
.news-page h2.archive-news {
margin: 75px 0 30px;
padding-left: 0px;
}
.news-section-title {
display: block;
font-size: 16px;
}
.news-section-title-tag {
font-size: 12px;
padding-left: 0;
}
.cat-list {
margin-bottom: 50px;
position: relative;
}
.cat-list ul {
display: flex;
display: -webkit-flex;
-webkit-justify-content: center;
justify-content: center;
flex-wrap: wrap;
margin: 0 -5px;
transition: .42s;
height: 40px;
}
.cat-list ul li {
height: 40px;
width: 100%;
font-size: 14px;
line-height: 14px;
margin: 0; 
left: 0px;
box-sizing: border-box;
position: absolute;
}
.cat-list ul li .on {
display:  block;
}
.cat-list ul li {
display: block;
}
.cat-list ul li a {
display: block;
padding: 10px 0 10px 0;
border-radius: 0px 0px;
font-weight: bold;
-webkit-transition-property: background-color;
transition-property: background-color;
color: #2D2F44;
text-align: left;
transition: .42s cubic-bezier(.645, .045, .355, 1);
border-top: 2px solid #D6E8F9;
border-bottom: 2px solid #D6E8F9;
border-left: 2px solid #D6E8F9;
border-right: none;
}
.cat-list ul li a{
padding-left: 44px !important;
height: 40px;
margin-right: 40px;
line-height: 20px;
}
.cat1::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat1.on::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat2.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat2::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat3.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat3::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat4.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat4::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat5.on::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat5::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat6.on::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: 24px !important;
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat6::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: 24px !important;
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.sp{
display: block;
}
.cat_button{
overflow: hidden;
display: block;
position: absolute;
right: 0;
top: 0;
width: 40px;
height: 40px;
background-color: #0096DF; 
}
.cat_button span{
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
}
.cat_button span .flap{
display: block;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat_button span .flap::before{
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
height: 2px;
width: 0.5em;
background: #fff;
transition: .2s;
-webkit-transform: translate(-50%, -50%);
transform: translate(0%, 0%) rotate(-45deg);
}
.cat_button span .flap::after{
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
height: 2px;
width: 0.5em;
background: #fff;
transition: .2s;
-webkit-transform: translate(-50%, -50%) rotate(90deg);
transform: translate(-50%, 0%) rotate(45deg)
}
.cat_button span{
overflow: hidden;
z-index: 1;
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 1em;
height: 1em;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.cat_button::before{
content: "";
position: absolute;
z-index: 0;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: #0096df;
transition: .42s cubic-bezier(.645, .045, .355, 1);
-webkit-transform: translateX(-101.1%);
transform: translateX(-101.1%);
}
.pager a,
.pager span{
display:inline-block;
width:30px;
height:30px;
line-height:26px;
vertical-align:middle;
text-align:center;
color:#2D2F44;
margin:0 5px;
}
.pager span::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
top: -8px;
left: 15px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
transition-delay: .7s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager span.current::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
top: -8px;
left: 15px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
transition-delay: .7s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager span.page-numbers.dots span::before{
content: none;
}
.page-numbers.dots span{
right: 9px;
letter-spacing: -8px;
font-size: 16px;
top: 0px;
}
.pager a{
position: relative;
}
.pager a:hover{
position: relative;
color: #fff;
transition: .42s;
}
.pager a::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
top: -8px;
left: 15px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.pager a:hover::before{
content: "";
z-index: -10;
position: absolute;
opacity: 1;
top: -8px;
left: 15px;
display: block;
width: 30px;
min-height: 44px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_pager_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.cat-list ul{
margin-bottom: 0px !important;
}
.cat-list ul li a{
display: none;
letter-spacing: 2px;
line-height: 18px;
}
.cat-list ul li a.on{
display: block;
}
.cat-list ul li a.on {
border-color: #cfe5f9 !important;
color: #2D2F44;
background-color: #fff;
font-weight: bold;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat1::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat1.on::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat2.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat2::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat3.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat3::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat4.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat4::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat5.on::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat5::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat6.on::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: 24px !important;
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat6::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: 24px !important;
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
a.cat1.on::before {
top: 11px;
}
a.cat2.on::before {
top: 12px;
}
a.cat3.on::before {
top: 11px;
}
a.cat4.on::before {
top: 11px;
}
a.cat5.on::before {
top: 10px;
}
a.cat6.on::before {
top: 15px;
}
.cat.choice li::after{
margin-right: 0px;
border-color: #cfe5f9;
color: #2D2F44;
background-color: #fff;
font-weight: bold;
transition: .42s cubic-bezier(.645, .045, .355, 1);
border: solid 2px #d7e8fa;
}
.cat-list.open .choice a::before{
opacity: 1 !important;
}
.cat-list.open ul li a{
border-bottom: none;
}
.cat-list.open a.on::before{
opacity: 0.2;
transition: .42s;
}
.cat-list.open a.on span{
opacity: 0.2;
transition: .42s;
}
.cat.choice li a.cat1::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat1:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat2::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat2:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat3::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat3:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat4::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat4:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: 24px !important;
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat5::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat5:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: 24px !important;
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat6::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: 24px !important;
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat.choice li a.cat6:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: 24px !important;
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat-list ul li a.on:hover {
border-color: #0096DF;
color: #fff;
background-color: #0096DF;
z-index: 60;
}
.cat-list ul li a:hover {
border-color: #0096DF;
color: #fff;
background-color: #0096DF;
z-index: 60;
}
.cat-list .choice li::before{
content: "";
height: 2px;
background-color: #ECECEC;
display: block;
width: 94%;
margin-left: 3%;
top: -2px;
position: absolute;
z-index: 50;
}
.cat-list .choice li:nth-child(1)::before{
z-index: 10;
width: calc(94% - 40px)
}
.cat-list .choice li:hover::before{
display: none;
}
.cat.choice{
margin: 0px 0px !important;
}
.cat.choice li a{
z-index: 30;
position: relative;
}
.cat.choice a::before{ }
.cat.choice li{
position: relative;
}
.cat-list ul.cat.choice{
border: solid 2px #cfe5f9;
border-top: 0px; 
}
.cat.choice li a {
color: #2D2F44;
background-color: #fff;
font-weight: bold;
transition: .42s cubic-bezier(.645, .045, .355, 1);
border: 0px !important;
} .cat.choice li a {
margin-right: 0px;
border-color: #cfe5f9;
color: #2D2F44;
background-color: #fff;
font-weight: bold;
transition: .42s cubic-bezier(.645, .045, .355, 1);
border: solid 2px #d7e8fa;
}
.cat-list ul.cat.choice.show {
display: block;
}
.cat-list ul.cat.choice li a{
display: block; 
font-weight: normal;
transition: .42s 
} }
@media(min-width: 768px){
.sp{
display: none !important;
}
}
.tag-list ul li {
height: 34px;
font-size: 14px;
line-height: 34px;
margin:0 5px 20px;
color: #2D2F44;
text-align: left;
position: relative;
padding-left: 50px;
}
.tag-list ul li a {
font-size: 14px;
display: block;
color: #2D2F44;
text-align: left;
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat-list ul li a.cat1{
padding-left: 24px;
}
.cat-list ul li a.cat2{
padding-left: 23px;
}
.cat-list ul li a.cat3{
padding-left: 24px;
}
.cat-list ul li a.cat4{
padding-left: 25px;
}
.cat-list ul li a.cat5{
padding-left: 27px;
}
.cat-list ul li a.cat6{
padding-left: 28px;
}
.cat1:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: calc((100% - (16px + 64px)) / 2);
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_on.png) center center no-repeat;
background-size: 100% auto;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat1::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: calc((100% - (16px + 64px)) / 2);
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat1.on::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: calc((100% - (16px + 64px)) / 2);
display: block;
width: 16px;
height: 19px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_1_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat2:hover::before,
.cat2.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (18px + 48px)) / 2);
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat2::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (18px + 48px)) / 2);
display: block;
width: 15px;
height: 18px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_2_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat3:hover::before,
.cat3.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (16px + 76px)) / 2);
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat3::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (16px + 76px)) / 2);
display: block;
width: 16px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_3_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat4:hover::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (17px + 43px)) / 2);
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat4:hover::before,
.cat4.on::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (17px + 43px)) / 2);
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat4::before {
content: "";
z-index: 1;
position: absolute;
top: 9px;
left: calc((100% - (17px + 43px)) / 2);
display: block;
width: 17px;
height: 17px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_4_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat5:hover::before,
.cat5.on::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: calc((100% - (19px + 46px)) / 2);
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat5::before {
content: "";
z-index: 1;
position: absolute;
top: 8px;
left: calc((100% - (19px + 46px)) / 2);
display: block;
width: 19px;
height: 20px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_5_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat6:hover::before,
.cat6.on::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: calc((100% - (20px + 30px)) / 2);
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.cat6::before {
content: "";
z-index: 1;
position: absolute;
top: 14px;
left: calc((100% - (20px + 30px)) / 2);
display: block;
width: 20px;
height: 9px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_news_6_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.tag-list li::before{
content: "";
font-size: 25px;
z-index: -10;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 26px;
min-height: 30px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hashtag_off.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
} .tag-list li:hover::before{
content: "";
font-size: 25px;
z-index: 20;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 26px;
min-height: 30px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hashtag_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.tag-list li .on::before{
content: "";
font-size: 25px;
z-index: 20;
position: absolute;
opacity: 1;
left: 25px;
display: block;
width: 26px;
min-height: 30px;
background: url(//www.dk-power.co.jp/wp-content/themes/dkp/img/icon_hashtag_on.png) center center no-repeat;
background-size: 100% auto;
transition: .42s;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
transition: .42s cubic-bezier(.645, .045, .355, 1);
}
.tag-list li:hover {
color: #646464;
transition: .42s cubic-bezier(.645, .045, .355, 1);
} .opa0{
transition: .60s cubic-bezier(.645, .045, .355, 1);
opacity: 0 ;
}
@media (max-width: 767px) {
.content-section{
background: #f9f9f9!important;
}
}
.inner.opa0.opa1{
transition: .60s cubic-bezier(.645, .045, .355, 1);
transition-delay: 0.8s !important;
opacity: 1;
}
.inner{
transition: .60s cubic-bezier(.645, .045, .355, 1);
}
.outer-bg{
overflow: hidden;
}
.content-cover .outer-bg .inner-bg,
.content-bg .outer-bg .inner-bg{
width: 100%;
left: 100%;
background: #f9f9f9;
}
.content-cover.slide .outer-bg .inner-bg,
.content-bg.slide .outer-bg .inner-bg{
transform: translate(-210%, 0%);
border: none;
transition: .80s cubic-bezier(.645, .045, .355, 1) !important;
transition-delay: .70s !important;
}
.content-cover.slide-in .outer-bg .inner-bg,
.content-bg.slide-in .outer-bg .inner-bg{
transform: translate(-100%, 0%);
border: none;
transition: .80s cubic-bezier(.645, .045, .355, 1) !important;
transition-delay: .05s !important;
} @media(min-width: 768px){
.content-bg.slide,
.content-bg.slide .outer-bg{
background: transparent;
border: none;
}
}
.content-bg.slide.slide-in div:nth-child(1), 
.content-cover.slide.slide-in div:nth-child(1) {
border-left: 0;
}
.content-bg.slide.slide-in .outer-bg{
background: transparent;
border-left: 2px solid #E6EEF2;
}
.content-cover.slide,
.content-cover.slide .outer-bg{
background: transparent !important;
border: none !important;
}
.content-cover.slide div::after{
display: none;
}
.nav-inner{
width: 220px;
height: 100vh;
background: #fff;
}
.nav-inner.slide{
transform: translate(-210%, 0%);
transition: .84s cubic-bezier(.645, .045, .355, 1);
transition-delay: .70s;
}
nav{
transition: .84s cubic-bezier(.645, .045, .355, 1);
}  .news-section-title{
font-size: 18px;
font-weight: bold;
}
.news-footer{
font-size: 18px;
font-weight: bold;
float: left;
width: 100%;
position: relative;
}
.article{
margin-bottom: 80px;
}
.news-footer div,
.news-footer a{
display: block;
}
.back-list{
position: absolute;
left: calc((100% - 40px) / 2);
transition: .42s ease-in-out;
color: #2D2F44;
font-weight: 500;
}
a.back-list:hover,
.prev a:hover,
.next a:hover{
color: #0096DF;
transition: .42s ease-in-out;
}
.prev{
position: absolute;
left:0;
transition: .42s ease-in-out;
color: #2D2F44;
font-weight: 500;
}
.next{
position: absolute;
right:0;
transition: .42s ease-in-out;
color: #2D2F44;
font-weight: 500;
}
.prev a{
transition: .42s ease-in-out;
color: #2D2F44;
}
.next a{
transition: .42s ease-in-out;
color: #2D2F44;
}
@media(max-width: 767pc){
.news-article-section{
margin-top: 100px;
}
.news-article-title i{
line-height: 22px;
font-size: 18px;
font-weight: bold;
}
.news-article-date i{
line-height: 16px;
font-size: 16px;
font-weight: normal;
}
.news-article-tax i{
display: block;
float: left;
line-height: 16px;
font-size: 16px;
margin-right: 15px;
margin-bottom: 5px;
font-weight: normal;
}
.news-article-cat a{
letter-spacing: 0.78px;
color: #2D2F44;
}
.news-article-tag a{
letter-spacing: 0.78px;
color: #2D2F44;
}
.news-article-title{
margin-bottom: 18px;
letter-spacing: 1px;
}
.news-article-date{
margin-bottom: 18px;
letter-spacing: 0px;
color: #7b7b7b !important;
}
span.news-article-title{
font-size: 16px;
line-height: 16px;
}
span.news-article-date{
font-size: 16px;
line-height: 16px;
}
span.news-article-tax{
font-size: 14px;
line-height: 14px;
}
.article img{
width: 100%;
height: auto;
margin-bottom: 60px;
margin-top: 80px;
}
.article p{
margin-bottom: 30px;
padding-left: 0px !important;
letter-spacing: 2px;
line-height: 32px;
}
.article h4,
.article h3{
margin-bottom: 30px;
font-size: 18px;
color: #2D2F44;
}
.article h4 span,
.article h3 span{
margin-bottom: 30px;
font-size: 18px;
color: #2D2F44 !important;
letter-spacing: 1px;
}
.article .border{
display: inline-block;
text-decoration: none !important;
}
.article .border::after{
background-color: #D6E8F9; border-radius: 3px; content: "";
display: block;
height: 6px; position: relative;
top: -14px;
z-index: -10;
}
.article .dkp-color{
color: #0096DF !important;
}
.article.content-item{
margin-bottom: 80px;
}
.news-footer{
margin-top: 80px;
}
@media(max-width: 767px){
.news-footer{
margin-top: -20px;
margin-bottom: 40px;
}
}
#news.news-page .inner::after{
display: none;
}
.cat-list ul.cat.choice{
display: none;
height: 242px;
transition: 0s;
}
.news-footer .spacer {
position: absolute;
bottom: 80px;
left: 0;
width: 100%;
}
.news-footer .spacer span {
position: absolute;
top: 0;
left: 0;
height: 2px;
width: 40px;
background: #E6EEF2;
-webkit-transform: translate3d(-50%, -50%, 1px);
transform: translate3d(-50%, -50%, 1px);
}
.news-footer .spacer span:nth-child(2) { left: 33.333333%; }
.news-footer .spacer span:nth-child(3) { left: 66.666666%; }
.news-footer .spacer span:nth-child(4) { left: 100%; }
@media (max-width: 767px) {
.news-footer .spacer { display: none; }
.pager{
margin: 70px auto 10px;
}
}