@charset "UTF-8";
/*common
----------------------------------------------------*/
/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
font
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
.adobe-font-vdl-logo {
  font-family: vdl-logog,sans-serif;
  font-weight: 400;
  font-style: normal; }

.adobe-font-orator {
  font-family: orator-std,monospace;
  font-weight: 400;
  font-style: normal; }


/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
btn
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
.btn {
  position: relative;
  display: inline-block;
  font-size: 2.0rem;
  font-weight: bold;
  letter-spacing: 0.04em;
  color: #000;
  background-color: #edab2f;
  border: 3px solid #edab2f;
  transition: all .3s ease-in-out; }

.btn::before {
  position: absolute;
  top: 50%;
  right: 30px;
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  transform: translateY(-50%) rotate(45deg);
  transition: all .3s ease-in-out;
  vertical-align: 1px; }

.btn::after {
  position: absolute;
  top: 50%;
  right: 38px;
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  transform: translateY(-50%) rotate(45deg);
  transition: all .3s ease-in-out;
  vertical-align: 1px; }

.btn:hover {
  background: #fff; }

@keyframes arrow {
  0% {
    left: 7px;
    opacity: 0; }
  10% {
    left: 7px;
    opacity: 0; }
  30% {
    left: 13px;
    opacity: 1; }
  50% {
    left: 13px;
    opacity: 1; }
  70% {
    left: 13px;
    opacity: 1; }
  90% {
    left: 19px;
    opacity: 0; }
  100% {
    left: 19px;
    opacity: 0; } }
.animation-arrow {
  animation: arrow 1.5s ease-in-out infinite; }

.btn-news {
  width: 200px;
  padding: 10px 0 10px 40px; }






/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
wave-animation
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
#wave-animation {
  width: 100%;
  height: 40px;
  position: absolute;
  top: 0px; }

#wave-animation svg {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 40px;
  overflow: hidden; }

#wave-animation .wave {
  animation: wave 3s linear;
  animation-iteration-count: infinite;
  fill: #fff; }

#wave-animation #wave-front {
  animation-duration: 5s;
  animation-direction: reverse;
  fill: linear-gradient(#00ff00 10%, red 15%); }

#wave-animation #wave-back {
  animation-duration: 7s;
  opacity: .3; }

@keyframes wave {
  to {
    transform: translateX(-100%); } }
/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
PC-nav
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
.pc-nav {
  position: relative;
}
 
  .pc-nav .nav-ul {
    display: flex;
    justify-content: center;
    max-width: 100%;
    margin: 0 auto; 
    background-color: rgba(143,190,61,0.6);
	 padding: 20px 0;
}


    .pc-nav .nav-ul li {
      flex-grow: 1;
	  text-decoration: none;
      text-align: center; }
      .pc-nav .nav-ul li a {
        display: block;
        font-size: 1.8rem;
        font-weight: bold;
        color: #fff;
        transition: .3s;
        padding: 10px 1%; }

    .pc-nav .nav-ul a:hover {
      color: #1A8169; }

@media only screen and (max-width: 990px) {
  .pc-nav .nav-ul li a {
    font-size: 1.3rem;
    letter-spacing: 0; } }
@media only screen and (max-width: 768px) {
  .pc-nav .nav-ul {
    flex-wrap: wrap; 
	}

  .pc-nav .nav-ul li {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: initial;
    text-align: center;
    width: 33.3333%; }

  .pc-nav .nav-ul li:last-child {
  }

  .pc-nav .nav-ul li a {
    border-right: none;
    background: #00BEF0;
    color: #fff;
    border: solid #fff 1px; }

  .pc-nav .nav-ul li:first-child a {
    border-left: none; } }
@media only screen and (max-width: 768px) {
  .pc-nav .nav-ul li {
    width: 50%; } }

@media screen and (max-width: 768px) {
	.pc-nav .nav-ul {
		display: none;
	}
	.pc-nav {
		padding-top: 0px;
		padding-bottom: 0px;
	}
}
/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
footer-nav
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
.footer-nav {
  position: relative;
  padding-top: 30px;
  padding-bottom: 20px; }
  .footer-nav .footer-nav-ul {
    display: flex;
    justify-content: center;
    width: 85%;
    margin: 0 auto; }
    .footer-nav .footer-nav-ul li {
      flex-grow: 1;
      text-align: center; }
      .footer-nav .footer-nav-ul li a {
        display: block;
        font-size: 1.8rem;
        font-weight: bold;
        color: #00BEF0;
        transition: .3s;
        border-right: solid #00BEF0 1px;
        padding: 10px 1%; }
    .footer-nav .footer-nav-ul li:first-child a {
      border-left: solid #00BEF0 1px; }
    .footer-nav .footer-nav-ul a:hover {
      background: #00BEF0;
      color: #fff; }

@media only screen and (max-width: 990px) {
  .footer-nav .footer-nav-ul li a {
    font-size: 1.3rem;
    letter-spacing: 0; } }
@media only screen and (max-width: 768px) {
  .footer-nav .footer-nav-ul {
    flex-wrap: wrap; }

  .footer-nav .footer-nav-ul li {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: initial;
    text-align: center;
    width: 33.3333%; }

  .footer-nav .footer-nav-ul li:last-child {
}

  .footer-nav .footer-nav-ul li a {
    border-right: none;
    background: #00BEF0;
    color: #fff;
    border: solid #fff 1px; }

  .footer-nav .footer-nav-ul li:first-child a {
    border-left: none; } 

}

@media only screen and (max-width: 990px) {
.stt-lang-select{
    display: block!important;
}
}

@media only screen and (max-width: 768px) {
  .footer-nav .footer-nav-ul li {
    width: 50%; } }
/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
PC-モーダルナビ
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
/*----------------------------
* メニュー開閉ボタン
*----------------------------*/
.pc-menu-btn {
  position: fixed;
  top: 7px;
  right: 20px;
  z-index: 30;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #00BEF0;
  color: #fff;
  border-radius: 50%; 
	display: none;
}

.pc-btn-menu {
  position: relative;
  top: 8px;
  cursor: pointer; }

.pc-btn-menu .span-boder {
  display: block;
  width: 20px;
  height: 3px;
  background: #FFF;
  margin: 0 auto;
  transition: .5s;
  margin-top: 4px; }

/*----------------------------
* open時　バツ印
*----------------------------*/
.active_hunberger .span-boder-one {
  transform: rotate(-45deg);
  width: 20px;
  left: 0px;
  bottom: -7px;
  position: relative; }

.active_hunberger .span-boder-three {
  transform: rotate(45deg);
  width: 20px;
  left: 0px;
  bottom: 7px;
  position: relative; }

.active_hunberger .span-boder-two {
  opacity: 0; }

/*----------------------------
* メニュー本体
*----------------------------*/
.menu {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 20;
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #00BEF0; }

.menu__item {
  width: 100%;
  height: auto;
  padding: .5em 1em;
  text-align: center;
  color: #fff;
  box-sizing: border-box; }
  .menu__item a {
    color: #fff;
    font-size: 2rem;
    font-weight: bold;
    transition: .3s; }

.menu__item a:hover {
  color: #f1ce5f; }

/*----------------------------
* アニメーション部分
*----------------------------*/
/* アニメーション前のメニューの状態 */
.menu {
  pointer-events: none;
  opacity: 0;
  transform-origin: center;
  transform: scale(0.5);
  transition: all .3s ease; }

/* アニメーション後のメニューの状態 */
.menu.is-active {
  pointer-events: auto;
  opacity: 1;
  transform: scale(1); }

/*
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
btnfixed
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
*/
.btn-fix {
    position: fixed;
    top: calc(50% - 290px);
    right: 0;
    z-index: 5;
}
@media screen and (max-width: 990px) {
.btn-fix {
    display: none;
}
	
	.pc-menu-btn {
		display: block;
	}
}