@charset "UTF-8";

.p-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  z-index: 100;
}

.p-header__logo {
  position: absolute;
  top: 8px;
  left: 24px;
  width: clamp(200px, 23.3528550512vw, 319px);
  height: auto;
  z-index: 100;
}

.p-header__nav {
  display: none;
  position: fixed;
  top: 12px;
  right: 10px;
  -webkit-column-gap: 35px;
     -moz-column-gap: 35px;
          column-gap: 35px;
}
@media screen and (min-width:1024px) {
  .p-header__nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.p-header__menu-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 30px;
     -moz-column-gap: 30px;
          column-gap: 30px;
}
.p-header__menu-list .c-link {
  padding-block: 13px;
}

.p-header__menu-text {
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 1.12px;
  font-weight: 600;
}

.p-header__btn {
  display: block;
  width: 200px;
  height: 46px;
  color: #ffffff;
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 1.12px;
  background: -webkit-gradient(linear, left top, right top, from(#dce358), to(#0085ce));
  background: linear-gradient(90deg, #dce358 0%, #0085ce 100%);
  border-radius: 23px;
  position: relative;
}
.p-header__btn::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: transparent -webkit-gradient(linear, left top, right top, from(#0085ce), to(#dce358)) 0% 0% no-repeat padding-box;
  background: transparent linear-gradient(90deg, #0085ce 0%, #dce358 100%) 0% 0% no-repeat padding-box;
  opacity: 1;
  border-radius: 23px;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
@media (any-hover: hover) {
  .p-header__btn:hover {
    cursor: pointer;
  }
  .p-header__btn:hover .p-header__btn-text {
    color: #ffffff;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  .p-header__btn:hover::after {
    opacity: 0;
  }
}

.p-header__btn-text {
  padding-left: 20px;
  padding-block: 13px;
  font-weight: 700;
  position: relative;
  z-index: 2;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.p-header__btn-text::before {
  content: "";
  position: absolute;
  width: 34px;
  height: 34px;
  top: 6px;
  right: 6px;
  background: url("../images/header-btn-arrow.svg") center/contain no-repeat;
  z-index: 2;
}