@charset "UTF-8";
/*============================================================================
*
*	common
*
============================================================================*/
.pc {
  display: block;
}

.pci {
  display: inline-block;
}

.sp {
  display: none;
}

.spi {
  display: none;
}

.autoLeft {
  float: left;
}

.autoRight {
  float: right;
}

@media screen and (max-width: 768px) {
  .sp {
    display: block;
  }

  .spi {
    display: inline-block;
    width: 100%;
    height: auto;
    max-height: auto;
  }

  .pc {
    display: none;
  }

  .pci {
    display: none;
  }

  .swi {
    width: 100%;
    height: auto;
    max-height: auto;
  }
}
/*============================================================================
*
*	base
*
============================================================================*/
.logined {
  width: 83px;
}
.logined img {
  position: relative;
  top: -1px;
  left: 1px;
  width: 50px;
  height: 50px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .logined {
    width: auto;
  }
  .logined img {
    width: 40px;
    height: 40px;
  }
}

#PullMenu {
  position: absolute;
  right: 7px;
  top: 89px;
  z-index: 100;
  width: 205px;
  display: none;
}
#PullMenu .arrow {
  height: 14px;
  position: absolute;
  top: -13px;
  right: 23px;
}
#PullMenu .arrow img {
  vertical-align: top;
}
@media screen and (max-width: 768px) {
  #PullMenu {
    top: 75px;
  }
  #PullMenu .arrow {
    right: 17px;
  }
}
#PullMenu .block {
  border-radius: 8px;
  border: 1px solid #e5e5e5;
  background: #FFFFFF;
  font-size: 14px;
}
#PullMenu .block ul {
  padding: 5px 15px;
  padding-bottom: 2px;
}
#PullMenu .block ul li {
  background: url(../../img/mypage/pullIcon_01.png) no-repeat 0% 50%;
  background-size: 20px 20px;
  padding-left: 24px;
  height: 48px;
  line-height: 48px;
  border-bottom: 1px solid #ebebeb;
}
#PullMenu .block ul li:last-child {
  border-bottom: 0;
}
#PullMenu .block ul li a {
  display: block;
  height: 100%;
  width: 100%;
}
#PullMenu .block ul li.hover a {
  color: #62b891;
}
#PullMenu .block ul li:nth-child(2) {
  background: url(../../img/mypage/pullIcon_02.png) no-repeat 0% 50%;
  background-size: 20px 20px;
}
#PullMenu .block ul li:nth-child(3) {
  background: url(../../img/mypage/pullIcon_03.png) no-repeat 0% 50%;
  background-size: 20px 20px;
}
#PullMenu .block ul li:nth-child(4) {
  background: url(../../img/mypage/pullIcon_04.png) no-repeat 0% 50%;
  background-size: 20px 20px;
}
#PullMenu .block ul li:nth-child(5) {
  background: url(../../img/mypage/pullIcon_05.png) no-repeat 0% 50%;
  background-size: 20px 20px;
}
#PullMenu .block .logout {
  border-top: 1px solid #ebebeb;
  padding-left: 15px;
  height: 50px;
  line-height: 50px;
}
#PullMenu .block .logout a {
  display: block;
  background: url(../../img/mypage/pullIcon_06.png) no-repeat 0% 50%;
  background-size: 20px 20px;
  padding-left: 24px;
}
#PullMenu .block .logout.hover a {
  color: #62b891;
}

/*============================================================================
*
*	Message
*
============================================================================*/
.message {
  padding: 26px 20px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(48, 184, 123, 0.93);
  color: #FFFFFF;
  z-index: 1000000;
  transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -webkit-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transition: all 430ms ease-out;
}
@media screen and (max-width: 768px) {
  .message {
    padding: 22px 20px;
    font-size: 22px;
  }
}

#Message_Error {
  background: rgba(217, 102, 102, 0.93);
}

/*============================================================================
*
*	追加
*
============================================================================*/
@media screen and (max-width: 768px) {
  .sec-message .message-inner__movie {
    padding: 0 15px;
  }
  .sec-message .message-inner__movie iframe {
    width: 100% !important;
  }
}
