@charset "UTF-8";
body, div, dl, dt, dd,
h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, blockquote {
  margin: 0;
  padding: 0; }

address, cite, code, dfn, h1, h2, h3, h4, th, var {
  font-style: normal;
  font-weight: normal; }

body {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; }

fieldset, abbr {
  border: 0; }

caption, th {
  text-align: left; }

q:before, q:after {
  content: ''; }

img:hover {
  opacity: 0.7; }

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

.clearfix {
  display: inline-block; }

/* Hides from IE-mac \*/
.clearfix {
  display: block; }

/* End hide from IE-mac */
.clear {
  clear: both;
  margin: 0px;
  padding: 0px; }

br {
  letter-spacing: 0; }

a.banner_alpha:hover img {
  filter: alpha(style=0, opacity=80);
  -moz-opacity: 0.8;
  opacity: 0.8; }

#header {
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: #141933;
  position: fixed;
  z-index: 999; }
  #header #header-area {
    width: 1000px;
    margin: 0 auto;
    padding: 0; }
    #header #header-area .logo {
      margin: 0;
      padding: 0;
      float: left; }
      #header #header-area .logo h1 {
        margin: 0;
        padding: 0; }
      #header #header-area .logo p {
        margin: 0;
        padding: 0; }
    #header #header-area nav {
      display: none; }
      #header #header-area nav ul {
        display: none; }
    #header #header-area .navi {
      margin: 10px 0 0 0;
      padding: 0;
      float: right; }
      #header #header-area .navi ul {
        margin: 0;
        padding: 0; }
        #header #header-area .navi ul li {
          margin: 0;
          padding: 0;
          float: left;
          display: inline; }

@media screen and (max-width: 768px) {
  #header {
    display: none; }
    #header #header-area {
      width: 100%;
      margin: 0 auto;
      padding: 0; }
      #header #header-area .logo {
        margin: 0;
        padding: 0;
        float: left; }
        #header #header-area .logo h1 {
          margin: 0;
          padding: 0; }
      #header #header-area nav {
        display: block; }
      #header #header-area .navi {
        margin: 20px 0 0 0;
        padding: 0;
        float: right; }
        #header #header-area .navi ul {
          margin: 0;
          padding: 0;
          display: none; }
          #header #header-area .navi ul li {
            margin: 0;
            padding: 0;
            float: left;
            display: inline; } }


  #main h1,#main02 h1 {
/*margin: -73px 0 0 -285px; */
    /* display: block; */
    /* width: 100%; */
    /* height: 300px; */
    /* padding: 0; */
    position: absolute;
     text-align: center; 
    top: 55%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%) !important;
    -webkit- transform: translateY(-50%) translateX(-50%);
     }

@media screen and (max-width: 768px) {
  #main,#main02 {
    margin: 0;
    padding: 0;
    background-image: url(../img/main.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 450px;
    display: block;
    position: relative; }
    #main h1,#main02 h1 {
      margin: -10% 0 0 -39%;
      padding: 0;
      position: absolute;
      top: 50%;
      left: 50%; }
      #main h1 img,#main02 h1 img {
        width: 90%; }

  .wrapper {
    margin: 0 auto;
    width: 90% !important; } }
.wrapper {
  margin: 0 auto;
  width: 1000px; }

section {
  width: 100%;
  margin: 0;
  padding: 0; }

.bg01 {
  background-color: #141933; }

#section01 {
  margin: 0;
  padding: 40px 0 40px 0;
  background-color: #141933;
  color: #fff;
  line-height: 1.8em;
  text-align: center; }
  #section01 h2 {
    margin: 0;
    padding: 0 0 30px 0; }
  #section01 p {
    margin: 0;
    padding: 0 0 15px 0;
    text-align: center; }

.sp-img {
  display: none;
  margin: 0;
  padding: 0; }

@media screen and (max-width: 768px) {
  .sp-img {
    display: block;
    margin: 0 0 -10px 0 !important;
    padding: 0 !important; }
    .sp-img img {
      width: 100%; }

  #section01 {
    margin: 0;
    padding: 40px 0 40px 0;
    background-color: #141933;
    color: #fff;
    line-height: 1.8em;
    text-align: center; }
    #section01 img {
      width: 90%; }
    #section01 h2 {
      margin: 0;
      padding: 0 0 30px 0; }
    #section01 p {
      margin: 0;
      padding: 0 0 15px 0;
      text-align: center;
      font-size: 14px; } }
#section02 {
  margin: 0;
  padding: 40px 0 40px 0;
  background-image: url(../img/section02_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left;
  background-color: #fff; }
  #section02 #section02-area {
    margin: 0;
    padding: 0;
    float: right;
    width: 645px; }
    #section02 #section02-area h2 {
      text-align: center;
      margin: 0;
      padding: 0 0 30px 0; }
    #section02 #section02-area p {
      line-height: 1.8em;
      margin: 0;
      padding: 0 0 15px 0; }
    #section02 #section02-area .btn {
      margin: 30px 0 0 0;
      padding: 0;
      text-align: center; }

@media screen and (max-width: 768px) {
  #section02 {
    margin: 0;
    padding: 0px 0 0px 0;
    background-image: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left;
    background-color: #fff; }
    #section02 #section02-area {
      margin: 0;
      padding: 0;
      float: none;
      width: 100%; }
      #section02 #section02-area h2 {
        text-align: center;
        margin: 0;
        padding: 0 0 0px 0; }
      #section02 #section02-area p {
        line-height: 1.8em;
        margin: 0;
        padding: 0 0 15px 0;
        font-size: 14px; }
      #section02 #section02-area .btn {
        margin: 10px 0 20px 0;
        padding: 0;
        text-align: center; }
        #section02 #section02-area .btn img {
          width: 100%; } }
#section03 {
  margin: 0;
  padding: 50px 0 40px 0;
  background-image: url(../img/section03_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right;
  background-color: #141933; }
  #section03 #section03-area {
    margin: 0;
    padding: 0;
    float: left;
    width: 645px; }
    #section03 #section03-area h2 {
      text-align: center;
      margin: 0;
      padding: 0 0 30px 0; }
    #section03 #section03-area p {
      line-height: 1.8em;
      margin: 0;
      padding: 0 0 15px 0;
      color: #fff; }
    #section03 #section03-area .btn {
      margin: 30px 0 0 0;
      padding: 0;
      text-align: center; }

@media screen and (max-width: 768px) {
  #section03 {
    margin: 0;
    padding: 0px 0 0px 0;
    background-image: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
    background-color: #141933; }
    #section03 #section03-area {
      margin: 0;
      padding: 0;
      float: none;
      width: 100%; }
      #section03 #section03-area h2 {
        text-align: center;
        margin: 0;
        padding: 20px 0 10px 0; }
      #section03 #section03-area p {
        line-height: 1.8em;
        margin: 0;
        padding: 0 0 15px 0;
        color: #fff;
        font-size: 14px; }
      #section03 #section03-area .btn {
        margin: 10px 0 20px 0;
        padding: 0;
        text-align: center; }
        #section03 #section03-area .btn img {
          width: 100%; } }
#section04 {
  margin: 0;
  padding: 50px 0 40px 0;
  background-image: url(../img/section04_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right;
  background-color: #fff; }
  #section04 #section04-area {
    margin: 0;
    padding: 0;
    float: right;
    width: 645px; }
    #section04 #section04-area h2 {
      text-align: center;
      margin: 0;
      padding: 0 0 30px 0; }
    #section04 #section04-area p {
      line-height: 1.8em;
      margin: 0;
      padding: 0 0 15px 0; }
    #section04 #section04-area .btn {
      margin: 30px 0 0 0;
      padding: 0;
      text-align: center; }

@media screen and (max-width: 768px) {
  #section04 {
    margin: 0;
    padding: 0px 0 10px 0;
    background-image: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
    background-color: #fff;
    border-bottom: 1px solid #141933; }
    #section04 #section04-area {
      margin: 0;
      padding: 0;
      float: none;
      width: 100%; }
      #section04 #section04-area h2 {
        text-align: center;
        margin: 0;
        padding: 0 0 30px 0; }
      #section04 #section04-area p {
        line-height: 1.8em;
        margin: 0;
        padding: 0 0 15px 0;
        font-size: 14pxl; }
      #section04 #section04-area .btn {
        margin: 20px 0 20px 0;
        padding: 0;
        text-align: center; }
        #section04 #section04-area .btn img {
          width: 100%; } }
.section05-title {
  margin: 0;
  padding: 40px 0 20px 0;
  text-align: center;
  background-color: #fff; }

#section05 {
  margin: 0;
  padding: 20px 0 20px 0;
  background-image: url(../img/section05_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center; }
  #section05 #section05-area {
    margin: 0;
    padding: 0; }
    #section05 #section05-area ul {
      margin: 20px 0 0 0;
      padding: 0; }
      #section05 #section05-area ul li {
        margin: 0;
        padding: 0 0 14px 0;
        display: inline;
        float: left; }
        #section05 #section05-area ul li:nth-child(2) {
          padding-left: 14px;
          padding-right: 14px; }
        #section05 #section05-area ul li:nth-child(5) {
          padding-left: 14px;
          padding-right: 14px; }
        #section05 #section05-area ul li:nth-child(8) {
          padding-left: 14px;
          padding-right: 14px; }

@media screen and (max-width: 768px) {
  .section05-title {
    margin: 0;
    padding: 10px 0 10px 0;
    text-align: center;
    background-color: #fff; }
    .section05-title img {
      width: 75%; }

  #section05 {
    margin: 0;
    padding: 20px 0 20px 0;
    background-image: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-color: #141933; }
    #section05 #section05-area {
      margin: 0;
      padding: 0; }
      #section05 #section05-area ul {
        margin: 0px 0 0 0;
        padding: 0; }
        #section05 #section05-area ul li {
          margin: 0;
          padding: 0 0 14px 0;
          display: inline;
          float: left;
          width: 48%; }
          #section05 #section05-area ul li:nth-child(even) {
            margin: 0 0 0 4%; }
          #section05 #section05-area ul li:nth-child(2) {
            padding-left: 0px;
            padding-right: 0px; }
          #section05 #section05-area ul li:nth-child(5) {
            padding-left: 0px;
            padding-right: 0px; }
          #section05 #section05-area ul li:nth-child(8) {
            padding-left: 0px;
            padding-right: 0px; }
          #section05 #section05-area ul li img {
            width: 100%; } }
#section06 {
  margin: 0;
  padding: 50px 0 130px 0;
  background-image: url(../img/section06_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right; }
  #section06 #section06-area {
    margin: 0;
    padding: 0;
    float: left;
    width: 645px; }
    #section06 #section06-area h2 {
      text-align: center;
      margin: 0;
      padding: 0 0 30px 0; }
    #section06 #section06-area dl {
      margin: 0;
      padding: 0; }
      #section06 #section06-area dl dt {
        margin: 0;
        padding: 14px 50px 14px 14px;
        float: left; }
      #section06 #section06-area dl dd {
        margin: 0;
        padding: 14px;
        border-bottom: 1px solid #282828;
        font-size: 16px; }

@media screen and (max-width: 768px) {
  #section06 {
    margin: 0;
    padding: 0px 0 0px 0;
    background-image: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
    background-color: #fff; }
    #section06 #section06-area {
      margin: 0;
      padding: 0;
      float: none;
      width: 100%; }
      #section06 #section06-area h2 {
        text-align: center;
        margin: 0;
        padding: 10px 0 10px 0; }
        #section06 #section06-area h2 img {
          width: 90%; }
      #section06 #section06-area dl {
        margin: 0;
        padding: 0 0 20px 0; }
        #section06 #section06-area dl dt {
          margin: 0;
          padding: 14px 20px 14px 14px;
          float: left; }
        #section06 #section06-area dl dd {
          margin: 0;
          padding: 14px;
          border-bottom: 1px solid #282828;
          font-size: 16px; } }
#section07 {
  margin: 0;
  padding: 0px 0 0px 0;
  background-image: url(../img/section07_bg.jpg);
  background-repeat: no-repeat;
  background-position: left top;
  max-height: 449px;
  background-color: #272727; }
  #section07 #section07-area {
    margin: 0;
    padding: 0;
    float: right;
    width: 680px;
    min-height: 449px;
    background-color: #272727; }
    #section07 #section07-area h2 {
      text-align: center;
      margin: 0;
      padding: 0px 0 10px 0; }
    #section07 #section07-area dl {
      margin: 0;
      padding: 5px 12px 5px 12px;
      color: #fff; }
      #section07 #section07-area dl dt {
        margin: 0;
        padding: 5px 12px 5px 12px;
        float: left;
        width: 100px; }
      #section07 #section07-area dl dd {
        margin: 0;
        padding: 5px 12px 5px 12px;
        border-bottom: 1px solid #282828;
        font-size: 16px;
        letter-spacing: 0px; }
    #section07 #section07-area p {
      line-height: 1.8em;
      margin: 0;
      padding: 0 0 15px 0; }
    #section07 #section07-area .btn {
      margin: 30px 0 0 0;
      padding: 0;
      text-align: center; }

@media screen and (max-width: 768px) {
  #section07 {
    margin: 0;
    padding: 0px 0 10px 0;
    background-image: none;
    background-repeat: no-repeat;
    background-position: left top;
    max-height: 100%;
    background-color: #272727; }
    #section07 #section07-area {
      margin: 0;
      padding: 0;
      float: none;
      width: 100%;
      background-color: #272727; }
      #section07 #section07-area h2 {
        text-align: center;
        margin: 0;
        padding: 10px 0 10px 0; }
        #section07 #section07-area h2 img {
          width: 75%; }
      #section07 #section07-area dl {
        margin: 0;
        padding: 0 0 20px 0px;
        color: #fff; }
        #section07 #section07-area dl dt {
          margin: 0;
          padding: 0;
          float: none; }
        #section07 #section07-area dl dd {
          margin: 0;
          padding: 0 0 20px 0;
          border-bottom: 1px solid #282828;
          font-size: 16px; }
      #section07 #section07-area p {
        line-height: 1.8em;
        margin: 0;
        padding: 0 0 15px 0; }
      #section07 #section07-area .btn {
        margin: 30px 0 0 0;
        padding: 0;
        text-align: center; } }
#footer {
  margin: 0;
  padding: 20px 0 20px 0;
  text-align: center;
  background-color: #141933;
  color: #fff;
  font-size: 10px; }

@media screen and (max-width: 768px) {
  #footer {
    margin: 0;
    padding: 20px 0 20px 0;
    text-align: center;
    background-color: #141933;
    color: #fff;
    font-size: 10px; }
    #footer img {
      width: 50%; } }
.fade {
  opacity: 0.1;
  transform: translate(0, 0px);
  transition: all 1000ms; }

.fade2 {
  opacity: 0.1;
  transform: translate(0, 5px);
  transition: all 1000ms; }

.fade3 {
  opacity: 0.1;
  transform: translate(0, 20px);
  transition: all 1200ms; }

.fadein {
  opacity: 1.0;
  transform: translate(0, 0); }

.modal-content iframe {
  width: 100%;
  height: 400px;
  border: none; }
.modal-content .contact {
  margin: 0;
  padding: 0; }
  .modal-content .contact dl {
    margin: 0;
    padding: 0;
    width: 100%; }
    .modal-content .contact dl dt {
      margin: 0 0 7px 0;
      padding: 0; }
    .modal-content .contact dl dd {
      margin: 0 0 10px 0;
      padding: 0; }
      .modal-content .contact dl dd .mail {
        width: 100%; }
      .modal-content .contact dl dd .text {
        width: 100%;
        height: 100px; }
  .modal-content .contact .send {
    margin: 0;
    padding: 0;
    text-align: center; }
    .modal-content .contact .send .send-btn {
      background-image: url(../img/send.gif);
      background-repeat: no-repeat;
      width: 230px;
      height: 36px;
      border: none;
      cursor: pointer; }



/*a*/

#formail dd {
    margin: 0 0 10px 0;
    padding: 0;
}

#formail dl {
    margin: 0;
    padding: 0;
    width: 100%;
}
#formail p.send {
    margin: 0;
    padding: 0;
    text-align: center;
}
input.send-btn {
    background-image: url(../img/send.gif);
    background-repeat: no-repeat;
    width: 230px;
    height: 36px;
    border: none;
    cursor: pointer;
}

.contact {
    margin: 0;
    padding: 0;
}

#formail dl {
    margin: 0;
    padding: 0;
    width: 100%;
}

#formail dl dt {
    margin: 0 0 7px 0;
    padding: 0;
}

#formail p.send {
    margin: 0;
    padding: 0;
    text-align: center;
}

input.mail {
    width: 100%;
}

textarea.text {
    width: 99%;
    height: 100px;
}
/*a*/

.tenten01,.tenten02 {
    position: absolute;
    bottom: 10px;
    right: 50%;
    text-align: center;
    transform: translateY(-50%) translateX(50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
.tenten01 span {
    margin: 10px;
        color: #8a8a8d;
}
.tenten01 span:nth-child(1) {
    color: #141933;
}

.tenten02 span {
    margin: 10px;
        color: #8a8a8d;
}
.tenten02 span:nth-child(2) {
    color: #141933;
}
div#title {
    font-size: 18px;
    height: 60px;
    visibility: hidden;
    margin: 0 21%;
}

button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    font-size: 16px;
    color: #f4f4f4 !important;
    -webkit-text-stroke: 1px #b8b8b8;
    text-stroke: 1px #FFF;
}
/*オーディオ*/
audio {
    outline: none;
    width: 290px !important
}

@media screen and (max-width: 768px) {
  .modal-content {
    width: 80% !important; }
    .modal-content .contact {
      margin: 0;
      padding: 0; }
      .modal-content .contact dl {
        margin: 0;
        padding: 0;
        width: 100%; }
        .modal-content .contact dl dt {
          margin: 0 0 7px 0;
          padding: 0; }
        .modal-content .contact dl dd {
          margin: 0 0 10px 0;
          padding: 0; }
          .modal-content .contact dl dd .mail {
            width: 100%; }
          .modal-content .contact dl dd .text {
            width: 100%;
            height: 100px; }
      .modal-content .contact .send {
        margin: 0;
        padding: 0;
        text-align: center; }
        .modal-content .contact .send .send-btn {
          background-image: url(../img/send.gif);
          background-repeat: no-repeat;
          width: 230px;
          height: 36px;
          border: none;
          cursor: pointer; } }


#slide {
    height: 725px;
margin:0 auto;
position:relative;
}
#slide img {
/*position:absolute;
left:0;
top:0;*/
}
#slide ul li {
    list-style: none;
}
#slide ul {
    margin: 0;
    padding: 0;
}
#slide ul li.active {
/*    width: 100% !important;*/
      opacity: 1;
      animation-duration: 0.5s;
      animation-name: fade-in;
      -moz-animation-duration: 0.5s;
      -moz-animation-name: fade-in;
      -webkit-animation-duration: 0.5s;
      -webkit-animation-name: fade-in;
}
video {
    margin-top: -23%;
    width: 60%;
    outline: none;
}




  #slide > ul > li:nth-child(1) {
    margin: 0;
    padding: 0;
    background-image: url(../img/main.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 725px;
    display: block;
    position: relative;
}

  #slide > ul > li:nth-child(2) {
  margin: 0;
  padding: 0;
/*  background-image: url(../img/main02.jpg);*/
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  width: 100%;
  height: 725px;
  display: block;
  position: relative;
}

@media screen and (min-width:480px) and ( max-width:768px) {

#main h1 img, #main02 h1 img {
    width: 55%  !important;
}
#main02 h1 {
    height: 500px  !important;
}
audio {
    margin-top: -10px  !important;
}
div#title {
    margin: 0% 26% !important;
}
#slide {
    height: 80vw;
}
#slide > ul > li {
    height: 80vw !important;
}
}
#main h1 {
    top: 50%;
}

@media screen and (max-width: 768px) {
#slide {
    height: 450px;
}
#main h1 {
    padding: 0;
    position: absolute;
top: 45% !important;
    left: 50%;
    width: 100%;
    margin: 0 !important;
    transform: translateY(-20%) translateX(-50%) !important;
    -webkit- transform: translateY(-50%) translateX(-50%);
}
#main02 h1 {
    transform: translateY(-40%) translateX(-50%) !important;
    -webkit- transform: translateY(-50%) translateX(-50%);
    width: 100%;
    margin: 0;
}

#main h1 img, #main02 h1 img {
    width: 80%;
}
#main02 {
    background-image: none;
    background-color: white;
}
video {
margin-top: -26%;
    width: 80%;
    outline: none;
}
.tenten01,.tenten02 {
    position: absolute;
    bottom: 10px;
    right: 50%;
    text-align: center;
    transform: translateY(-50%) translateX(50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
.tenten01 span {
    margin: 10px;
        color: #7c8098;
}
.tenten01 span:nth-child(1) {
/*    color: #f00;*/
}

.tenten02 span {
    margin: 10px;
}
.tenten02 span:nth-child(2) {
    color: #141933;
}
#slide > ul > li {
    height: 450px !important;
}
div#title {
    font-size: 16px;
    height: 60px;
    margin-top: -10px;
    visibility: hidden;
    margin: -2% 12%;
}

button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    font-size: 18px;
    color: #f4f4f4 !important;
    -webkit-text-stroke: 1px #b8b8b8;
    text-stroke: 1px #FFF;
}
/*オーディオ*/
audio {
    outline: none;
width: 210px !important;
}

  }