/*  =============================

PC

=============================  */
/* Scss Document */
/* Scss Document */
/*  ---------------------------
			MODAL
---------------------------  */
@keyframes disolve {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes slide_amime {
  0% { }
  100% { } }

/*  ---------------------------
			Chara
---------------------------  */
#pc_header .chara_1 {
  animation: chara_1 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -moz-animation: chara_1 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -webkit-animation: chara_1 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -o-animation: chara_1 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -ms-animation: chara_1 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite; }

#pc_header .chara_2 {
  animation: chara_2 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -moz-animation: chara_2 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -webkit-animation: chara_2 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -o-animation: chara_2 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  -ms-animation: chara_2 3s cubic-bezier(0.39, 0.575, 0.565, 1) infinite;
  animation-delay: 1500ms;
  -moz-animation-delay: 1500ms;
  -webkit-animation-delay: 1500ms;
  -o-animation-delay: 1500ms;
  -ms-animation-delay: 1500ms; }

@keyframes chara_1 {
  0% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg); }
  10% {
    transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg); }
  20% {
    transform: rotate(20deg);
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -o-transform: rotate(20deg);
    -ms-transform: rotate(20deg); }
  30% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg); }
  100% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg); } }

@keyframes chara_2 {
  0% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg); }
  10% {
    transform: rotate(20deg);
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -o-transform: rotate(20deg);
    -ms-transform: rotate(20deg); }
  20% {
    transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg); }
  30% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg); }
  100% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg); } }

/*  ---------------------------
			TOP
---------------------------  */
@media screen and (min-width: 767px) {
  #cnt #item .box {
    opacity: 1; }
  #cnt #item .box:hover {
    opacity: 0.8; }
  #cnt #item .box .img .key img {
    transition: 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
    -webkit-transition: 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
    -moz-transition: 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
    -o-transition: 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
    -ms-transition: 0.3s cubic-bezier(0.39, 0.575, 0.565, 1); }
  #cnt #item .box:hover .img .key img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1); }
  #cnt #item .box:hover .arrow {
    transition: 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
    -webkit-transition: 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
    -moz-transition: 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
    -o-transition: 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
    -ms-transition: 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
    border-top: 15px solid transparent;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #ec8323;
    border-right: 15px solid #ec8323; }
    #cnt #item .box:hover .arrow .plus:before, #cnt #item .box:hover .arrow .plus:after {
      width: 1px;
      height: 9px; }
    #cnt #item .box:hover .arrow .plus:before {
      width: 9px;
      height: 1px; } }

/*  ---------------------------
            ABOUT
---------------------------  */
.fadein {
  opacity: 0;
  transition: all 500ms linear; }

.scrollin.fadein {
  opacity: 1; }