/*! ============================================================ */
/*! Media queries
/*! ============================================================ */
/*! PC */
.show-xs, .show-sm { display: none; }

.hide-xs, .hide-sm { display: block; }

.row-xs, .row { margin: 0 -16px; }
.news-magazine-wrapper .row-xs, .news-magazine-wrapper .row { margin: 0 -10px; }
#course .section-content .row-xs, #product .section-content .row-xs, #course .section-content .row, #product .section-content .row { margin: 0 -6px; }

.cell-xs, .cell { margin: 0 16px; }
.news-magazine-wrapper .cell-xs, .news-magazine-wrapper .cell { margin: 0 10px; }
#course .section-content .cell-xs, #product .section-content .cell-xs, #course .section-content .cell, #product .section-content .cell { margin: 0 6px; }

.col-xs-24, .col-xs-23, .col-xs-22, .col-xs-21, .col-xs-20, .col-xs-19, .col-xs-18, .col-xs-17, .col-xs-16, .col-xs-15, .col-xs-14, .col-xs-13, .col-xs-12, .col-xs-11, .col-xs-10, .col-xs-9, .col-xs-8, .col-xs-7, .col-xs-6, .col-xs-5, .col-xs-4, .col-xs-3, .col-xs-2, .col-xs-1, .col-24, .col-23, .col-22, .col-21, .col-20, .col-19, .col-18, .col-17, .col-16, .col-15, .col-14, .col-13, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 { float: left; }

.col-xs-24, .col-24 { width: 100%; }

.col-xs-23, .col-23 { width: 95.83333333%; }

.col-xs-22, .col-22 { width: 91.66666666%; }

.col-xs-21, .col-21 { width: 87.5%; }

.col-xs-20, .col-20 { width: 83.33333333%; }

.col-xs-19, .col-19 { width: 79.16666666%; }

.col-xs-18, .col-18 { width: 75%; }

.col-xs-17, .col-17 { width: 70.83333333%; }

.col-xs-16, .col-16 { width: 66.66666666%; }

.col-xs-15, .col-15 { width: 62.5%; }

.col-xs-14, .col-14 { width: 58.33333333%; }

.col-xs-13, .col-13 { width: 54.16666666%; }

.col-xs-12, .col-12 { width: 50%; }

.col-xs-11, .col-11 { width: 45.83333333%; }

.col-xs-10, .col-10 { width: 41.66666666%; }

.col-xs-9, .col-9 { width: 37.5%; }

.col-xs-8, .col-8 { width: 33.33333333%; }

.col-xs-7, .col-7 { width: 29.16666666%; }

.col-xs-6, .col-6 { width: 25%; }

.col-xs-5, .col-5 { width: 20.83333333%; }

.col-xs-4, .col-4 { width: 16.66666666%; }

.col-xs-3, .col-3 { width: 12.5%; }

.col-xs-2, .col-2 { width: 8.33333333%; }

.col-xs-1, .col-1 { width: 4.16666666%; }

.fl-right { float: right; }

/*! Tab */
@media screen and (max-width: 1248px) { #primary { width: 72%; }
  #secondary { }
}
@media screen and (max-width: 1080px) { .show-sm { display: block; }
  .hide-sm { display: none; }
  #primary { width: auto; float: none; margin-left: auto; margin-right: auto; }
  #secondary {clear:both; width: 240px; float: none; margin-left: auto; margin-right: auto; }
  .xs-menu-area .xs-menu-btn-area { background: #fff; border-bottom: 3px solid #bbb; padding: 16px 0; position: relative; z-index: 9999; }
  .xs-menu-area .xs-menu-btn-area .xs-site-logo { max-width: 204px; margin: 0 16px; float: left; line-height: 0; }
  .xs-menu-area .xs-menu-btn-area .xs-menu-btn { max-width: 20%; position: absolute; top: 50%; right: 16px; margin: -16px 0 0; z-index: 99; }
  .xs-menu-area .xs-menu-btn-area .xs-menu-btn i {/* color: #333; */font-size: 32px;/* text-align: center; *//* display: block; *//* width: 32px; */ height: 32px; line-height: 32px; cursor: pointer;}
  .xs-menu-area .xs-navigation { display: none; position: absolute; width: 100%; z-index: 999; }
  .xs-menu-area .xs-navigation .header-tel { border-bottom: 1px solid #ddd; background: #fff; text-align: center; padding: 8px 0; }
  .xs-menu-area .xs-navigation ul li { line-height: 30px; }
  .xs-menu-area .xs-navigation ul li a { font-size: 14px; display: block; padding: 4px 40px 4px 16px; background: #fff; border-bottom: 1px solid #ddd; text-decoration: none; position: relative; }
  .xs-menu-area .xs-navigation ul li a:hover { color: #fff; background: #333; }
  .xs-menu-area .xs-navigation ul li a:after { color: #bbb; font-family: FontAwesome; position: absolute; top: 50%; right: 0; margin: -12px 0 0; width: 24px; height: 24px; line-height: 24px; content: "\f105"; }
  .xs-menu-area .xs-navigation ul li a span { font-size: 80%; margin: 0 0 0 16px; }
  .xs-menu-area .xs-navigation ul li ul li a { padding: 4px 24px; }
  .xs-menu-area .xs-navigation ul li ul li ul li a { padding: 4px 32px; }
  .xs-menu-area .xs-navigation ul li ul li ul li ul li a { padding: 4px 40px; } }
/*! Mobile */
@media screen and (max-width: 767px) { .show-sm, .show-xs { display: block; }
  .hide-sm, .hide-xs { display: none; }
  .row, .cell { margin: 0; }
  .row-xs { margin: 0 -8px; }
  .cell-xs { margin: 0 8px; }
  .col-24, .col-23, .col-22, .col-21, .col-20, .col-19, .col-18, .col-17, .col-16, .col-15, .col-14, .col-13, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 { width: auto; float: none; }
  .footer-w-area .three .widget-area-footer, #teacher.section .section-content .teacher-in-index article .entry-wrapper .eyecatch { width: auto; float: none; margin-left: auto; margin-right: auto; }
  .slideshow-wrapper { height: auto; }
  .bx-controls { display: none; }
  #page-top a { bottom: 8px; right: 8px; }
  .section#course .section-content .ad-course { width: auto; height: auto; }
  .section#course .section-content .ad-course .btn_1, .section#course .section-content .ad-course .btn_2 { position: relative; bottom: 0; text-align: center; margin: 8px 0; }
  .section#course .section-content .ad-course .btn_1 { left: auto; }
  .section#course .section-content .ad-course .btn_2 { right: auto; }
  .section#teacher .section-content .book { min-width: 0; }
  #contactform { width: auto; border: none; }
  #contactform tr { display: block; margin-bottom: 1.5em; }
  #contactform tr th, #contactform tr td { list-style: none; display: list-item; border: none; width: 272px; padding: 4px 16px; }
  .comments-area .commentlist { padding: 0; }
  .comments-area .commentlist .comment-body { margin: 0 0 16px; }
  .comments-area .commentlist .children { padding: 0 0 0 16px; }
  .comments-area #respond { padding: 5%; }
  .comments-area #respond .comment-form .comment-notes { margin: 0 0 16px; }
  .comments-area #respond .comment-form .comment-form-author input, .comments-area #respond .comment-form .comment-form-email input, .comments-area #respond .comment-form .comment-form-url input { display: block; margin-left: 0; } }
