#top a {
  transition: all .2s linear; }
  #top a:hover {
    opacity: 0.8; }
#top .wrap-hero {
  background: url(../images/top/top.jpg) no-repeat;
  background-position: 0 -60px;
  background-size: cover;
  height: 440px;
  position: relative; }
  @media (max-width: 767px) {
    #top .wrap-hero {
      background-position: 0 0;
      height: 200px; } }
  #top .wrap-hero .wrap-topics {
    background: rgba(0, 0, 0, 0.6);
    padding: 20px 0;
    position: absolute;
    bottom: 0;
    width: 100%; }
    #top .wrap-hero .wrap-topics .title {
      color: #fff; }
    #top .wrap-hero .wrap-topics a {
      color: #fff; }
#top h2 {
  font-size: 1.8rem;
  font-weight: lighter;
  margin: 0 0 30px 0; }
  #top h2 span {
    color: #8b8b8b;
    font-size: 1rem;
    margin: 0 0 0 12px; }
#top .wrap-news ul li {
  border-bottom: 1px solid #ececec; }
  #top .wrap-news ul li:first-child a {
    padding: 0 0 15px 0; }
    @media (max-width: 767px) {
      #top .wrap-news ul li:first-child a {
        padding: 0 0 8px 0; } }
  #top .wrap-news ul li a {
    font-size: 0.95rem;
    padding: 15px 0;
    width: 100%; }
    @media (max-width: 767px) {
      #top .wrap-news ul li a {
        padding: 8px 0; } }
    #top .wrap-news ul li a:hover {
      color: #51ada3; }
  #top .wrap-news ul li time {
    color: #b4b4b4;
    font-size: 0.85rem;
    margin: 0 22px 0 0;
    vertical-align: top; }
  #top .wrap-news ul li span {
    display: inline-block;
    width: 80%; }
    @media (max-width: 767px) {
      #top .wrap-news ul li span {
        width: 100%; } }
#top .wrap-about {
  background: url(../images/top/about.jpg) no-repeat;
  background-position: center;
  background-size: cover;
  color: #fff;
  float: left;
  width: 100%; }
  #top .wrap-about .wrap-about-text {
    background: rgba(45, 197, 143, 0.74);
    float: right;
    padding: 40px 4%;
    width: 50%; }
    @media (max-width: 767px) {
      #top .wrap-about .wrap-about-text {
        margin: 30px 4%;
        padding: 30px 4%;
        width: auto; } }
    #top .wrap-about .wrap-about-text h2 span {
      color: #fff; }
    #top .wrap-about .wrap-about-text h3 {
      font-size: 1.3rem; }
    #top .wrap-about .wrap-about-text .sentence {
      font-size: 0.9rem;
      line-height: 1.4;
      margin: 18px 0; }
      #top .wrap-about .wrap-about-text .sentence p {
        margin: 0 0 14px 0; }
    #top .wrap-about .wrap-about-text .button {
      background: #cf2a49;
      color: #fff;
      font-size: 0.85rem;
      padding: 17px 30px; }
      @media (max-width: 767px) {
        #top .wrap-about .wrap-about-text .button {
          text-align: center;
          width: 100%; } }
#top .wrap-recommend {
  clear: both; }
  #top .wrap-recommend .box-recommend {
    margin: 0 0 40px 0; }
    #top .wrap-recommend .box-recommend img {
      padding-left: 23px; }
      @media (max-width: 767px) {
        #top .wrap-recommend .box-recommend img {
          margin: 18px 0 0;
          padding-left: 0; } }
      #top .wrap-recommend .box-recommend img.recommend-img1 {
        padding: 0 23px 0 0; }
        @media (max-width: 767px) {
          #top .wrap-recommend .box-recommend img.recommend-img1 {
            padding: 0; } }
    #top .wrap-recommend .box-recommend:nth-child(2) img {
      padding-right: 23px; }
      @media (max-width: 767px) {
        #top .wrap-recommend .box-recommend:nth-child(2) img {
          padding-right: 0; } }
    #top .wrap-recommend .box-recommend:nth-child(4) img {
      padding-right: 23px;
      padding-left: 0; }
      @media (max-width: 767px) {
        #top .wrap-recommend .box-recommend:nth-child(4) img {
          padding-right: 0; } }
    #top .wrap-recommend .box-recommend:last-child {
      margin: 0; }
      #top .wrap-recommend .box-recommend:last-child .iframe-content-block {
        padding: 0 0 0 23px; }
        @media (max-width: 767px) {
          #top .wrap-recommend .box-recommend:last-child .iframe-content-block {
            margin: 18px 0 0;
            padding: 0; } }
    #top .wrap-recommend .box-recommend h3 {
      border-bottom: 2px solid;
      color: #339f75;
      font-size: 1.15rem;
      margin: 0 0 20px 0;
      padding: 0 0 10px 0; }
      @media (max-width: 767px) {
        #top .wrap-recommend .box-recommend h3 {
          font-size: 1.2rem;
          margin: 20px 0; } }
    #top .wrap-recommend .box-recommend .text {
      font-size: 0.9rem; }
#top .wrap-movie {
  background: #f5f2dc; }
  #top .wrap-movie .iframe-content-block {
    margin: 0 0 40px 0; }
  #top .wrap-movie .box-text p {
    display: inline-block;
    font-size: 0.95rem;
    margin: 0 0 20px 0;
    text-align: left; }
  #top .wrap-movie .button {
    background: #cf2a49;
    color: #fff;
    font-size: 0.85rem;
    padding: 17px 30px; }
    @media (max-width: 767px) {
      #top .wrap-movie .button {
        width: 100%; } }
#top .wrap-free-lesson {
  background: url(../images/common/bg_free_lesson.jpg) no-repeat;
  background-position: center;
  background-size: cover; }
  #top .wrap-free-lesson address {
    background: rgba(16, 110, 100, 0.67);
    display: inline-block;
    padding: 3% 5%; }
    #top .wrap-free-lesson address p {
      color: #fff; }
      #top .wrap-free-lesson address p.tel {
        font-size: 2rem;
        font-weight: bold;
        margin: 10px 0; }
#top .wrap-recommend .container {
  padding-right: 0;
  padding-left: 0; }
  @media (max-width: 767px) {
    #top .wrap-recommend .container {
      padding-right: 15px;
      padding-left: 15px; } }
  #top .wrap-recommend .container .col-md-5, #top .wrap-recommend .container .col-sm-5, #top .wrap-recommend .container .col-xs-12, #top .wrap-recommend .container .col-md-7, #top .wrap-recommend .container .col-sm-7 {
    padding-right: 0;
    padding-left: 0; }
#top .wrap-message {
  background: #f5f2dc; }
  #top .wrap-message .box-text {
    margin: 21px 0 0; }
    #top .wrap-message .box-text p {
      display: inline-block;
      font-size: 0.95rem;
      text-align: left; }

/*# sourceMappingURL=top.css.map */