@charset "utf-8";

/* ===== セミナー */
UL.event {
  border-top: 1px solid #c9c9c9;
}
UL.event LI {
  border-bottom: 1px solid #c9c9c9;
  padding:8px 0;
}
UL.event DT {
  width:8em;
  color:#333;
  font-size:14px;
  text-decoration:none;
  margin-top:1px;
  float:left;
}
UL.event DD {
  padding-left:8em;
}
UL.event .lb_ico {
  width:4.5em;
  text-decoration:none;
  text-align:center;
  vertical-align:top;
  margin:0 0 0 8px;
  float:right;
}


.main_vi{
  max-width: 1366px;
  position: relative;
}
.slider{
opacity: 0;
transition: 0s;
}
.slick-initialized{
opacity: 1
}

.slick-dots{
  bottom: 0;
}

.slick-dots li{
  width: 14px;
  height: 14px;
overflow: hidden;
padding: 0;
border-radius: 50%;
background: none;
}

.slick-dots li button{
width: 14px;
height: 14px;
background-color: rgba(255,255,255, 0);
}

.slick-dots li.slick-active button{
  background-color: rgba(255,255,255, 1);
}

.slick-dots li button::before{
  opacity: 1;
  width: 8px;
  height: 8px;
  content: "";
  background: #ffffff;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 8px;
  transform: translate(-50%, -53%);
}

.slick-dots li.slick-active{
  background: none;
  /*clip-path: circle(9px at center);*/
}

.slick-dots li.slick-active button::before{
  content: "";
  width: 8px;
  height: 8px;
  background: #cf142b;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
  opacity: 1;
  transform: translate(-50%, -53%);
}

.slick-dots .slick-active::before{
content: "" !important;
display: block;
position: absolute;
top: 0;
left: -7px;
width: 14px;
height: 14px;
background: #9B9B9B;
transform-origin: right 7px;
z-index: 2;
animation: rotate-circle-left 4.8s linear forwards;
}

.slick-dots .slick-active::after{
content: "";
display: block;
position: absolute;
top: 0px;
left: 7px;
width: 14px;
height: 14px;
background: #9B9B9B ;
transform-origin: left 7px;
z-index: 3;
animation: rotate-circle-right 4.8s linear forwards;
}
.stop .slick-active::before,
.stop .slick-active::after{
animation-play-state: paused;
}
.once .slick-active::before,
.once .slick-active::after{
  animation-delay: -1s;
}

@keyframes rotate-circle-right {
0%   {
    transform: rotate(0deg);
    background: #9B9B9B;
}
50%  {
    transform: rotate(180deg);
    background: #9B9B9B;
}
50.01% {
    transform: rotate(360deg);
    background: #fff;
}
100% {
    transform: rotate(360deg);
    background: #fff;
}
}

@keyframes rotate-circle-left {
0%   { transform: rotate(0deg); }
50%  { transform: rotate(0deg); }
100% { transform: rotate(180deg); }
}

@media (max-width:640px) {
}

.slider_buttons{
  width: 11px;
  position: absolute;
  bottom: 8px;
  left: calc(50% - 79px);
}

.js-play{
  display: none;
}

@media (min-width:641px) {
  .slider_buttons div:hover{
    cursor: pointer;
  }
}

.split.business{
  margin-bottom: 1em;
}

.split .textbox{
  display: flex;
  justify-content: center;
  align-items: center;
  background: url("/-/Media/Ricoh/Sites/co_jp/iwb/img/bg_business.png") top left no-repeat;
  background-size: auto 100%;
}

.split.education .textbox{
  background: url("/-/Media/Ricoh/Sites/co_jp/iwb/img/bg_education.png") top right no-repeat;
  background-size: auto 100%;
}

.split .text_wrap{
  padding: 1.75em 1.25em;
  background: #ffffff;
  box-sizing: border-box;
}

.split .text_wrap .label{
  color: #ffffff;
  display: inline-block;
  padding: 4px 8px;
  margin-bottom: 0.5rem;
}

.split.business .text_wrap .label{
  background-color: #217892;
}
.split.education .text_wrap .label{
  background-color: #f39700;
}

.split .text_wrap h3{
  font-size: 1.75em;
  font-weight: bold;
  margin-bottom: 0.5rem;
}

.split .text_wrap .link_btn a{
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  color: #fff;
  text-decoration: none;
  display: inline-block;
  border-radius: 8px;
  background-color: #0d63dc;
}

.split.education .text_wrap .link_btn a{
  background-color: #ff6110;
}

.split .text_wrap .link_btn a:hover{
  background-color: #0b51b3;
}
.split.education .text_wrap .link_btn a:hover{
  background-color: #e65400;
}

.split .text_wrap .link_btn a:link{
  color: #ffffff;
  text-decoration: none;
  padding: 10px 3em 8px 2.5em;
}
.split .text_wrap .link_btn a span{
  position: relative;
}
.split .text_wrap .link_btn a span::before{
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  right: -1em;
  width: 8px;
  height: 8px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.split img{
  width: 100%;
}

.slick-dotted.slick-slider{
  margin-bottom: 40px;
}

.cate_business{
  background-color: #217892;
  color: #ffffff;
}
.cate_education{
  background-color: #f39700;
  color: #ffffff;
}

@media (min-width:641px) {
  .split{
    display: flex;

  }
  .split .left_box,
  .split .right_box{
    width: 50%;
  }
  .split .left_box{
    order: 1;
  }
  .split .right_box{
    order: 2;
  }
}

@media (max-width:640px) {
  .split{
    width: calc(100% - 16px);
    margin: 0 auto;
  }

  .split .text_wrap{
    width: 90%;
  }

  .split .textbox{
    padding: 1.25em 0;
  }
}