/**
 * Foundation for Sites by ZURB
 * Version 6.4.4-rc1
 * foundation.zurb.com
 * Licensed under MIT Open Source
 */
.gray {
  color: #868686; }

.orange {
  color: #ea5413; }

nav[aria-label="Breadcrumbs"] {
  width: calc(100% - 40px); }

body {
  min-height: 100vh;
  width: 100%; }

.img-ref {
  position: relative; }

.img-deco {
  position: absolute;
  top: 0;
  left: 0; }

.cloud_area {
  width: 100%;
  overflow-x: hidden;
  background: -webkit-gradient(linear, left top, left bottom, from(#23b685), to(#fefefe));
  background: linear-gradient(top, #23b685, #fefefe);
  background: -ms-linear-gradient(top, #23b685, #fefefe); }
  .cloud_area .main-visual {
    position: relative;
    z-index: 10;
    margin: 105px auto 0;
    max-width: 1920px; }
    .cloud_area .main-visual::before {
      content: "";
      display: block;
      padding-top: 34%; }
  .cloud_area .img-left-1 {
    top: 1%;
    left: 28%;
    max-width: 12%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 2.5s forwards;
            animation: showBuilding 0.5s 2.5s forwards; }
  .cloud_area .img-left-2 {
    top: 1.25%;
    left: 19%;
    max-width: 10%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 2.9s forwards;
            animation: showBuilding 0.5s 2.9s forwards; }
  .cloud_area .img-left-3 {
    top: 15%;
    left: 11%;
    max-width: 12%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 3.3s forwards;
            animation: showBuilding 0.5s 3.3s forwards; }
  .cloud_area .img-left-4 {
    top: -3%;
    left: 1%;
    max-width: 13%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 3.7s forwards;
            animation: showBuilding 0.5s 3.7s forwards; }
  .cloud_area .img-right-1 {
    top: 2%;
    left: 63%;
    max-width: 16%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 2.7s forwards;
            animation: showBuilding 0.5s 2.7s forwards; }
  .cloud_area .img-right-2 {
    top: 23%;
    left: 76%;
    max-width: 12%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 3.1s forwards;
            animation: showBuilding 0.5s 3.1s forwards; }
  .cloud_area .img-right-3 {
    top: 26%;
    left: 88%;
    max-width: 12%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 3.5s forwards;
            animation: showBuilding 0.5s 3.5s forwards; }
  .cloud_area .img-right-4 {
    top: 2%;
    left: 78%;
    max-width: 23%;
    opacity: 0;
    -webkit-animation: showBuilding 0.5s 3.9s forwards;
            animation: showBuilding 0.5s 3.9s forwards; }
  .cloud_area .building {
    -webkit-transform: scale(0);
            transform: scale(0);
    -webkit-transform-origin: center 90%;
            transform-origin: center 90%;
    -webkit-animation: buildBuilding .5s forwards;
            animation: buildBuilding .5s forwards; }
  .cloud_area .building-1 {
    top: 33.98%;
    left: 16.84%;
    max-width: 56.84%;
    -webkit-animation-delay: 2.9s;
            animation-delay: 2.9s; }
  .cloud_area .building-2 {
    max-width: 55.36%;
    -webkit-animation-delay: 3.3s;
            animation-delay: 3.3s; }
  .cloud_area .building-3 {
    left: 11.58%;
    max-width: 60.32%;
    -webkit-animation-delay: 3.9s;
            animation-delay: 3.9s; }
  .cloud_area .building-4 {
    top: 37.33%;
    left: 20.65%;
    max-width: 51.42%;
    -webkit-animation-delay: 3.8s;
            animation-delay: 3.8s; }
  .cloud_area .building-5 {
    top: 70.33%;
    left: 40.08%;
    max-width: 48.18%;
    -webkit-animation-delay: 3.7s;
            animation-delay: 3.7s; }
  .cloud_area .building-6 {
    left: 56.87%;
    max-width: 30.99%;
    -webkit-animation-delay: 2.7s;
            animation-delay: 2.7s; }
  .cloud_area .building-7 {
    left: 22.03%;
    max-width: 60.17%;
    -webkit-animation-delay: 3.1s;
            animation-delay: 3.1s; }
  .cloud_area .building-8 {
    left: 13.14%;
    max-width: 63.56%;
    -webkit-animation-delay: 3.5s;
            animation-delay: 3.5s; }
  .cloud_area .building-9 {
    top: 3.61%;
    left: 37.47%;
    max-width: 33.86%;
    -webkit-animation-delay: 3.9s;
            animation-delay: 3.9s; }
  .cloud_area .building-10 {
    top: 4.82%;
    left: 77.65%;
    max-width: 33.86%;
    -webkit-animation-delay: 4s;
            animation-delay: 4s; }
  .cloud_area .magnifier {
    -webkit-animation: slashMove_mirror 10s infinite;
            animation: slashMove_mirror 10s infinite; }
  .cloud_area .cloud-box {
    opacity: 0;
    -webkit-animation: showBuilding 1s 4.1s forwards;
            animation: showBuilding 1s 4.1s forwards; }
  .cloud_area .cloud-1,
  .cloud_area .cloud-2,
  .cloud_area .cloud-3,
  .cloud_area .cloud-4 {
    -webkit-animation: slashMove 10s infinite;
            animation: slashMove 10s infinite; }
  .cloud_area .cloud-1,
  .cloud_area .cloud-2 {
    top: -4%;
    max-width: 37%; }
  .cloud_area .cloud-1 {
    left: -1%; }
  .cloud_area .cloud-2 {
    top: 3%;
    -webkit-animation-delay: 0.4s;
            animation-delay: 0.4s; }
  .cloud_area .cloud-3,
  .cloud_area .cloud-4 {
    top: -4%;
    left: auto;
    right: 0;
    max-width: 52%;
    -webkit-animation-delay: 0.1s;
            animation-delay: 0.1s; }
  .cloud_area .cloud-4 {
    top: -7%;
    -webkit-animation-delay: 0.8s;
            animation-delay: 0.8s; }
  .cloud_area .img-line {
    max-width: 50vw; }
    .cloud_area .img-line .img-deco {
      width: 100%;
      height: 100%;
      background-size: 50vw;
      background-repeat: no-repeat;
      -webkit-animation: lineShowLeft 3s;
              animation: lineShowLeft 3s; }
  .cloud_area .img-line-ref {
    opacity: 0; }
  .cloud_area .img-line-right {
    left: auto;
    right: 0; }
    .cloud_area .img-line-right .img-deco {
      left: auto;
      right: 0;
      background-position: right center; }

.island_area {
  width: 100%;
  margin-top: -150px;
  position: relative;
  z-index: 999; }
  .island_area .island_center_box::before {
    content: "";
    display: block;
    padding-top: 23%; }
  .island_area .island_center_box {
    width: 1280px;
    margin: 0 auto -4px auto;
    position: relative;
    z-index: 999; }

.bread_area {
  padding: 12px 0 0 0; }
  .bread_area .bread_center {
    width: 1320px; }

.page_title {
  position: relative;
  z-index: 20; }
  .page_title.no_top {
    margin: 0 auto;
    padding: 0 0 20px 0;
    margin-top: 20px; }

.page_article {
  width: 100%;
  position: relative;
  z-index: 999; }
  .page_article .article_center {
    width: 1340px;
    margin: 0 auto 0px auto;
    padding: 17px 20px 20px 20px;
    background: #fff;
    border-radius: 10px;
    position: relative; }

.footerbar .footer_top {
  border-top: 1px solid #ccc; }

.result-area {
  z-index: 1000; }

.search-input-box {
  position: absolute;
  bottom: 19%;
  width: 80%;
  left: 50%;
  -webkit-transform: translateX(-49%);
          transform: translateX(-49%);
  font-size: 0;
  -webkit-box-shadow: 14px 14px 20px rgba(13, 36, 28, 0.2), 0 0 10px rgba(225, 255, 245, 0.2);
          box-shadow: 14px 14px 20px rgba(13, 36, 28, 0.2), 0 0 10px rgba(225, 255, 245, 0.2);
  border-radius: 10px; }
  .search-input-box > div:first-child {
    width: 70%;
    display: inline-block; }
  .search-input-box input {
    padding: 13px 10px;
    width: 100%;
    border: none;
    -webkit-box-shadow: none;
            box-shadow: none;
    border-radius: 10px 0 0 10px;
    font-size: 16px; }
  .search-input-box .btn {
    position: relative;
    width: 30%;
    height: 50px;
    line-height: 50px;
    background: #023894;
    color: #fff;
    border-radius: 0 10px 10px 0;
    font-size: 16px;
    cursor: pointer;
    -webkit-transition: background .3s, -webkit-box-shadow .3s;
    transition: background .3s, -webkit-box-shadow .3s;
    transition: box-shadow .3s, background .3s;
    transition: box-shadow .3s, background .3s, -webkit-box-shadow .3s; }
    .search-input-box .btn::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: 2px solid #6a9ce7;
      border-radius: 0 10px 10px 0; }
    .search-input-box .btn:hover, .search-input-box .btn:focus {
      background: #012562;
      -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
              box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); }

.search-filter {
  position: relative; }
  .search-filter .search-filter-list {
    position: absolute;
    z-index: 5;
    top: 100%;
    left: 0;
    margin: 0;
    padding-left: 0;
    width: 100%;
    border: 1px solid #ccc;
    border-top: 0;
    font-size: 16px;
    -webkit-box-shadow: 0 0 5px #cacaca;
    box-shadow: 0 0 5px #cacaca;
    background: #fefefe;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    max-height: 0;
    opacity: 0;
    border-width: 0;
    -webkit-transition: max-height 0.3s 1s;
    transition: max-height 0.3s 1s; }
    .search-filter .search-filter-list li {
      display: block;
      padding: 0.5rem;
      cursor: default; }
      .search-filter .search-filter-list li.is--selected {
        background: #eeeeee; }
  .search-filter .search-filter-input:focus ~ .search-filter-list {
    overflow-y: auto;
    max-height: 15.375rem;
    opacity: 1;
    border-width: 1px;
    -webkit-transition: max-height 0s 0s;
    transition: max-height 0s 0s; }
  @media screen and (min-width: 64em) {
    .search-filter .search-filter-list li {
      padding: .5rem 30px; } }

.result-status {
  color: #868686; }
  .result-status em {
    color: #023894;
    font-style: normal; }

.result-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid #cbcbcb;
  border-radius: 10px;
  height: 50px;
  background-image: url(../images/register/arrow-down.png);
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 8px auto;
  font-size: 14px;
  padding-left: 20px;
  padding-right: 20px;
  width: 100%; }

.result-list {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  border-top: 1px solid #e8e8e8; }
  .result-list .item {
    border-bottom: 1px solid #e8e8e8; }
  .result-list a {
    color: #585858;
    display: block; }
  .result-list .text-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 600px;
    margin: 0 auto; }
  .result-list .result-cont {
    padding: 1.75rem; }
  .result-list .result-cate {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 30%;
            flex: 0 0 30%;
    width: 30%;
    max-width: 160px; }
  .result-list .result-empty {
    color: #999; }

.result-pagination {
  margin: 90px 0; }

@-webkit-keyframes showBuilding {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

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

@-webkit-keyframes buildBuilding {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }

@keyframes buildBuilding {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }

@-webkit-keyframes lineShowLeft {
  0%, 33% {
    width: 0%;
    opacity: 1;
    will-change: width; }
  100% {
    width: 100%;
    opacity: 1;
    will-change: width; } }

@keyframes lineShowLeft {
  0%, 33% {
    width: 0%;
    opacity: 1;
    will-change: width; }
  100% {
    width: 100%;
    opacity: 1;
    will-change: width; } }

@-webkit-keyframes slashMove {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-5%, -5%);
            transform: translate(-5%, -5%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes slashMove {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-5%, -5%);
            transform: translate(-5%, -5%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@-webkit-keyframes slashMove_mirror {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(10%, -10%);
            transform: translate(10%, -10%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes slashMove_mirror {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(10%, -10%);
            transform: translate(10%, -10%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

/* Media Query */
@media screen and (min-width: 1920px) {
  .cloud_area .main-visual {
    margin-top: 65px; } }

@media screen and (max-width: 1500px) and (min-width: 1350px) {
  .island_area .island_center_box {
    width: 1100px; }
  .page_article .article_center {
    width: 1140px; } }

@media screen and (min-width: 1350px) {
  .page_title-result {
    max-width: calc(100% - 240px); }
  .result-list {
    max-width: calc(100% - 240px); } }

@media screen and (max-width: 1349px) {
  .cloud_area .main-visual {
    margin-top: 140px; } }

@media screen and (max-width: 1349px) and (min-width: 1024px) {
  .island_area .island_center_box {
    width: 900px; }
  .page_article .article_center {
    width: 940px; } }

@media screen and (min-width: 1024px) {
  .result-status {
    width: calc(100% - 320px);
    margin: 40px auto 60px; }
  .result-select {
    position: absolute;
    right: 0;
    top: -7px; }
  .result-list a {
    -webkit-transition: background .3s;
    transition: background .3s; }
    .result-list a:hover {
      background: #d1eee4;
      font-weight: bold; } }

@media screen and (max-width: 1023px) {
  .cloud_area .main-visual {
    margin-top: 86px; }
  .cloud_area .box {
    left: 38%; } }

@media screen and (max-width: 1023px) and (min-width: 960px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 60px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; } }

@media screen and (max-width: 959px) and (min-width: 700px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 60px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; } }

@media screen and (min-width: 701px) {
  .search-input-box {
    bottom: 50px;
    max-width: 720px; }
    .search-input-box > div:first-child {
      width: 80%; }
    .search-input-box input {
      padding: 13px 30px; }
    .search-input-box .btn {
      width: 20%; }
  .result-select {
    width: 160px; } }

@media screen and (max-width: 700px) {
  .cloud_area .main-visual {
    margin-top: 95px; }
  .cloud_area .img-left-1 {
    top: -20%; }
  .cloud_area .img-left-2 {
    top: -21%; }
  .cloud_area .img-left-3 {
    top: -25%; }
  .cloud_area .img-left-4 {
    top: -39%; }
  .cloud_area .img-right-1 {
    top: -24%; }
  .cloud_area .img-right-2 {
    top: -9%; }
  .cloud_area .img-right-3 {
    top: -16%; }
  .cloud_area .img-right-4 {
    top: -42%;
    left: 74%; }
  .cloud_area .magnifier {
    -webkit-animation: none 0s;
            animation: none 0s; }
  .cloud_area .cloud-1 {
    display: none;
    top: -24%; }
  .cloud_area .cloud-2 {
    display: none;
    top: -29%; }
  .cloud_area .cloud-3 {
    display: none;
    top: -38%; }
  .cloud_area .cloud-4 {
    display: none;
    top: -55%; }
  .cloud_area .img-line {
    max-width: none; }
    .cloud_area .img-line .img-deco {
      background-size: 100vw; }
  .cloud_area .img-line-right {
    display: none; }
  .result-select {
    margin-top: 0;
    margin-bottom: 1rem; }
  .result-list .result-cont {
    padding: 1.25rem 0.625rem; } }

@media screen and (max-width: 700px) and (min-width: 451px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 0px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; }
  .page_title {
    /* margin:20px auto 30px auto; padding:30px 0 70px 0; */
    margin: 20px auto 80px auto;
    padding: 50px 0; } }

@media screen and (max-width: 450px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 0px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; }
  .page_title {
    /* margin:20px auto 30px auto; padding:20px 0 80px 0; */
    margin: 20px auto 80px auto;
    padding: 50px 0; }
    .page_title.bottom {
      margin: 20px auto 0px auto;
      padding: 50px 0 0 0; }
  .page_title-result {
    -webkit-transform: scale(1);
            transform: scale(1); }
    .page_title-result .result-status {
      -webkit-transform: scale(0.73);
              transform: scale(0.73); }
  .cloud_area .main-visual {
    margin-top: 100px; }
  .result-list .text-box {
    display: block; }
  .result-list .result-cate {
    width: 100%;
    max-width: none;
    padding-bottom: 5px;
    font-size: 80%;
    color: #023894; }
  .result-list .result-title {
    padding-top: 5px; } }

@media screen and (max-width: 320px) {
  .island_area .island_center_box::before {
    padding-top: 31%; } }