/***** header-nav *****/
header .inner {
  position: relative; }
  header .inner .nav-pc {
    display: none; }
    @media screen and (min-width: 1024px) {
      header .inner .nav-pc {
        display: block;
        width: 100%;
        z-index: 1000; }
        header .inner .nav-pc ul#g-nav {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          position: absolute;
          bottom: 20px;
          line-height: 0;
          column-gap: calc(20px * 1.5);
          width: 100%; }
          header .inner .nav-pc ul#g-nav > li {
            cursor: pointer;
            font-family: 'M PLUS 1p', sans-serif;
            font-size: 1.75rem;
            line-height: 0;
            padding: 20px 0;
            position: relative;
            transform: rotate(0.05deg); }
            header .inner .nav-pc ul#g-nav > li:before, header .inner .nav-pc ul#g-nav > li:after {
              content: '';
              display: block;
              height: 2px;
              position: absolute;
              left: 0;
              bottom: 0; }
            header .inner .nav-pc ul#g-nav > li:before {
              background: #f5c700;
              width: 100%; }
            header .inner .nav-pc ul#g-nav > li:after {
              background: #009ad7;
              width: 100%;
              transition: all 0.5s; }
            header .inner .nav-pc ul#g-nav > li:hover:after {
              width: 0;
              transition: all 0.5s; }
            header .inner .nav-pc ul#g-nav > li .sub-nav {
              position: absolute;
              left: 50%;
              -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
              top: calc(50px * 0.85);
              font-size: 1.6rem;
              display: none;
              width: 600px;
              z-index: 3; }
              header .inner .nav-pc ul#g-nav > li .sub-nav ul {
                background: #FFF;
                -webkit-border-radius: 5px;
                -moz-border-radius: 5px;
                border-radius: 5px;
                box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
                column-gap: 5%;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -ms-flex-wrap: wrap;
                flex-wrap: wrap;
                padding: 20px;
                padding-bottom: 0; }
                header .inner .nav-pc ul#g-nav > li .sub-nav ul:after {
                  content: url("../images/g-nav_bg_arw.svg");
                  display: block;
                  color: #FFF;
                  height: 20px;
                  width: 20px;
                  position: absolute;
                  left: 50%;
                  -webkit-transform: translateX(-50%);
                  transform: translateX(-50%);
                  top: -15px;
                  z-index: 999; }
                header .inner .nav-pc ul#g-nav > li .sub-nav ul li {
                  background: #F3F3F3;
                  -webkit-border-radius: 5px;
                  -moz-border-radius: 5px;
                  border-radius: 5px;
                  display: -webkit-box;
                  display: -ms-flexbox;
                  display: flex;
                  -webkit-box-pack: center;
                  -ms-flex-pack: center;
                  justify-content: center;
                  -webkit-box-align: center;
                  -ms-flex-align: center;
                  align-items: center;
                  margin-bottom: 20px;
                  width: 47.5%; }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#property, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#renovation, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#residential, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#faq, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#rental, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#brokerage, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#company, header .inner .nav-pc ul#g-nav > li .sub-nav ul li#business {
                    background-position: right 2.5% bottom 0;
                    background-repeat: no-repeat;
                    background-size: 75px;
                    transition: all .5s; }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#property {
                    background-image: url("../images/g-nav_bg_property.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#renovation {
                    background-image: url("../images/g-nav_bg_renovation.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#residential {
                    background-image: url("../images/g-nav_bg_residential.svg");
                    background-size: 150px; }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#faq {
                    background-image: url("../images/g-nav_bg_faq.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#rental {
                    background-image: url("../images/g-nav_bg_rental.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#brokerage {
                    background-image: url("../images/g-nav_bg_brokerage.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#company {
                    background-image: url("../images/g-nav_bg_company.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li#business {
                    background-image: url("../images/g-nav_bg_business.svg"); }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li:hover {
                    background-color: #009ad7;
                    transition: all .5s;
                    opacity: 1; }
                  header .inner .nav-pc ul#g-nav > li .sub-nav ul li a {
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                    line-height: 120%;
                    min-height: 10rem;
                    padding: 30px 0;
                    position: relative;
                    text-align: center;
                    width: 100%; }
                    header .inner .nav-pc ul#g-nav > li .sub-nav ul li a:hover span {
                      text-shadow: 0 0 3px #0099d6;
                      color: #FFF; }
                    header .inner .nav-pc ul#g-nav > li .sub-nav ul li a span {
                      width: 100%; }
                      header .inner .nav-pc ul#g-nav > li .sub-nav ul li a span > span {
                        display: inline-block;
                        font-size: 1rem; }
        header .inner .nav-pc ul#g-nav-sub {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: flex-end;
          -ms-flex-pack: flex-end;
          justify-content: flex-end;
          column-gap: 20px;
          position: absolute;
          right: 20px;
          top: 20px; }
          header .inner .nav-pc ul#g-nav-sub li a {
            background: #F3F3F3;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            display: block;
            font-family: 'M PLUS 1p', sans-serif;
            font-size: 1.25rem;
            line-height: 0;
            padding: calc(20px * .75);
            position: relative;
            transform: rotate(0.05deg);
            width: 12.5rem;
            text-align: center;
            transition: all .5s; }
            header .inner .nav-pc ul#g-nav-sub li a:hover {
              background: #009ad7;
              color: #FFF;
              transition: all .5s;
              opacity: 1; } }
  header .inner .nav-mobile {
    display: block; }
    @media screen and (min-width: 1024px) {
      header .inner .nav-mobile {
        display: none; } }
    header .inner .nav-mobile .menu-trigger,
    header .inner .nav-mobile .menu-trigger span {
      display: inline-block;
      transition: all .4s; }
    header .inner .nav-mobile .menu-trigger {
      cursor: pointer;
      position: absolute;
      width: 25px;
      height: 23px;
      z-index: 1001; }
      @media screen and (max-width: 767px) {
        header .inner .nav-mobile .menu-trigger {
          top: calc(20px * 1.0);
          right: 5%; } }
      @media screen and (min-width: 768px) and (max-width: 1023px) {
        header .inner .nav-mobile .menu-trigger {
          top: calc(20px * 1.25);
          right: 2.5%; } }
    header .inner .nav-mobile .menu-trigger span {
      position: absolute;
      left: 0;
      width: 100%;
      height: 3px;
      background-color: #009ad7; }
      header .inner .nav-mobile .menu-trigger span:nth-of-type(1) {
        top: 0; }
      header .inner .nav-mobile .menu-trigger span:nth-of-type(2) {
        top: 10px; }
      header .inner .nav-mobile .menu-trigger span:nth-of-type(3) {
        bottom: 0; }
    header .inner .nav-mobile .menu-trigger.active span:nth-of-type(1) {
      transform: translateY(10px) rotate(-45deg); }
    header .inner .nav-mobile .menu-trigger.active span:nth-of-type(2) {
      opacity: 0; }
    header .inner .nav-mobile .menu-trigger.active span:nth-of-type(3) {
      transform: translateY(-10px) rotate(45deg); }
    header .inner .nav-mobile #g-nav-m {
      animation: fadeIn 1s ease-in-out forwards;
      background: rgba(255, 255, 255, 0.95);
      display: none;
      font-family: 'M PLUS 1p', sans-serif;
      position: relative;
      padding: 100px 5% 0;
      overflow-y: scroll;
      height: 100vh;
      width: 100vw;
      transform: rotate(0.05deg); }
      header .inner .nav-mobile #g-nav-m .toggle {
        display: none; }
      header .inner .nav-mobile #g-nav-m .wrap {
        border-bottom: 1px solid #DDD;
        position: relative; }
      header .inner .nav-mobile #g-nav-m .title,
      header .inner .nav-mobile #g-nav-m .content {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transform: translateZ(0);
        transition: all 0.3s; }
      header .inner .nav-mobile #g-nav-m .title {
        display: block;
        padding: 1.5em 0; }
        header .inner .nav-mobile #g-nav-m .title::after, header .inner .nav-mobile #g-nav-m .title::before {
          content: "";
          position: absolute;
          right: 0.75em;
          top: 1.75em;
          width: 2px;
          height: 0.75em;
          background-color: #AAA;
          transition: all 0.3s; }
        header .inner .nav-mobile #g-nav-m .title::after {
          transform: rotate(90deg); }
      header .inner .nav-mobile #g-nav-m .content {
        max-height: 0;
        margin: 0;
        overflow: hidden; }
        header .inner .nav-mobile #g-nav-m .content ul {
          line-height: 100%;
          padding: 20px 0; }
          header .inner .nav-mobile #g-nav-m .content ul li {
            margin-bottom: 5px; }
            header .inner .nav-mobile #g-nav-m .content ul li.blank a:before {
              content: url("../images/icn_blank_gray.svg");
              display: inline-block;
              margin: 0 10px 5px 0;
              vertical-align: middle;
              height: 12px;
              width: 12px; }
            header .inner .nav-mobile #g-nav-m .content ul li > a {
              display: block;
              margin: 0;
              padding: 0.25rem 0;
              width: 100%; }
              header .inner .nav-mobile #g-nav-m .content ul li > a:before {
                content: url("../images/icn_arw_rev.svg");
                display: inline-block;
                margin: 0 5px 5px 0;
                vertical-align: middle;
                height: 16px;
                width: 16px; }
                header .inner .nav-mobile #g-nav-m .content ul li > a:before > a {
                  display: block;
                  margin: 0;
                  padding: 0.25rem 0;
                  width: 100%; }
                  header .inner .nav-mobile #g-nav-m .content ul li > a:before > a:before {
                    content: none;
                    display: inline-block;
                    margin: 0;
                    height: auto;
                    width: auto; }
              header .inner .nav-mobile #g-nav-m .content ul li > a span {
                font-size: 1rem; }
            header .inner .nav-mobile #g-nav-m .content ul li > ul {
              padding-left: 5%; }
            header .inner .nav-mobile #g-nav-m .content ul li dl {
              margin: 0 0 2rem 2rem; }
              header .inner .nav-mobile #g-nav-m .content ul li dl:last-child {
                margin-bottom: 0; }
              header .inner .nav-mobile #g-nav-m .content ul li dl dt {
                margin-bottom: 10px; }
              header .inner .nav-mobile #g-nav-m .content ul li dl dd > a {
                display: block;
                margin: 0;
                padding: 0.25rem 0;
                width: 100%; }
                header .inner .nav-mobile #g-nav-m .content ul li dl dd > a:before {
                  content: url("../images/icn_arw_rev.svg");
                  display: inline-block;
                  margin: 0 5px 5px 0;
                  vertical-align: middle;
                  height: 16px;
                  width: 16px; }
              header .inner .nav-mobile #g-nav-m .content ul li dl dd.split {
                margin: 0;
                padding: 0.25rem 0; }
                header .inner .nav-mobile #g-nav-m .content ul li dl dd.split:before {
                  content: url("../images/icn_arw_rev.svg");
                  display: inline-block;
                  margin: 0 5px 5px 0;
                  vertical-align: middle;
                  height: 16px;
                  width: 16px; }
                header .inner .nav-mobile #g-nav-m .content ul li dl dd.split > a {
                  display: inline;
                  margin: 0;
                  padding: 0;
                  width: auto; }
                  header .inner .nav-mobile #g-nav-m .content ul li dl dd.split > a:before {
                    content: none; }
                  header .inner .nav-mobile #g-nav-m .content ul li dl dd.split > a > a:before {
                    content: none;
                    display: inline-block;
                    margin: 0;
                    height: auto;
                    width: auto; }
      header .inner .nav-mobile #g-nav-m .toggle:checked + .title + .content {
        max-height: 500px;
        transition: all 1.5s; }
      header .inner .nav-mobile #g-nav-m .toggle:checked + .title::before {
        transform: rotate(90deg) !important; }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
