@charset "UTF-8";
/*------------------------------------------------------
 共通
-------------------------------------------------------*/
h2.top-title {
  line-height: 1;
  overflow: hidden;
  color: #333; }
  h2.top-title span.en {
    font-weight: 300;
    font-size: 32px;
    display: inline-block;
    line-height: 1.8;
    position: relative; }
    h2.top-title span.en:after {
      content: '';
      display: block;
      width: 1200px;
      border-top: 1px solid #333;
      position: absolute;
      right: -1220px;
      top: 60%; }
    h2.top-title span.en span.jp {
      font-weight: 500;
      font-size: 14px;
      display: block;
      line-height: 0;
      padding-top: 1em; }

/*------------------------------------------------------
　トップタイトル
-------------------------------------------------------*/
#top-title {
  background: #97CEFF url("../img/top/title-bg.png");
  background-blend-mode: hard-light;
  background-size: 100%;
  background-position: top right;
  background-repeat: no-repeat; }
  #top-title .inner {
    background: url("../img/temp/border.png");
    position: relative;
    padding: 5% 10px  8% 10px; }
    #top-title .inner img.wave {
      position: absolute;
      bottom: -1px;
      left: 0;
      width: 100%; }
  #top-title h1 {
    padding: 2.8em 10px 1em 10px;
    color: #737373;
    font-weight: bold; }
  #top-title .main-img.sp {
    display: none; }
  #top-title a {
    position: relative;
    display: inline-block;
    width: 100%; }
    #top-title a img.on {
      display: none; }
    #top-title a img.off {
      display: block; }
    #top-title a img {
      -webkit-transition: all 0s ease;
      -moz-transition: all 0s ease;
      -o-transition: all 0s ease;
      transition: all 0s ease; }
  #top-title a:hover img {
    opacity: 1;
    transform: scale(1.05) rotate(5deg);
    -moz-transform: scale(1.05) rotate(5deg);
    -webkit-transform: scale(1.05) rotate(5deg);
    -o-transform: scale(1.05) rotate(5deg);
    -ms-transform: scale(1.05) rotate(5deg); }
    #top-title a:hover img.on {
      display: block; }
    #top-title a:hover img.off {
      display: none; }
  #top-title a:hover:after {
    content: '';
    background-image: url("../img/top/main-img-on.png");
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
    width: 15%;
    padding-bottom: 80px;
    display: block;
    position: absolute;
    top: 10%;
    right: 10%; }

@media screen and (max-width: 1024px) {
  #top-title .inner {
    padding: 10% 10px  16% 10px; }
    #top-title .inner img.main-logo {
      width: 60%; } }
@media screen and (max-width: 768px) {
  #top-title {
    margin-top: 60px; }
    #top-title a {
      position: initial; }
    #top-title a:hover:after {
      display: none; } }
@media screen and (max-width: 576px) {
  #top-title {
    background: #97CEFF url("../img/temp/title-bg-sp.png");
    background-size: cover;
    background-position: bottom center;
    position: relative; }
    #top-title .inner img.main-logo {
      width: 85%;
      margin-bottom: 10px; }
    #top-title .col-6 {
      padding: 0; } }
/*------------------------------------------------------
 メインスライド
-------------------------------------------------------*/
.top-slide {
  display: none; }

.top-slide.slick-slider {
  display: block; }

.top-slide li.slick-slide {
  padding: 20px 40px; }

@media screen and (max-width: 1024px) {
  .top-slide li.slick-slide {
    padding: 10px 20px; } }
@media screen and (max-width: 576px) {
  .top-slide li.slick-slide {
    padding: 0 20px; } }
/*------------------------------------------------------
 キーワード検索
-------------------------------------------------------*/
.keyword-area {
  margin: 20px auto;
  max-width: 800px;
  width: 100%;
  position: relative; }
  .keyword-area input[type="text"] {
    border-radius: 2em;
    width: 100%;
    padding-top: 0.75em;
    padding-bottom: 0.75em;
    padding-left: 3em;
    padding-right: 2em;
    border: 2px solid #FFAA00;
    background: #fff;
    font-size: 16px;
    outline: none; }
  .keyword-area input[type="submit"] {
    border-radius: 50%;
    height: 4.1em;
    width: 4.1em;
    padding: 0;
    margin: 0;
    text-align: center;
    line-height: 4em;
    position: absolute;
    top: -1em;
    right: 0;
    border: 2px solid #FFAA00; }
    .keyword-area input[type="submit"]:hover {
      background: #fff;
      color: #FFAA00;
      opacity: 1; }
  .keyword-area img.icon {
    position: absolute;
    top: 0.8em;
    left: 0.8em;
    width: 1.2em; }
  .keyword-area img.img {
    position: absolute;
    top: -1em;
    right: -80px;
    width: 90px; }
  .keyword-area h3 {
    font-size: 16px;
    margin-bottom: -0.7em;
    padding-left: 1em; }
    .keyword-area h3 span {
      color: #777;
      font-size: 14px; }

@media screen and (max-width: 1024px) {
  .keyword-area input[type="text"] {
    font-size: 14px; }
  .keyword-area input[type="submit"] {
    font-size: 16px; }
  .keyword-area img.img {
    position: absolute;
    top: -4.2em;
    right: 0;
    width: 70px; }
  .keyword-area h3 {
    font-size: 14px; }
    .keyword-area h3 span {
      font-size: 12px; } }
/*------------------------------------------------------
 メインスライド
-------------------------------------------------------*/
.item-slide {
  display: none; }

.item-slide.slick-slider {
  display: block; }

.item-slide li.slick-slide {
  padding: 40px; }

@media screen and (max-width: 1024px) {
  .item-slide li.slick-slide {
    padding: 20px; } }
@media screen and (max-width: 576px) {
  .item-slide li.slick-slide {
    padding: 15px; } }
/*------------------------------------------------------
 メインスライド
-------------------------------------------------------*/
.info-slide {
  display: none; }

.info-slide.slick-slider {
  display: block; }

.info-slide li.slick-slide {
  padding: 20px 10px 30px 10px; }

@media screen and (max-width: 576px) {
  .info-slide li.slick-slide {
    padding: 20px 5px 30px 5px; } }
