@charset "UTF-8";
/*! normalize.css v2.1.3 | MIT License | git.io/normalize */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block; }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent; }

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted; }

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0; }

/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
  display: none; }

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000; }

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em; }

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap; }

/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* ==========================================================================
   Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0; }

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden; }

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0; }

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default; }

/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box; }

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */ }

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0; }

@font-face {
  font-family: 'icomoon';
  src: url("/gengo/assets/fonts/icomoon.eot?uhsx7o");
  src: url("/gengo/assets/fonts/icomoon.eot?uhsx7o#iefix") format("embedded-opentype"), url("/gengo/assets/fonts/icomoon.ttf?uhsx7o") format("truetype"), url("/gengo/assets/fonts/icomoon.woff?uhsx7o") format("woff"), url("/gengo/assets/fonts/icomoon.svg?uhsx7o#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-google-plus:before {
  content: "\e907"; }

.icon-facebook:before {
  content: "\e908"; }

.icon-instagram:before {
  content: "\e909"; }

.icon-twitter:before {
  content: "\e90a"; }

.icon-menu:before {
  content: "\e9bd"; }

.icon-play3:before {
  content: "\ea1c"; }

.icon-arrow-up2:before {
  content: "\ea3a"; }

.icon-bookmarks:before {
  content: "\e9d3"; }

.icon-file-pdf:before {
  content: "\eada"; }

.icon-file-openoffice:before {
  content: "\eadb"; }

.icon-file-word:before {
  content: "\eadc"; }

.icon-file-excel:before {
  content: "\eadd"; }

.icon-libreoffice:before {
  content: "\eade"; }

.icon-file-text2:before {
  content: "\e926"; }

.icon-pushpin:before {
  content: "\e946"; }

.icon-bubbles:before {
  content: "\e96c"; }

.icon-accessibility:before {
  content: "\e9b2"; }

.icon-sphere:before {
  content: "\e9c9"; }

.icon-attachment:before {
  content: "\e9cd"; }

.icon-checkmark:before {
  content: "\ea10"; }

.icon-arrow-down:before {
  content: "\ea36"; }

.icon-arrow-down2:before {
  content: "\ea3e"; }

.icon-circle-right:before {
  content: "\ea42"; }

.icon-clock:before {
  content: "\e94e"; }

.icon-calendar:before {
  content: "\e953"; }

.icon-question:before {
  content: "\ea09"; }

.icon-end:before {
  content: "\e906"; }

.icon-new3:before {
  content: "\e905"; }

.icon-new2:before {
  content: "\e904"; }

.icon-new:before {
  content: "\e903"; }

.icon-icon-program3:before {
  content: "\e900"; }

.icon-icon-program2:before {
  content: "\e901"; }

.icon-icon-program1:before {
  content: "\e902"; }

.icon-warning:before {
  content: "\ea07"; }

.icon-notification:before {
  content: "\ea08"; }

.icon-plus:before {
  content: "\ea0a"; }

.icon-minus:before {
  content: "\ea0b"; }

.icon-blocked:before {
  content: "\ea0e"; }

.icon-cross:before {
  content: "\ea0f"; }

.icon-checkmark:before {
  content: "\ea11"; }

.icon-checkmark2:before {
  content: "\ea12"; }

.icon-arrow-up:before {
  content: "\ea32"; }

.icon-arrow-right:before {
  content: "\ea34"; }

.icon-arrow-down:before {
  content: "\ea37"; }

.icon-arrow-left:before {
  content: "\ea38"; }

.icon-arrow-up2:before {
  content: "\ea3b"; }

.icon-arrow-right2:before {
  content: "\ea3c"; }

.icon-arrow-down2:before {
  content: "\ea3f"; }

.icon-arrow-left2:before {
  content: "\ea40"; }

.icon-circle-up:before {
  content: "\ea41"; }

.icon-circle-right:before {
  content: "\ea43"; }

.align-center {
  text-align: center; }

.align-left {
  text-align: left; }

.align-right {
  text-align: right; }

.align-justify {
  text-align: justify;
  text-rendering: optimizeLegibility;
  word-break: break-all; }

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: auto;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/* Slider */
.slick-loading .slick-list {
  background: #fff url(/gengo/assets/img/common/ajax-loader.gif) center center no-repeat; }

/* Icons */
@font-face {
  font-family: "slick";
  src: url('/assets/fonts/slick.eot?1462480548');
  src: url('/assets/fonts/slick.eot?&1462480548#iefix') format("embedded-opentype"), url('/assets/fonts/slick.woff?1462480548') format("woff"), url('/assets/fonts/slick.ttf?1462480548') format("truetype"), url('/assets/fonts/slick.svg?1462480548#slick') format("svg");
  font-weight: normal;
  font-style: normal; }
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none; }
  .slick-prev:hover, .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent; }
    .slick-prev:hover:before, .slick-prev:focus:before,
    .slick-next:hover:before,
    .slick-next:focus:before {
      opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before {
    opacity: 0.25; }
  .slick-prev:before,
  .slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: white;
    opacity: 0.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }

.slick-prev {
  left: -25px; }
  [dir="rtl"] .slick-prev {
    left: auto;
    right: -25px; }
  .slick-prev:before {
    content: "←"; }
    [dir="rtl"] .slick-prev:before {
      content: "→"; }

.slick-next {
  right: -25px; }
  [dir="rtl"] .slick-next {
    left: -25px;
    right: auto; }
  .slick-next:before {
    content: "→"; }
    [dir="rtl"] .slick-next:before {
      content: "←"; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px; }

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%; }
  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; }
    .slick-dots li button {
      border: 0;
      background: transparent;
      display: block;
      height: 20px;
      width: 20px;
      outline: none;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer; }
      .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none; }
        .slick-dots li button:hover:before, .slick-dots li button:focus:before {
          opacity: 1; }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        content: "•";
        width: 20px;
        height: 20px;
        font-family: "slick";
        font-size: 6px;
        line-height: 20px;
        text-align: center;
        color: black;
        opacity: 0.25;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale; }
    .slick-dots li.slick-active button:before {
      color: black;
      opacity: 0.75; }

/**
 * Profound Grid
 * 
 * Built in Sass (SCSS) this responsive/adaptive grid supports both fixed and fluid layouts, 
 * relative and fixed gutters, as well as your choice of semantic markup or generic '.grid-x' classes.
 * 
 * The biggest difference to other grid systems is the use of negative margins for column
 * placements, avoiding the subpixel rounding issues that usually break/uglify fluid layouts
 * in some browsers.
 * 
 * Nested columns are supported too, without having to reset the grid on each level. 
 *
 * Credits/Inspiration:
 * -------------------
 * Semantic Grid: http://www.semantic.gs
 * Susy: http://susy.oddbird.net
 * Negative Grid: http://chrisplaneta.com/freebies/negativegrid-fluid-css-grid-by-chris-planeta/
 *
 * @author Profound Creative Studio
 * @url http://www.profoundgrid.com
 * @url http://www.weareprofound.com 
 */
/**
 * Clearfix
 */
/**
 * Legacy Clearfix
 */
/**
 * Establish the grid-containing element.
 */
/**
 * Align an element to the grid.
 */
/**
 * Apply to any column to make it the last one of the current row.
 */
/* ************************************
 *
 * SCSS Media Queries Mixins
 * 
 * Aauthor   : Ryuichi Nonaka
 * Version   : 0.5.0
 * Copyright : 2012 Ryuichi Nonaka
 * Date      : 2013/08/07
 *
 * Released under the MIT license
 *
 *********************************** */
/* ***********************************
書き方のサンプル
第一引数にmin-width 第2引数にmax-width
div {
//media queries
@include mq( 0px, 320px ) {
margin-left: 5px;
margin-right: 5px;
}
}

 *********************************** */
/* ************************************
 *
 * MediaQueries Mixin
 * Initialize variables
 *
 * @param $min-width: num - Minimum device width.
 * @param $max-width: num - Maximum device width.
 * @param $resolution: num - Device pixel ratio.
 * @param $orientation: string or boolean [portrait|landscape|false] - Device orientation.
 *
 *********************************** */
/*basic
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html {
  font-size: 62.5%;
  text-rendering: optimizelegibility; }

body {
  font-size: 12px;
  font-size: 1.2rem;
  background: #fff;
  color: #333;
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  line-height: 1.7;
  margin: 0 auto;
  margin: 0;
  padding: 0; }
  @media only screen and (min-width: 0px) and (max-width: 768px) {
    body {
      background: none;
      min-width: 0; } }

a {
  text-decoration: underline;
  color: #069;
  cursor: pointer;
  background-color: transparent;
  outline: none; }
  a:hover {
    color: #00aceb; }

h1 {
  margin: 0; }

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  text-decoration: none; }

img {
  vertical-align: bottom;
  max-width: 100%; }

section {
  overflow: hidden;
  *zoom: 1;
  margin: 0 0 60px; }
  @media only screen and (min-width: 0) and (max-width: 768px) {
    section {
      margin: 0 0 30px; } }

/*container
///////////////////////////////////////////////////////////////////*/
#container {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0; }

/*header
///////////////////////////////////////////////////////////////////*/
header {
  margin: 0 auto;
  z-index: 20;
  position: relative;
  color: #fff;
  background: #000; }
  header .header_container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    *zoom: 1; }
    header .header_container .headerLogo {
      display: inline-block;
      margin: 0;
      float: left;
      padding: 10px 0 0 20px; }
      header .header_container .headerLogo img {
        width: 390px;
        height: 62px;
        display: block; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          header .header_container .headerLogo img {
            width: 50%;
            height: auto;
            padding: 5px 0 0; } }
        @media only screen and (min-width: 0px) and (max-width: 768px) {
          header .header_container .headerLogo img {
            width: 70%;
            height: auto;
            padding: 5px 0 0; } }
    @media only screen and (min-width: 768px) and (max-width: 3000px) {
      header .header_container {
        min-height: 80px; } }
    header .header_container .nav {
      float: right;
      margin-top: 20px;
      font-size: 10px;
      font-size: 1rem; }
      header .header_container .nav ul {
        margin: 0;
        margin: 0;
        padding: 0;
        float: right;
        line-height: 1;
        overflow: hidden;
        *zoom: 1; }
        @media only screen and (min-width: 0px) and (max-width: 1000px) {
          header .header_container .nav ul {
            float: none; } }
        header .header_container .nav ul li {
          margin: 0;
          padding: 0;
          float: left;
          border-right: 1px solid #fff;
          padding: 0 10px;
          list-style: none; }
          header .header_container .nav ul li a {
            display: inline-block;
            color: #fff;
            text-decoration: none; }
          header .header_container .nav ul li .current {
            color: #fff721; }

/* ナビゲーション
///////////////////////////////////////////////////////////////////*/
.slicknav_menu {
  display: none; }

@media screen and (max-width: 1200px) {
  /* #menu is the original menu */
  .js #menu {
    display: none; }

  .js .slicknav_menu {
    display: block; } }
/*main
///////////////////////////////////////////////////////////////////*/
/*2カラム
=====================*/
/*パンくず
=====================*/
/*ローカルナビ
=====================*/
/*テーブル
=====================*/
table {
  border-collapse: collapse;
  text-align: left;
  line-height: 1.5;
  border: 1px solid #cdcdcb;
  word-wrap: break-word;
  width: 100%; }
  table thead th {
    padding: 10px;
    border-bottom: 3px double #cdcdcb;
    border-right: 1px solid #cdcdcb; }
  table tbody th {
    padding: 10px;
    font-weight: bold;
    border-bottom: 1px solid #cdcdcb;
    border-right: 1px solid #cdcdcb; }
  table tbody td {
    padding: 10px;
    border-bottom: 1px solid #cdcdcb;
    border-right: 1px solid #cdcdcb; }

/*レイアウト
=====================*/
.textR {
  text-align: right; }

.textC {
  text-align: center; }

.textL {
  text-align: left; }

.gleyBox {
  background: #e4e4e4;
  padding: 5px 10px; }

.wtBox {
  background: #fff;
  padding: 20px;
  margin-bottom: 10px; }
  .wtBox h3 {
    margin-top: 0; }

.note {
  color: #990000; }

.mb10 {
  margin-bottom: 10px; }

.mb20 {
  margin-bottom: 20px; }

.mb30 {
  margin-bottom: 30px; }

/*ボタン
=====================*/
.button {
  margin: 20px 0; }
  .button a {
    background: #99040C;
    color: #fff;
    border: none;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 1.5em 2em;
    cursor: pointer;
    transition: 800ms ease all;
    outline: none;
    margin: 0 0 20px 0;
    border: 1px dotted #99040C; }
    .button a:before {
      content: '';
      height: 100%;
      display: inline-block;
      vertical-align: middle; }
    .button a:hover {
      background: #fff;
      color: #99040C;
      border: 1px solid #99040C; }

.buttonPDF {
  margin: 20px 0; }
  .buttonPDF a {
    background: #fff;
    color: #99040C;
    border: none;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 1em 1.4em;
    cursor: pointer;
    transition: 800ms ease all;
    outline: none;
    margin: 0 0 20px 0;
    border: 1px dotted #99040C; }
    .buttonPDF a:before {
      content: '';
      height: 100%;
      display: inline-block;
      vertical-align: middle; }
    .buttonPDF a:after {
      font-family: 'icomoon';
      content: "\eada";
      display: inline-block;
      font-size: 14px;
      font-size: 1.4rem;
      margin-left: 5px; }
    .buttonPDF a:hover {
      color: #fff;
      border: 1px solid #99040C;
      background: #99040C; }
    .buttonPDF a .file_icon {
      display: none; }

.buttonList {
  display: -webkit-flex;
  display: flex;
  flex-flow: space-between;
  padding-left: 0; }
  .buttonList li {
    list-style: none;
    margin-right: 10px; }
  @media only screen and (min-width: 0) and (max-width: 480px) {
    .buttonList {
      display: block; }
      .buttonList li a {
        margin-bottom: 0; } }

.campsuBtn ul {
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  justify-content: center; }
  .campsuBtn ul li {
    width: 30%;
    list-style: none;
    text-align: center;
    margin-right: 10px;
    padding: 10px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */ }
    .campsuBtn ul li a {
      display: block;
      text-decoration: none;
      font-weight: bold; }
      .campsuBtn ul li a .text {
        display: block;
        font-weight: normal; }
    @media only screen and (min-width: 0) and (max-width: 600px) {
      .campsuBtn ul li {
        width: 100%;
        margin: 0 0 10px; } }
  .campsuBtn ul .kic {
    background: #FFF1A5; }
  .campsuBtn ul .bkc {
    background: #C3E5F4; }
  .campsuBtn ul .oic {
    background: #F9D2BD; }

/*faq
///////////////////////////////////////////////////////////////////*/
dl.accordion {
  border-top: 1px solid #e3e3e3;
  text-align: left;
  margin: 0;
  font-size: 12px;
  font-size: 1.2rem; }
  dl.accordion dt {
    background: url("/gengo/assets/img/common/faq-icon-q.png") no-repeat scroll 4px 7px;
    display: block;
    padding: 11px 0 10px 45px;
    text-decoration: none;
    cursor: pointer;
    width: 100%; }
  dl.accordion dd {
    background: #f6f6f6 url("/gengo/assets/img/common/faq-icon-a.png") no-repeat scroll 7px 10px;
    display: none;
    margin: 0;
    padding: 10px 20px 10px 45px;
    min-height: 45px; }

/*Link
///////////////////////////////////////////////////////////////////*/
.link {
  text-decoration: none; }
  .link:before {
    font-family: 'icomoon';
    content: "\ea1c";
    color: #99040C;
    display: inline-block;
    margin-right: 3px; }

.icon-new {
  text-decoration: none; }
  .icon-new:before {
    font-family: 'icomoon';
    content: "\e905";
    color: #f9c743;
    border: 1px solid #f9c743;
    padding: 2px;
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle; }

.icon-end {
  text-decoration: none; }
  .icon-end:before {
    font-family: 'icomoon';
    content: "\e906";
    color: #990000;
    border: 1px solid #990000;
    padding: 2px;
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle; }

.icon-pdf {
  text-decoration: none; }
  .icon-pdf:after {
    font-family: 'icomoon';
    content: "\eada";
    display: inline-block;
    font-size: 13px;
    font-size: 1.3rem;
    margin-left: 5px;
    color: #990000; }

.icon-word {
  text-decoration: none; }
  .icon-word:after {
    font-family: 'icomoon';
    content: "\eadc";
    display: inline-block;
    font-size: 13px;
    font-size: 1.3rem;
    margin-left: 5px;
    color: #005387; }

.newlink2 {
  padding-left: 20px;
  background: url("/gengo/assets/img/common/icon-new.png") no-repeat 0 0;
  display: inline-block;
  min-height: 18px;
  text-decoration: none; }

/*SNS
///////////////////////////////////////////////////////////////////*/
#sns ul {
  text-align: center;
  margin: 20px auto; }
  #sns ul li {
    display: inline; }
    #sns ul li a:before {
      font-family: 'icomoon';
      padding: 10px;
      display: inline-block;
      margin-right: 5px;
      vertical-align: middle;
      font-size: 14px;
      font-size: 1.4rem;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      -webkit-border-radius: 50%;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 50%;
      /* Firefox用 */ }

.snsIcon-google {
  text-decoration: none; }
  .snsIcon-google:before {
    content: "\e907";
    color: #d64532;
    border: 1px solid #d64532; }

.snsIcon-facebook {
  text-decoration: none; }
  .snsIcon-facebook:before {
    content: "\e908";
    color: #4966a0;
    border: 1px solid #4966a0; }

.snsIcon-instagram {
  text-decoration: none; }
  .snsIcon-instagram:before {
    content: "\e909";
    color: #a67a60;
    border: 1px solid #a67a60; }

.snsIcon-twitter {
  text-decoration: none; }
  .snsIcon-twitter:before {
    content: "\e90a";
    color: #54a7eb;
    border: 1px solid #54a7eb; }

/*footer
///////////////////////////////////////////////////////////////////*/
.footer {
  z-index: 10; }
  .footer .footer_container {
    margin: 0 auto;
    width: 100%;
    max-width: 1200px; }
    @media only screen and (min-width: 0) and (max-width: 480px) {
      .footer .footer_container {
        padding: 0; } }
    .footer .footer_container .returnTop {
      right: 0;
      width: 100%;
      margin: 0 auto;
      text-align: right; }
      @media only screen and (min-width: 0) and (max-width: 480px) {
        .footer .footer_container .returnTop {
          width: 100%;
          padding: 0;
          text-align: center; } }
      @media only screen and (min-width: 481px) and (max-width: 768px) {
        .footer .footer_container .returnTop {
          padding-right: 20px; } }
      .footer .footer_container .returnTop a {
        width: 150px;
        display: inline-block;
        line-height: 1;
        font-size: 12px;
        font-size: 1.2rem;
        padding: 8px 16px 4px;
        color: #333;
        text-decoration: none;
        background: #e4e4e4; }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          .footer .footer_container .returnTop a {
            background: #000;
            padding: 12px 0;
            margin: 0;
            display: inline-block;
            width: 100%;
            text-align: center; } }
        .footer .footer_container .returnTop a:after {
          font-family: "icomoon";
          content: "\ea3a";
          display: inline-block;
          font-size: 13px;
          vertical-align: top; }
          @media only screen and (min-width: 0) and (max-width: 480px) {
            .footer .footer_container .returnTop a:after {
              font-size: 18px;
              color: #fff;
              vertical-align: middle; } }
        .footer .footer_container .returnTop a .text {
          margin: 0 5px 0 0; }
          @media only screen and (min-width: 0) and (max-width: 480px) {
            .footer .footer_container .returnTop a .text {
              display: none; } }
  .footer .footerBody {
    width: 100%;
    position: relative;
    background: #e4e4e4; }
    @media only screen and (min-width: 0) and (max-width: 768px) {
      .footer .footerBody {
        min-width: 0; } }
    .footer .footerBody .inner {
      position: relative;
      max-width: 1200px;
      margin: 0 auto;
      padding: 20px 10px 0;
      overflow: visible;
      background: transparent;
      overflow: hidden;
      *zoom: 1; }
      @media only screen and (min-width: 0) and (max-width: 480px) {
        .footer .footerBody .inner {
          padding: 15px 20px 10px;
          min-width: 0; } }
      @media only screen and (min-width: 481px) and (max-width: 768px) {
        .footer .footerBody .inner {
          padding: 20px;
          min-width: 0; } }
      .footer .footerBody .inner .footerNav {
        float: left; }
        .footer .footerBody .inner .footerNav .navUl {
          overflow: hidden;
          *zoom: 1; }
          .footer .footerBody .inner .footerNav .navUl li {
            display: inline-block;
            border-right: 1px solid #666; }
            .footer .footerBody .inner .footerNav .navUl li a {
              display: block;
              text-decoration: none;
              font-weight: bold;
              padding: 0 10px 0 5px; }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          .footer .footerBody .inner .footerNav {
            float: none; }
            .footer .footerBody .inner .footerNav .navUl {
              margin: 0;
              padding: 0; }
              .footer .footerBody .inner .footerNav .navUl li {
                display: block;
                border-right: 0;
                border-bottom: 1px dotted #666; } }
      .footer .footerBody .inner .copyright {
        color: #333;
        font-size: 12px;
        font-size: 1.2rem;
        float: right; }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          .footer .footerBody .inner .copyright {
            float: none;
            width: 100%;
            text-align: center; } }

      .footer .footerBody .inquiry {
      max-width: 1200px;
      margin: 0 10px;
      padding: 5px 10px 5px;
      overflow: visible;
      background: transparent;
      overflow: hidden;
      *zoom: 1;}
      @media only screen and (min-width: 0) and (max-width: 480px) {
        .footer .footerBody .inquiry {
          padding: 0 20px 10px;
          min-width: 0; } }
      @media only screen and (min-width: 481px) and (max-width: 768px) {
        .footer .footerBody .inquiry {
          padding: 0 auto;
          min-width: 0; } }
      .footer .footerBody .inquiry .inquiry_detail {
        color: #333;
        font-size: 12px;
        font-size: 1.2rem;
        float: left; }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          .footer .footerBody .inner .inquiry_detail {
            float: left;
            width: 100%;
            text-align: left; } }

/*home
///////////////////////////////////////////////////////////////////*/
.home .topMain {
  max-width: 1500px;
  margin: 0 auto;
  z-index: 1; }
  .home .topMain .homeImg {
    width: 100%;
    max-width: 1500px;
    height: auto; }
    @media only screen and (min-width: 0px) and (max-width: 768px) {
      .home .topMain .homeImg {
        width: 100%;
        height: auto; } }
    @media only screen and (min-width: 769px) and (max-width: 1024px) {
      .home .topMain .homeImg {
        width: 100%;
        height: auto; } }
.home .content .main article {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; }
  .home .content .main article #program .program-title {
    overflow: hidden;
    *zoom: 1;
    color: #023f99;
    font-size: 24px;
    font-size: 2.4rem;
    font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    font-weight: normal;
    text-align: center;
    margin: 50px 0; }
  .home .content .main article #program #program-list {
    max-width: 1200px;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    padding: 0; }
    .home .content .main article #program #program-list li {
      position: relative;
      list-style: none;
      margin: 0 auto;
      width: 32%; }
      .home .content .main article #program #program-list li a {
        color: #fff;
        text-decoration: none; }
        .home .content .main article #program #program-list li a .programTitle {
          font-family: "Noto Sans Japanese", serif;
          text-align: center;
          font-size: 24px;
          font-size: 2.4rem;
          font-weight: normal;
          margin: 20px 0; }
          .home .content .main article #program #program-list li a .programTitle::before {
            font-family: 'icomoon';
            display: inline-block;
            text-align: center;
            font-size: 40px;
            font-size: 4rem;
            border: 2px solid #fff;
            width: 70px;
            height: 70px;
            border-radius: 50px;
            -webkit-border-radius: 50px;
            /* Safari,Google Chrome用 */
            -moz-border-radius: 50px;
            /* Firefox用 */
            white-space: pre; }
          .home .content .main article #program #program-list li a .programTitle span {
            display: block; }
        .home .content .main article #program #program-list li a .program-img {
          width: 100%;
          height: auto;
          max-width: 390px;
          max-height: 120px;
          display: inline-block; }
    .home .content .main article #program #program-list .program1 {
      background: #48bd6f; }
      .home .content .main article #program #program-list .program1 .programTitle::before {
        content: "\e901"; }
    .home .content .main article #program #program-list .program2 {
      background: #48bdbd; }
      .home .content .main article #program #program-list .program2 .programTitle::before {
        content: "\e900"; }
    .home .content .main article #program #program-list .program3 {
      background: #02a7d9; }
      .home .content .main article #program #program-list .program3 .programTitle::before {
        content: "\e902"; }
  @media only screen and (min-width: 0) and (max-width: 480px) {
    .home .content .main article #program .program-title {
      font-size: 16px;
      font-size: 1.6rem;
      padding: 0 10px; }
    .home .content .main article #program #program-list {
      display: block; }
      .home .content .main article #program #program-list li {
        margin-bottom: 10px;
        width: 100%; }
        .home .content .main article #program #program-list li a .programTitle {
          font-size: 18px;
          font-size: 1.8rem;
          padding-top: 10px;
          margin-bottom: 10px; }
          .home .content .main article #program #program-list li a .programTitle::before {
            font-size: 30px;
            font-size: 3rem;
            width: 50px;
            height: 50px; } }
  @media only screen and (min-width: 481px) and (max-width: 780px) {
    .home .content .main article #program {
      max-width: 780px; }
      .home .content .main article #program #program-list li a .programTitle {
        font-size: 20px;
        font-size: 2rem; }
        .home .content .main article #program #program-list li a .programTitle::before {
          font-size: 30px;
          font-size: 3rem;
          width: 50px;
          height: 50px; } }
  @media only screen and (min-width: 781px) and (max-width: 1280px) {
    .home .content .main article #program {
      max-width: 1280px; } }
  .home .content .main article #otherContents {
    margin: 0 auto 30px;
    width: 100%; }
    .home .content .main article #otherContents .otherContents-title {
      text-align: center; }
    .home .content .main article #otherContents #otherContents-list {
      display: table;
      margin: 0 auto;
      padding: 0;
      width: 100%; }
      .home .content .main article #otherContents #otherContents-list li {
        display: table-cell;
        width: 25%;
        position: relative;
        list-style: none;
        text-align: center; }
        .home .content .main article #otherContents #otherContents-list li a {
          text-decoration: none;
          color: #333; }
          .home .content .main article #otherContents #otherContents-list li a .otherTitle {
            font-size: 16px;
            font-size: 1.6rem;
            font-family: "Noto Sans Japanese", serif;
            font-weight: bold;
            margin: 20px 0 5px;
            line-height: 1.2; }
    @media only screen and (min-width: 0) and (max-width: 480px) {
      .home .content .main article #otherContents #otherContents-list li {
        width: 100%;
        display: block;
        position: relative;
        list-style: none;
        text-align: center; }
        .home .content .main article #otherContents #otherContents-list li a {
          text-decoration: none;
          color: #333; }
          .home .content .main article #otherContents #otherContents-list li a .otherTitle {
            font-size: 16px;
            font-size: 1.6rem;
            font-family: "Noto Sans Japanese", serif;
            font-weight: bold;
            margin: 20px 0 5px;
            line-height: 1.2; } }

#access .topMain {
  margin: 0 auto;
  z-index: 1;
  background: url("/gengo/assets/img/home/access/officeMain-image.png") no-repeat center top; }
  #access .topMain h1 {
    color: #333;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: center;
    padding: 10px 0;
    margin: 0 0 30px; }
    @media only screen and (min-width: 0px) and (max-width: 780px) {
      #access .topMain h1 {
        font-size: 24px;
        font-size: 2.4rem; } }
    #access .topMain h1 .icon-center {
      text-align: center; }
      @media only screen and (min-width: 0px) and (max-width: 780px) {
        #access .topMain h1 .icon-center {
          width: 80px;
          height: auto; } }
    #access .topMain h1 span {
      display: block; }
#access .content .main article {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 60px; }
  #access .content .main article #campusMap {
    display: -webkit-flex;
    display: flex;
    justify-content: space-between; }
    #access .content .main article #campusMap .campusBox {
      width: 32%;
      font-size: 13px;
      font-size: 1.3rem; }
      #access .content .main article #campusMap .campusBox h2 {
        font-size: 20px;
        font-size: 2rem;
        text-align: center; }
        #access .content .main article #campusMap .campusBox h2 span {
          font-size: 16px;
          font-size: 1.6rem;
          display: block;
          font-weight: 200; }
      #access .content .main article #campusMap .campusBox .mapImage {
        width: 100%;
        height: auto;
        display: inline-block; }
      #access .content .main article #campusMap .campusBox dl dt {
        display: inline-block;
        background: #e4e4e4;
        padding: 3px 5px; }
      #access .content .main article #campusMap .campusBox dl dd {
        margin: 0 0 10px 0;
        font-weight: bold; }
  #access .content .main article .gleyBox {
    font-size: 13px;
    font-size: 1.3rem;
    padding: 10px; }
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #access .content .main article #campusMap {
      display: block; }
      #access .content .main article #campusMap .campusBox {
        border-bottom: 5px solid #e4e4e4;
        width: 100%; } }
  @media only screen and (min-width: 489px) and (max-width: 1024px) {
    #access .content .main article #campusMap {
      flex-wrap: wrap; }
      #access .content .main article #campusMap .campusBox {
        width: 46%;
        height: auto; } }

/*introduce
///////////////////////////////////////////////////////////////////*/
#introduce .topMain {
  margin: 0 auto;
  z-index: 1;
  background: url("/gengo/assets/img/home/introduce/officeMain-image.png") no-repeat center top; }

#introduce .topMain h1 {
  color: #333;
  font-size: 48px;
  font-size: 4.8rem;
  text-align: center;
  padding: 10px 0;
  margin: 0 0 30px; }

@media only screen and (min-width: 0px) and (max-width: 780px) {
  #introduce .topMain h1 {
    font-size: 24px;
    font-size: 2.4rem; } }
#introduce .topMain h1 .icon-center {
  text-align: center; }

@media only screen and (min-width: 0px) and (max-width: 780px) {
  #introduce .topMain h1 .icon-center {
    width: 80px;
    height: auto; } }
#introduce .topMain h1 span {
  display: block; }

#introduce .content .main article {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 60px; }

#introduce #container article #tabmenu {
  margin: 0 20px 10px; }

#introduce #container article #tabmenu .r-tabs {
  position: relative;
  padding: 10px; }

#introduce #container article #tabmenu .r-tabs .frame {
  position: relative;
  background: #fff; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav {
  margin: 0 auto 40px;
  padding: 0;
  text-align: center;
  width: 100%; }

/*#introduce #container article #tabmenu h3 {
  font-size: 20px;
  font-size: 2rem;
  color: #efc147;
  width: 94%;
  margin: 20px auto;
  position: relative; }*/
#introduce #container article #tabmenu h4 {
  font-size: 16px;
  font-size: 1.6rem;
  color: #fff;
  /*border-radius: 10px;*/
  /*border: 1px solid #999;*/
  background: #efc147;
  text-align: center;
  width: 94%;
  margin: 20px auto 35px;
  padding: 13px 0; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab {
  position: relative;
  display: inline-block;
  margin-right: 1.5%;
  padding: 0;
  list-style: none;
  text-decoration: none;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: bold;
  width: 30%; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab:last-child {
  margin-right: 0; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab a {
  background: #fff;
  border: 1px solid #ccc;
  width: 100%;
  height: 130px;
  line-height: 145px; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab a::before {
  content: '';
  width: 35px;
  height: 35px;
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translate(-50%, 0); }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab a.tab-1::before {
  background: url(/gengo/assets/img/home/introduce/introduce-icon01.png) no-repeat;
  background-size: contain; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab a.tab-2::before {
  background: url(/gengo/assets/img/home/introduce/introduce-icon02.png) no-repeat;
  background-size: contain;
  width: 32px;
  height: 32px; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab a.tab-3::before {
  background: url(/gengo/assets/img/home/introduce/introduce-icon03.png) no-repeat;
  background-size: contain;
  width: 34px;
  height: 34px; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-tab a.tab-4::before {
  background: url(/gengo/assets/img/home/introduce/introduce-icon04.png) no-repeat;
  background-size: contain;
  width: 20px; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-anchor {
  color: #666;
  display: inline-block;
  font-weight: bold;
  padding: 10px 12px;
  text-decoration: none; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
  color: #efc147;
  text-shadow: none;
  border: 1px solid #ccc;
  background: #fff5ec; }

#introduce #container article #tabmenu .r-tabs .r-tabs-nav .r-tabs-state-disabled {
  opacity: 0.5; }

#introduce #container article #tabmenu .r-tabs .r-tabs-panel {
  display: none; }

#introduce #container article #tabmenu .r-tabs .r-tabs-panel .r-tabs-state-active {
  display: block; }

#introduce #container article #tabmenu .r-tabs .r-tabs-accordion-title {
  display: none; }

#introduce #container article #tabmenu .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
  display: block;
  padding: 10px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  font-size: 14px; }

#introduce #container article #tabmenu .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #efc147;
  color: #fff;
  text-shadow: none; }

#introduce #container article #tabmenu .r-tabs .tab-inner {
  width: 94%;
  margin: 0 auto 40px;
  padding: 0 10px;
  font-size: 1.4rem; }

#introduce #container article #tabmenu .r-tabs .tab-inner .textBox {
  background: #eee;
  padding: 10px 35px;
  margin-bottom: 40px; }

#introduce #container article #tabmenu .r-tabs .tab-inner .numList {
  list-style: none;
  padding-left: 5px; }

#introduce #container article #tabmenu .r-tabs .tab-inner .numList li {
  position: relative;
  padding-left: 27px;
  line-height: 19px;
  margin: 0 0 8px 0; }

#introduce #container article #tabmenu .r-tabs .tab-inner .numList li .num {
  position: absolute;
  left: 0;
  font-size: 1.2rem;
  line-height: 17.5px;
  background: #ed8e32;
  color: #fff;
  width: 17px;
  height: 17px;
  padding: 0 5px;
  border-radius: 50%; }

#introduce #container article #tabmenu .r-tabs .tab-inner .flowBox {
  margin-top: 30px; }

#introduce #container article #tabmenu .r-tabs .tab-inner .flowBox p.photo {
  width: 35%;
  float: left;
  margin: 0 30px 30px 0; }

#introduce #container article #tabmenu .r-tabs .tab-inner .flowBox p.photo img {
  width: 100%; }

#introduce #container article #tabmenu .r-tabs .tab-inner .flowBox::after {
  content: ".";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden; }

@media only screen and (min-width: 0px) and (max-width: 755px) {
  #introduce #container article #tabmenu {
    margin: 10px 0; }

  #introduce #container article #tabmenu .r-tabs .r-tabs-nav {
    display: none;
    margin-bottom: 40px; }

  #introduce #container article #tabmenu .r-tabs .r-tabs-accordion-title {
    display: block;
    border-bottom: 1px solid #fff; }

  #introduce #container article #tabmenu .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
    background: #858585; }

  #introduce #container article #tabmenu .r-tabs r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #e4e4e4; }

  #introduce #container article #tabmenu .r-tabs .tab-inner {
    width: 90%; }

  #introduce #container article #tabmenu .r-tabs .tab-inner .flowBox {
    margin: 0 0 0 0; }

  #introduce #container article #tabmenu .r-tabs .tab-inner .flowBox p.photo {
    width: 70%;
    float: none;
    margin: 0 auto 30px; } }
#introduce .content .main article #campusMap {
  display: -webkit-flex;
  display: flex;
  justify-content: space-between; }

#introduce .content .main article #campusMap .campusBox {
  width: 32%;
  font-size: 13px;
  font-size: 1.3rem; }

#introduce .content .main article #campusMap .campusBox h2 {
  font-size: 20px;
  font-size: 2rem;
  text-align: center; }

#introduce .content .main article #campusMap .campusBox h2 span {
  font-size: 16px;
  font-size: 1.6rem;
  display: block;
  font-weight: 200; }

#introduce .content .main article #campusMap .campusBox .mapImage {
  width: 100%;
  height: auto;
  display: inline-block; }

#introduce .content .main article #campusMap .campusBox dl dt {
  display: inline-block;
  background: #e4e4e4;
  padding: 3px 5px; }

#introduce .content .main article #campusMap .campusBox dl dd {
  margin: 0 0 10px 0;
  font-weight: bold; }

#introduce .content .main article .gleyBox {
  font-size: 13px;
  font-size: 1.3rem;
  padding: 10px; }

@media only screen and (min-width: 0px) and (max-width: 480px) {
  #introduce .content .main article #campusMap {
    display: block; }

  #introduce .content .main article #campusMap .campusBox {
    border-bottom: 5px solid #e4e4e4;
    width: 100%; } }
@media only screen and (min-width: 489px) and (max-width: 1024px) {
  #introduce .content .main article #campusMap {
    flex-wrap: wrap; }

  #introduce .content .main article #campusMap .campusBox {
    width: 46%;
    height: auto; } }
/*cla
///////////////////////////////////////////////////////////////////*/
#claIndex #container {
  background: #02a7d9; }
#claIndex .topMain {
  max-width: 1200px;
  margin: 0 auto;
  padding-bottom: 30px;
  background: #fff;
  z-index: 1; }
  #claIndex .topMain .homeImg {
    width: 100%;
    max-width: 1200px;
    height: auto; }
    @media only screen and (min-width: 0px) and (max-width: 768px) {
      #claIndex .topMain .homeImg {
        width: 100%;
        height: auto; } }
    @media only screen and (min-width: 769px) and (max-width: 1024px) {
      #claIndex .topMain .homeImg {
        width: 100%;
        height: auto; } }
#claIndex .content {
  background: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px; }
  #claIndex .content .main article {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; }
    #claIndex .content .main article .newsTopContents {
      overflow: hidden;
      *zoom: 1;
      width: 100%;
      max-width: 1110px;
      margin: 0 auto; }
      #claIndex .content .main article .newsTopContents #news {
        width: 60%;
        float: left;
        border-top: 3px solid #000;
        position: relative;
        margin-bottom: 30px; }
        #claIndex .content .main article .newsTopContents #news h2 {
          font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
          font-size: 18px;
          font-size: 1.8rem;
          margin: 10px 0; }
        #claIndex .content .main article .newsTopContents #news .sub-link {
          position: absolute;
          right: 5px;
          top: 5px; }
        #claIndex .content .main article .newsTopContents #news ul {
          padding-left: 0;
          height: 200px;
          overflow: auto;
          -webkit-overflow-scrolling: touch;
          border-top: 1px solid #dedede;
          border-bottom: 1px solid #dedede; }
          #claIndex .content .main article .newsTopContents #news ul li {
            padding: 5px 0;
            margin-bottom: 3px;
            border-bottom: 1px dotted #ccc;
            font-size: 12px;
            font-size: 1.2rem; }
            #claIndex .content .main article .newsTopContents #news ul li .date {
              font-size: 10px;
              font-size: 1rem;
              color: #858585; }
            #claIndex .content .main article .newsTopContents #news ul li a {
              display: block;
              text-decoration: none; }
          #claIndex .content .main article .newsTopContents #news ul .icon {
            display: block;
            padding-left: 95px;
            text-decoration: none; }
          #claIndex .content .main article .newsTopContents #news ul .newsToeic {
            background: url("/gengo/assets/img/cla/newsIcon-toeic.png") no-repeat 0 7px; }
          #claIndex .content .main article .newsTopContents #news ul .newsToefl {
            background: url("/gengo/assets/img/cla/newsIcon-toefl.png") no-repeat 0 7px; }
          #claIndex .content .main article .newsTopContents #news ul .newsIelts {
            background: url("/gengo/assets/img/cla/newsIcon-ielts.png") no-repeat 0 7px; }
          #claIndex .content .main article .newsTopContents #news ul .newskaiwa {
            background: url("/gengo/assets/img/cla/newsIcon-kaiwa.png") no-repeat 0 7px; }
          #claIndex .content .main article .newsTopContents #news ul .newsSyosyu {
            background: url("/gengo/assets/img/cla/newsIcon-syosyu.png") no-repeat 0 7px; }
          #claIndex .content .main article .newsTopContents #news ul .newsCommon {
            background: url("/gengo/assets/img/cla/newsIcon-common.png") no-repeat 0 7px; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #claIndex .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
        @media only screen and (min-width: 481px) and (max-width: 1024px) {
          #claIndex .content .main article .newsTopContents #news {
            width: 50%; } }
      #claIndex .content .main article .newsTopContents #bannerArea {
        width: 100%;
        max-width: 400px;
        margin: 0 auto 30px;
        position: relative;
        float: right; }
        #claIndex .content .main article .newsTopContents #bannerArea .bigBnr {
          margin-bottom: 20px;
          width: 100%;
          height: auto; }
          #claIndex .content .main article .newsTopContents #bannerArea .bigBnr a img {
            width: 98%;
            height: auto; }
        #claIndex .content .main article .newsTopContents #bannerArea .smallBnr {
          display: -webkit-flex;
          /*--- safari（PC）用 ---*/
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #claIndex .content .main article .newsTopContents #bannerArea {
            width: 100%;
            max-width: 480px;
            float: none;
            text-align: center; }
            #claIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
              width: 50%;
              height: auto; }
              #claIndex .content .main article .newsTopContents #bannerArea .smallBnr a img {
                width: 95%;
                height: auto; } }
        @media only screen and (min-width: 481px) and (max-width: 1024px) {
          #claIndex .content .main article .newsTopContents #bannerArea {
            width: 48%; }
            #claIndex .content .main article .newsTopContents #bannerArea .bigBnr {
              width: 100%; }
              #claIndex .content .main article .newsTopContents #bannerArea .bigBnr img {
                width: 100%;
                height: auto; }
            #claIndex .content .main article .newsTopContents #bannerArea .smallBnr {
              width: 100%; }
              #claIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
                width: 50%; }
                #claIndex .content .main article .newsTopContents #bannerArea .smallBnr a img {
                  width: 95%;
                  height: auto; } }
    #claIndex .content .main article .twocolumn {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap;
      width: 100%;
      max-width: 1110px;
      margin: 0 auto; }
      #claIndex .content .main article .twocolumn #efficient {
        background: #dff2fc;
        width: 65%;
        padding: 10px 20px; }
        #claIndex .content .main article .twocolumn #efficient h2 {
          color: #06a9d6;
          font-size: 20px;
          font-size: 2rem; }
        #claIndex .content .main article .twocolumn #efficient p {
          font-size: 13px;
          font-size: 1.3rem; }
      #claIndex .content .main article .twocolumn #bannerBox {
        width: 32%;
        text-align: center;
        margin-left: 2%; }
        #claIndex .content .main article .twocolumn #bannerBox .bannerOne {
          background: #dff2fc; }
          #claIndex .content .main article .twocolumn #bannerBox .bannerOne h2 {
            color: #06a9d6;
            margin: 0;
            padding: 10px 0; }
          #claIndex .content .main article .twocolumn #bannerBox .bannerOne p {
            margin: 0;
            padding-bottom: 10px; }
        #claIndex .content .main article .twocolumn #bannerBox h3 {
          margin: 10px 0 0; }
        #claIndex .content .main article .twocolumn #bannerBox .bannerTwo {
          display: -webkit-flex;
          display: flex;
          flex-wrap: wrap;
          width: 100%; }
          #claIndex .content .main article .twocolumn #bannerBox .bannerTwo .buttonBnr {
            width: 48%;
            margin: 0 1%; }
            #claIndex .content .main article .twocolumn #bannerBox .bannerTwo .buttonBnr a {
              width: 100%;
              text-align: center;
              font-weight: bold;
              background: #fff;
              color: #99040C;
              display: inline-block;
              padding: 1em 0.5em;
              cursor: pointer;
              text-decoration: none;
              transition: 800ms ease all;
              outline: none;
              border: 1px dotted #99040C; }
              #claIndex .content .main article .twocolumn #bannerBox .bannerTwo .buttonBnr a:hover {
                color: #fff;
                border: 1px solid #99040C;
                background: #99040C; }
      @media only screen and (min-width: 0px) and (max-width: 600px) {
        #claIndex .content .main article .twocolumn {
          width: 100%; }
          #claIndex .content .main article .twocolumn #efficient {
            width: 100%; }
          #claIndex .content .main article .twocolumn #bannerBox {
            width: 100%; } }
    #claIndex .content .main article #claContents {
      background: #efefef; }
      #claIndex .content .main article #claContents h2 {
        text-align: center;
        margin-top: -10px; }
      #claIndex .content .main article #claContents ul {
        margin: 0 auto;
        padding-left: 0;
        text-align: center; }
        #claIndex .content .main article #claContents ul li {
          display: inline-block;
          list-style: none;
          position: relative;
          margin: 0 15px 30px; }
          #claIndex .content .main article #claContents ul li a {
            display: block;
            width: 340px;
            height: 150px;
            color: #333;
            text-decoration: none;
            font-size: 18px;
            font-size: 1.8rem; }
            #claIndex .content .main article #claContents ul li a .contentsImg {
              position: absolute;
              left: 0;
              top: 0; }
            #claIndex .content .main article #claContents ul li a p {
              position: absolute;
              right: 0;
              top: 20px;
              width: 170px;
              text-align: center; }
            #claIndex .content .main article #claContents ul li a:after {
              font-family: "icomoon";
              content: "\ea1c";
              display: inline-block;
              color: #fff;
              text-align: center;
              background: #333;
              width: 20px;
              height: 20px;
              font-size: 12px;
              font-size: 1.2rem;
              position: absolute;
              bottom: 0;
              right: 0; }
        #claIndex .content .main article #claContents ul .toeic {
          background: #44d5b3; }
        #claIndex .content .main article #claContents ul .toefl {
          background: #62bef2; }
        #claIndex .content .main article #claContents ul .ielts {
          background: #ffd221; }
        #claIndex .content .main article #claContents ul .kaiwa {
          background: #dfa1ef; }
        #claIndex .content .main article #claContents ul .syosyu {
          background: #c2de51; }
        #claIndex .content .main article #claContents ul .flow {
          background: #4faaf0; }

.claProgram .topMain {
  margin: 0 auto;
  z-index: 1; }
  .claProgram .topMain h1 {
    color: #fff;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: center;
    padding: 30px 0;
    margin: 0 0 30px; }
    .claProgram .topMain h1::before {
      font-family: 'icomoon';
      content: "\e902";
      color: #858585;
      display: inline-block;
      font-size: 40px;
      font-size: 4rem;
      background: #fff;
      border-radius: 50px;
      -webkit-border-radius: 50px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 50px;
      /* Firefox用 */
      white-space: pre;
      width: 70px;
      height: 70px; }
    .claProgram .topMain h1 span {
      display: block; }
    @media only screen and (min-width: 0px) and (max-width: 780px) {
      .claProgram .topMain h1 {
        font-size: 28px;
        font-size: 2.8rem; }
        .claProgram .topMain h1::before {
          font-size: 30px;
          font-size: 3rem;
          width: 50px;
          height: 50px; } }
.claProgram .content {
  background: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px; }
  .claProgram .content .main article {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; }
    .claProgram .content .main article #outline {
      position: relative;
      min-height: 120px; }
      .claProgram .content .main article #outline .outlineImg {
        position: absolute;
        top: 10px;
        left: 30px; }
      .claProgram .content .main article #outline p {
        margin: 15px 10px 15px 200px;
        font-size: 13px;
        font-size: 1.3rem;
        line-height: 1.7; }
      .claProgram .content .main article #outline .wtBox {
        margin: 10px 10px 10px 200px; }
        .claProgram .content .main article #outline .wtBox p {
          margin-left: 0; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        .claProgram .content .main article #outline .outlineImg {
          display: none; }
        .claProgram .content .main article #outline p {
          margin: 15px 10px; }
        .claProgram .content .main article #outline .wtBox {
          margin-left: 10px; } }
    .claProgram .content .main article .newsTopContents {
      overflow: hidden;
      *zoom: 1;
      width: 100%;
      max-width: 1200px;
      margin: 0 auto; }
      .claProgram .content .main article .newsTopContents #news {
        width: 45%;
        float: left;
        border-top: 3px solid #000;
        position: relative; }
        .claProgram .content .main article .newsTopContents #news h2 {
          font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
          font-size: 18px;
          font-size: 1.8rem;
          margin: 10px 0;
          color: #333;
          text-align: left; }
        .claProgram .content .main article .newsTopContents #news .sub-link {
          position: absolute;
          right: 5px;
          top: 5px; }
        .claProgram .content .main article .newsTopContents #news ul {
          padding-left: 0;
          height: 170px;
          overflow: auto;
          -webkit-overflow-scrolling: touch;
          border-top: 1px solid #dedede;
          border-bottom: 1px solid #dedede; }
          .claProgram .content .main article .newsTopContents #news ul li {
            padding: 5px 0;
            margin-bottom: 3px;
            border-bottom: 1px dotted #ccc;
            font-size: 12px;
            font-size: 1.2rem; }
            .claProgram .content .main article .newsTopContents #news ul li .date {
              font-size: 10px;
              font-size: 1rem;
              color: #858585; }
            .claProgram .content .main article .newsTopContents #news ul li a {
              display: block;
              text-decoration: none; }
          .claProgram .content .main article .newsTopContents #news ul .icon {
            display: block;
            padding-left: 95px;
            text-decoration: none; }
          .claProgram .content .main article .newsTopContents #news ul .newsToeic {
            background: url("/gengo/assets/img/cla/newsIcon-toeic.png") no-repeat 0 7px; }
          .claProgram .content .main article .newsTopContents #news ul .newsToefl {
            background: url("/gengo/assets/img/cla/newsIcon-toefl.png") no-repeat 0 7px; }
          .claProgram .content .main article .newsTopContents #news ul .newsIelts {
            background: url("/gengo/assets/img/cla/newsIcon-ielts.png") no-repeat 0 7px; }
          .claProgram .content .main article .newsTopContents #news ul .newskaiwa {
            background: url("/gengo/assets/img/cla/newsIcon-kaiwa.png") no-repeat 0 7px; }
          .claProgram .content .main article .newsTopContents #news ul .newsSyosyu {
            background: url("/gengo/assets/img/cla/newsIcon-syosyu.png") no-repeat 0 7px; }
          .claProgram .content .main article .newsTopContents #news ul .newsCommon {
            background: url("/gengo/assets/img/cla/newsIcon-common.png") no-repeat 0 7px; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          .claProgram .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
        @media only screen and (min-width: 481px) and (max-width: 768px) {
          .claProgram .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
      .claProgram .content .main article .newsTopContents #point {
        width: 52%;
        margin: 0 auto 30px;
        position: relative;
        float: right;
        background: #5EC6F8 url("/gengo/assets/img/cla/point-img.png") no-repeat center center;
        z-index: 1; }
        .claProgram .content .main article .newsTopContents #point dl {
          background: #fff;
          opacity: 0.9;
          margin: 20px;
          width: 94%;
          height: 180px;
          overflow: hidden;
          *zoom: 1;
          z-index: 10; }
          .claProgram .content .main article .newsTopContents #point dl dt {
            background: #68C2F7;
            font-size: 18px;
            font-size: 1.8rem;
            text-align: center;
            color: #fff;
            font-weight: bold;
            float: left;
            width: 30%;
            height: 160px;
            opacity: 1;
            margin: 10px;
            padding: 0 20px; }
            .claProgram .content .main article .newsTopContents #point dl dt p {
              vertical-align: middle; }
          .claProgram .content .main article .newsTopContents #point dl dd {
            margin-left: 32%;
            width: 60%;
            height: 170px;
            overflow-y: auto; }
            .claProgram .content .main article .newsTopContents #point dl dd ul {
              margin-top: 10px;
              padding-left: 20px;
              font-size: 13px;
              font-size: 1.3rem; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          .claProgram .content .main article .newsTopContents #point {
            background: none;
            float: none;
            width: 100%; }
            .claProgram .content .main article .newsTopContents #point dl {
              width: 100%;
              height: 100%;
              margin: 0;
              padding: 0; }
              .claProgram .content .main article .newsTopContents #point dl dt {
                float: none;
                padding-top: 0;
                margin-top: 0;
                width: 95%;
                height: auto;
                text-align: center; }
              .claProgram .content .main article .newsTopContents #point dl dd {
                margin: 0;
                width: 95%;
                height: auto; } }
        @media only screen and (min-width: 481px) and (max-width: 768px) {
          .claProgram .content .main article .newsTopContents #point {
            width: 100%;
            max-width: 767px;
            padding: 5px 0; }
            .claProgram .content .main article .newsTopContents #point dl {
              width: 94%;
              margin: 20px;
              height: 180px; } }
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
          .claProgram .content .main article .newsTopContents #point {
            width: 52%;
            max-width: 620px;
            height: 220px; }
            .claProgram .content .main article .newsTopContents #point dl {
              width: 94%;
              margin: 20px;
              height: 180px; }
              .claProgram .content .main article .newsTopContents #point dl dt {
                height: 160px;
                font-size: 14px;
                font-size: 1.4rem; }
              .claProgram .content .main article .newsTopContents #point dl dd {
                height: 170px; } }
    .claProgram .content .main article .program-bgContents {
      background: url("/gengo/assets/img/common/bg-grey.png") repeat 0 0;
      padding-bottom: 20px; }
      .claProgram .content .main article .program-bgContents section {
        margin-bottom: 30px; }
    .claProgram .content .main article #entranceRequirementsList .entranceRequirementsListBox {
      background: #fff;
      border-radius: 10px;
      /* CSS3草案 */
      -webkit-border-radius: 10px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 10px;
      /* Firefox用 */
      margin: 10px 20px 0;
      padding: 20px; }
    .claProgram .content .main article .threeColumn {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap;
      padding-top: 10px; }
      .claProgram .content .main article .threeColumn #examinationOutline {
        width: 70%; }
        .claProgram .content .main article .threeColumn #examinationOutline .examinationOutlineBox {
          font-size: 13px;
          font-size: 1.3rem;
          background: #fff;
          border-radius: 10px;
          /* CSS3草案 */
          -webkit-border-radius: 10px;
          /* Safari,Google Chrome用 */
          -moz-border-radius: 10px;
          /* Firefox用 */
          margin: 10px 20px 0;
          padding: 20px; }
      .claProgram .content .main article .threeColumn #entryBtn {
        width: 30%;
        max-width: 302px;
        margin: 0 auto; }
        .claProgram .content .main article .threeColumn #entryBtn ul {
          padding-left: 0; }
          .claProgram .content .main article .threeColumn #entryBtn ul li {
            list-style: none;
            margin-bottom: 20px; }
      @media only screen and (min-width: 0px) and (max-width: 600px) {
        .claProgram .content .main article .threeColumn #examinationOutline {
          width: 100%; }
        .claProgram .content .main article .threeColumn #entryBtn {
          width: 100%; } }
    .claProgram .content .main article #schedule {
      margin: 0 20px 10px; }
      .claProgram .content .main article #schedule .r-tabs {
        position: relative;
        border: 1px solid #dedede;
        background: #fff; }
        .claProgram .content .main article #schedule .r-tabs .r-tabs-nav {
          margin: 0;
          padding: 0;
          background: #dedede; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-tab {
            position: relative;
            display: inline-block;
            margin: 0;
            padding: 0;
            list-style: none;
            text-decoration: none;
            font-size: 14px;
            font-size: 1.4rem;
            font-weight: bold; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-anchor {
            color: #666;
            display: inline-block;
            font-weight: bold;
            padding: 10px 12px;
            text-decoration: none; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
            color: #fff;
            text-shadow: none;
            background: #44d5b3; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-state-disabled {
            opacity: 0.5; }
        .claProgram .content .main article #schedule .r-tabs .r-tabs-panel {
          display: none;
          background: #fff; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-panel .r-tabs-state-active {
            display: block; }
        .claProgram .content .main article #schedule .r-tabs .r-tabs-accordion-title {
          display: none; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
            display: block;
            padding: 10px;
            color: #fff;
            font-weight: bold;
            text-decoration: none;
            font-size: 14px; }
        .claProgram .content .main article #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
          background-color: #fff;
          color: #00c5ad;
          text-shadow: none; }
        .claProgram .content .main article #schedule .r-tabs .tab-inner {
          width: 94%;
          margin: 0 auto 40px;
          overflow-x: auto;
          white-space: nowrap;
          -webkit-overflow-scrolling: touch; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        .claProgram .content .main article #schedule {
          margin: 10px 0; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-nav {
            display: none; }
          .claProgram .content .main article #schedule .r-tabs .r-tabs-accordion-title {
            display: block;
            border-bottom: 1px solid #fff; } }
    .claProgram .content .main article #voice .voiceBox {
      width: 100%;
      max-width: 1080px;
      margin: 0 auto 30px;
      display: flex;
      display: -webkit-flex; }
      .claProgram .content .main article #voice .voiceBox dt {
        width: 20%;
        min-width: 200px; }
        .claProgram .content .main article #voice .voiceBox dt .name {
          font-size: 14px;
          font-size: 1.4rem;
          font-weight: bold; }
        .claProgram .content .main article #voice .voiceBox dt .position {
          font-size: 12px;
          font-size: 1.2rem; }
      .claProgram .content .main article #voice .voiceBox dd {
        font-size: 13px;
        font-size: 1.3rem;
        border: 3px solid #333;
        width: 80%;
        background: #fff;
        padding: 20px;
        border-radius: 10px;
        /* CSS3草案 */
        -webkit-border-radius: 10px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 10px;
        /* Firefox用 */ }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      .claProgram .content .main article #voice .voiceBox {
        display: block; }
        .claProgram .content .main article #voice .voiceBox dt {
          width: 100%;
          text-align: center; }
        .claProgram .content .main article #voice .voiceBox dd {
          width: 100%;
          margin: 0; } }
    .claProgram .content .main article #message .voiceBox {
      width: 100%;
      max-width: 1080px;
      margin: 0 auto 30px;
      display: flex;
      display: -webkit-flex;
      flex-direction: row-reverse; }
      .claProgram .content .main article #message .voiceBox dt {
        width: 20%;
        min-width: 200px; }
        .claProgram .content .main article #message .voiceBox dt .name {
          font-size: 14px;
          font-size: 1.4rem;
          font-weight: bold; }
        .claProgram .content .main article #message .voiceBox dt .position {
          font-size: 12px;
          font-size: 1.2rem; }
      .claProgram .content .main article #message .voiceBox dd {
        font-size: 13px;
        font-size: 1.3rem;
        border: 3px solid #333;
        width: 80%;
        background: #fff;
        padding: 20px;
        border-radius: 10px;
        /* CSS3草案 */
        -webkit-border-radius: 10px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 10px;
        /* Firefox用 */
        margin: 0 40px 0 0; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      .claProgram .content .main article #message .voiceBox {
        display: block; }
        .claProgram .content .main article #message .voiceBox dt {
          width: 100%;
          text-align: center; }
        .claProgram .content .main article #message .voiceBox dd {
          width: 100%;
          margin: 0; } }

#toeic .topMain {
  background: #44d5b3; }
#toeic .content .main article #outline {
  background: #b6f9e9 url("/gengo/assets/img/common/bg-wh.png") repeat 0 0; }
#toeic .content .main article .program-bgContents h2 {
  color: #44d5b3;
  font-size: 40px;
  font-size: 4rem;
  font-weight: bold;
  text-align: center; }
  #toeic .content .main article .program-bgContents h2 span {
    display: block;
    font-size: 14px;
    font-size: 1.4rem; }
#toeic .content .main article .program-bgContents #schedule .r-tabs .r-tab-nav {
  background: #44d5b3; }
#toeic .content .main article .program-bgContents #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #44d5b3; }
#toeic .content .main article .program-bgContents #schedule h3 {
  margin: 20px;
  color: #44d5b3;
  font-size: 18px;
  font-size: 1.8rem; }
#toeic .content .main article .program-bgContents #schedule table thead th {
  background: #44d5b3; }
#toeic .content .main article .program-bgContents #schedule table tbody th {
  background: #d7f4ef; }
#toeic .content .main article .program-bgContents #schedule table tbody td {
  white-space: nowrap; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #toeic .content .main article .program-bgContents #schedule .r-tabs-accordion-title .r-tabs-anchor {
    background: #44d5b3; }
  #toeic .content .main article .program-bgContents #schedule .r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #44d5b3; } }
#toeic .content .main article .program-bgContents #message .messageBox {
  border: 3px solid #44d5b3; }

#toefl .topMain {
  background: #62bef2; }
#toefl .content .main article #outline {
  background: #d8f1ff url("/gengo/assets/img/common/bg-wh.png") repeat 0 0; }
#toefl .content .main article .program-bgContents h2 {
  color: #62bef2;
  font-size: 40px;
  font-size: 4rem;
  font-weight: bold;
  text-align: center; }
  #toefl .content .main article .program-bgContents h2 span {
    display: block;
    font-size: 14px;
    font-size: 1.4rem; }
#toefl .content .main article .program-bgContents #schedule .r-tabs .r-tab-nav {
  background: #62bef2; }
#toefl .content .main article .program-bgContents #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #62bef2; }
#toefl .content .main article .program-bgContents #schedule h3 {
  margin: 20px;
  color: #62bef2;
  font-size: 18px;
  font-size: 1.8rem; }
#toefl .content .main article .program-bgContents #schedule table thead th {
  background: #62bef2; }
#toefl .content .main article .program-bgContents #schedule table tbody th {
  background: #d6f2ff; }
#toefl .content .main article .program-bgContents #schedule table tbody td {
  white-space: nowrap; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #toefl .content .main article .program-bgContents #schedule .r-tabs-accordion-title .r-tabs-anchor {
    background: #62bef2; }
  #toefl .content .main article .program-bgContents #schedule .r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #62bef2; } }
#toefl .content .main article .program-bgContents #message .messageBox {
  border: 3px solid #62bef2; }

#ielts .topMain {
  background: #ffd221; }
#ielts .content .main article #outline {
  background: #ffefb2 url("/gengo/assets/img/common/bg-wh.png") repeat 0 0; }
#ielts .content .main article .program-bgContents h2 {
  color: #ffd221;
  font-size: 40px;
  font-size: 4rem;
  font-weight: bold;
  text-align: center; }
  #ielts .content .main article .program-bgContents h2 span {
    display: block;
    font-size: 14px;
    font-size: 1.4rem; }
#ielts .content .main article .program-bgContents #schedule .r-tabs .r-tab-nav {
  background: #ffd221; }
#ielts .content .main article .program-bgContents #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #ffd221; }
#ielts .content .main article .program-bgContents #schedule h3 {
  margin: 20px;
  color: #ffd221;
  font-size: 18px;
  font-size: 1.8rem; }
#ielts .content .main article .program-bgContents #schedule table thead th {
  background: #ffd221; }
#ielts .content .main article .program-bgContents #schedule table tbody th {
  background: #ffefb2; }
#ielts .content .main article .program-bgContents #schedule table tbody td {
  white-space: nowrap; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #ielts .content .main article .program-bgContents #schedule .r-tabs-accordion-title .r-tabs-anchor {
    background: #ffd221; }
  #ielts .content .main article .program-bgContents #schedule .r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #ffd221; } }
#ielts .content .main article .program-bgContents #message .messageBox {
  border: 3px solid #ffd221; }

#kaiwa .topMain {
  background: #dfa1ef; }
#kaiwa .content .main article #outline {
  background: #f4e0f9 url("/gengo/assets/img/common/bg-wh.png") repeat 0 0; }
#kaiwa .content .main article .newsTopContents #news {
  width: 100%; }
#kaiwa .content .main article .program-bgContents h2 {
  color: #dfa1ef;
  font-size: 40px;
  font-size: 4rem;
  font-weight: bold;
  text-align: center; }
  #kaiwa .content .main article .program-bgContents h2 span {
    display: block;
    font-size: 14px;
    font-size: 1.4rem; }
#kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox {
  position: relative;
  background: #fff none repeat scroll 0 0;
  border-radius: 10px;
  font-size: 13px;
  font-size: 1.3rem;
  margin: 10px 20px 0;
  padding: 20px; }
  #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox .imageRight {
    float: right;
    width: 250px;
    margin: 0 10px 10px 30px; }
  #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox h3 {
    font-size: 16px;
    font-size: 1.6rem;
    color: #fff;
    background: #dfa1ef;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */
    margin: 10px 0 20px;
    padding: 10px; }
  #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox .schedule {
    margin: 10px 0 0 0;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch; }
    #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox .schedule thead th {
      background: #f4e0f9; }
    #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox .schedule tbody th {
      background: #e4e4e4; }
  #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox dl {
    margin-right: 290px; }
    #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox dl dt {
      background: #f4e0f9;
      font-weight: bold;
      padding: 5px; }
      #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox dl dt:before {
        font-family: 'icomoon';
        content: "\e946";
        color: #dfa1ef;
        display: inline-block;
        font-size: 14px;
        font-size: 1.4rem;
        margin-right: 5px; }
    #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox dl dd {
      margin-left: 0;
      padding: 5px; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox .imageRight {
    display: none; }
  #kaiwa .content .main article .program-bgContents .kaiwa-course .examinationOutlineBox dl {
    margin: 0; } }
#kaiwa .content .main article .program-bgContents #schedule .r-tabs .r-tab-nav {
  background: #dfa1ef; }
#kaiwa .content .main article .program-bgContents #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #dfa1ef; }
#kaiwa .content .main article .program-bgContents #schedule h3 {
  margin: 20px;
  color: #dfa1ef;
  font-size: 18px;
  font-size: 1.8rem; }
#kaiwa .content .main article .program-bgContents #schedule table thead th {
  background: #dfa1ef; }
#kaiwa .content .main article .program-bgContents #schedule table tbody th {
  background: #fbedff; }
#kaiwa .content .main article .program-bgContents #schedule table tbody td {
  white-space: nowrap; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #kaiwa .content .main article .program-bgContents #schedule .r-tabs-accordion-title .r-tabs-anchor {
    background: #dfa1ef; }
  #kaiwa .content .main article .program-bgContents #schedule .r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #dfa1ef; } }
#kaiwa .content .main article .program-bgContents #message .messageBox {
  border: 3px solid #dfa1ef; }

#syosyu .topMain {
  background: #c2de51; }
  #syosyu .topMain h1 {
    margin-bottom: 0;
    padding-bottom: 0; }
  #syosyu .topMain h2 {
    padding-bottom: 30px; }
#syosyu .content .main article #outline {
  background: #e4f2a9 url("/gengo/assets/img/common/bg-wh.png") repeat 0 0; }
#syosyu .content .main article .newsTopContents #news {
  width: 100%; }
#syosyu .content .main article .program-bgContents h2 {
  color: #c2de51;
  font-size: 40px;
  font-size: 4rem;
  font-weight: bold;
  text-align: center; }
  #syosyu .content .main article .program-bgContents h2 span {
    display: block;
    font-size: 14px;
    font-size: 1.4rem; }
#syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox {
  position: relative;
  background: #fff none repeat scroll 0 0;
  border-radius: 10px;
  font-size: 13px;
  font-size: 1.3rem;
  margin: 10px 20px 0;
  padding: 20px; }
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .imageRight {
    float: right;
    width: 250px;
    margin: 0 10px 10px 30px; }
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox h3 {
    font-size: 16px;
    font-size: 1.6rem;
    color: #fff;
    background: #c2de51;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */
    margin: 10px 0 20px;
    padding: 10px; }
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox ul {
    background: #e4f2a9;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */
    margin: 10px 300px 0 0;
    padding: 10px 10px 10px 30px; }
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .schedule {
    margin: 10px 0 0 0;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch; }
    #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .schedule thead th {
      background: #e4f2a9; }
    #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .schedule tbody th {
      background: #e4e4e4; }
@media only screen and (min-width: 0px) and (max-width: 1024px) {
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .imageRight {
    display: none; }
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox ul {
    margin: 0; }
  #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .schedule {
    margin: 0; }
    #syosyu .content .main article .program-bgContents .syosyu-course .examinationOutlineBox .schedule table {
      overflow: auto;
      width: 100%; } }
#syosyu .content .main article .program-bgContents #schedule .r-tabs .r-tab-nav {
  background: #c2de51; }
#syosyu .content .main article .program-bgContents #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #c2de51; }
#syosyu .content .main article .program-bgContents #schedule h3 {
  margin: 20px;
  color: #c2de51;
  font-size: 18px;
  font-size: 1.8rem; }
#syosyu .content .main article .program-bgContents #schedule table thead th {
  background: #c2de51; }
#syosyu .content .main article .program-bgContents #schedule table tbody th {
  background: #fbedff; }
#syosyu .content .main article .program-bgContents #schedule table tbody td {
  white-space: nowrap; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #syosyu .content .main article .program-bgContents #schedule .r-tabs-accordion-title .r-tabs-anchor {
    background: #c2de51; }
  #syosyu .content .main article .program-bgContents #schedule .r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #c2de51; } }
#syosyu .content .main article .program-bgContents #message .messageBox {
  border: 3px solid #c2de51; }

#flow .topMain {
  background: #4faaf0; }
#flow .content .main article #lead {
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center; }
#flow .content .main article .program-bgContents h2 {
  color: #4faaf0;
  font-size: 30px;
  font-size: 3rem;
  font-weight: bold;
  text-align: center; }
#flow .content .main article .program-bgContents #entryFlow {
  line-height: 1; }
  #flow .content .main article .program-bgContents #entryFlow ol {
    padding-left: 0; }
    #flow .content .main article .program-bgContents #entryFlow ol li {
      border-radius: 10px;
      /* CSS3草案 */
      -webkit-border-radius: 10px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 10px;
      /* Firefox用 */
      background: #fff;
      margin: 10px 20px 20px;
      padding: 5px 20px;
      list-style: none;
      position: relative;
      display: -webkit-flex;
      display: flex;
      z-index: 0; }
      #flow .content .main article .program-bgContents #entryFlow ol li .step {
        background: #4faaf0;
        color: #fff;
        font-family: "Roboto", sans-serif;
        font-size: 18px;
        font-size: 1.8rem;
        text-align: center;
        width: 20%;
        padding: 15px;
        margin-right: 2%;
        border-radius: 10px;
        /* CSS3草案 */
        -webkit-border-radius: 10px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 10px;
        /* Firefox用 */ }
      #flow .content .main article .program-bgContents #entryFlow ol li .textBox {
        text-align: left;
        width: 75%; }
        #flow .content .main article .program-bgContents #entryFlow ol li .textBox h3 {
          color: #4faaf0;
          font-size: 18px;
          font-size: 1.8rem;
          display: block; }
        #flow .content .main article .program-bgContents #entryFlow ol li .textBox .detail {
          font-size: 13px;
          font-size: 1.3rem; }
      #flow .content .main article .program-bgContents #entryFlow ol li:after {
        font-family: 'icomoon';
        content: "\ea36";
        display: block;
        font-size: 34px;
        font-size: 3.4rem;
        color: #4faaf0;
        position: absolute;
        left: 50%;
        bottom: -20px;
        width: 34px;
        margin-left: -17px;
        z-index: 10; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        #flow .content .main article .program-bgContents #entryFlow ol li {
          display: block; }
          #flow .content .main article .program-bgContents #entryFlow ol li .step {
            display: block;
            width: 100%;
            padding: 5px; }
          #flow .content .main article .program-bgContents #entryFlow ol li .textBox {
            margin-left: 0; } }
  #flow .content .main article .program-bgContents #entryFlow .button {
    font-size: 14px;
    font-size: 1.4rem; }
#flow .content .main article .program-bgContents #policy {
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  background: #fff;
  margin: 10px 20px;
  padding: 20px;
  font-size: 13px;
  font-size: 1.3rem; }
  #flow .content .main article .program-bgContents #policy h3 {
    text-align: center;
    font-size: 16px;
    font-size: 1.6rem; }

.claNews .topMain {
  background: #02a7d9; }
.claNews .content {
  overflow: hidden;
  *zoom: 1; }
  .claNews .content .main {
    float: right;
    width: 70%; }
    .claNews .content .main h3 {
      border-bottom: 2px dotted #ececec;
      clear: both;
      font-size: 16px;
      font-size: 1.6rem;
      font-weight: bold;
      line-height: 1.3;
      margin: 0 0 10px;
      padding: 8px 10px 7px 0; }
    .claNews .content .main #month_selector {
      margin: 0 0 25px 0;
      display: -webkit-flex;
      display: flex;
      flex: flex-grow;
      flex-direction: row;
      width: 100%;
      padding-left: 0; }
      .claNews .content .main #month_selector li {
        margin-right: 1px;
        -webkit-flex: 1 1 50px;
        /*--- safari（PC）用 ---*/
        flex: 1 1 50px;
        list-style: none outside; }
        .claNews .content .main #month_selector li a {
          display: block;
          vertical-align: middle;
          padding: 5px 0;
          text-decoration: none;
          color: #000;
          text-align: center;
          background: #E9E9E9;
          border-bottom: 3px solid #fff; }
          .claNews .content .main #month_selector li a:hover {
            border-bottom: 3px solid #900;
            background: none; }
          .claNews .content .main #month_selector li a .current {
            background: none repeat scroll 0 0 #990000;
            color: #FFFFFF; }
            .claNews .content .main #month_selector li a .current:hover {
              border-bottom: 3px solid #900;
              background: none;
              border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_01 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_01 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_02 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_02 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_03 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_03 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_04 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_04 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_05 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_05 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_06 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_06 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_07 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_07 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_08 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_08 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_09 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_09 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_10 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_10 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_11 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_11 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .claNews .content .main #month_selector #news_12 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .claNews .content .main #month_selector #news_12 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
    .claNews .content .main #news_list .newsToeic {
      background: url("/gengo/assets/img/cla/news/newsIcon-toeic.png") no-repeat right top; }
    .claNews .content .main #news_list .newsToefl {
      background: url("/gengo/assets/img/cla/news/newsIcon-toefl.png") no-repeat right top; }
    .claNews .content .main #news_list .newsIelts {
      background: url("/gengo/assets/img/cla/news/newsIcon-ielts.png") no-repeat right top; }
    .claNews .content .main #news_list .newskaiwa {
      background: url("/gengo/assets/img/cla/news/newsIcon-kaiwa.png") no-repeat right top; }
    .claNews .content .main #news_list .newsSyosyu {
      background: url("/gengo/assets/img/cla/news/newsIcon-syosyu.png") no-repeat right top; }
    .claNews .content .main #news_list .newsCommon {
      background: url("/gengo/assets/img/cla/news/newsIcon-common.png") no-repeat right top; }
    .claNews .content .main #news_list article {
      clear: both;
      margin-bottom: 20px;
      padding-bottom: 20px;
      border-bottom: 1px dotted #b0ab96; }
      .claNews .content .main #news_list article section {
        margin: 0;
        clear: none; }
        .claNews .content .main #news_list article section .time {
          margin-bottom: 5px;
          font-size: 10px;
          font-size: 1rem;
          color: #666; }
        .claNews .content .main #news_list article section h3 {
          font-size: 16px;
          font-size: 1.6rem; }
        .claNews .content .main #news_list article section .desc {
          line-height: 1.6;
          font-size: 12px;
          font-size: 1.2rem; }
        .claNews .content .main #news_list article section .read_more {
          margin: 5px 0 0 0;
          position: relative; }
    .claNews .content .main #news_article .newsToeic {
      background: url("/gengo/assets/img/cla/news/newsIcon-toeic.png") no-repeat right top; }
    .claNews .content .main #news_article .newsToefl {
      background: url("/gengo/assets/img/cla/news/newsIcon-toefl.png") no-repeat right top; }
    .claNews .content .main #news_article .newsIelts {
      background: url("/gengo/assets/img/cla/news/newsIcon-ielts.png") no-repeat right top; }
    .claNews .content .main #news_article .newskaiwa {
      background: url("/gengo/assets/img/cla/news/newsIcon-kaiwa.png") no-repeat right top; }
    .claNews .content .main #news_article .newsSyosyu {
      background: url("/gengo/assets/img/cla/news/newsIcon-syosyu.png") no-repeat right top; }
    .claNews .content .main #news_article .newsCommon {
      background: url("/gengo/assets/img/cla/news/newsIcon-common.png") no-repeat right top; }
    .claNews .content .main #news_article article {
      padding-top: 20px;
      font-size: 12px;
      font-size: 1.2rem;
      line-height: 1.8; }
  .claNews .content #sub {
    float: left;
    width: 20%; }
    .claNews .content #sub #local_nav ul {
      border-top: 5px solid #cecece;
      margin: 0 0 30px;
      position: relative;
      padding-left: 0; }
      .claNews .content #sub #local_nav ul li {
        border-bottom: 2px solid #ececec;
        font-size: 12px;
        font-size: 1.2rem;
        font-weight: bold;
        list-style: none; }
        .claNews .content #sub #local_nav ul li a {
          color: #000;
          display: block;
          padding: 15px 0 13px 2px;
          transition-delay: 0s;
          transition-duration: 0.2s;
          transition-property: background-color, color;
          transition-timing-function: linear;
          text-decoration: none; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    .claNews .content .main {
      float: none;
      width: 96%;
      margin: 0 2%; }
    .claNews .content #sub {
      float: none;
      width: 96%;
      margin: 0 2%; } }

/*gaikokugo-gakusyu
///////////////////////////////////////////////////////////////////*/
#gaikokugoIndex #container {
  background: #48bdbd; }
#gaikokugoIndex .topMain {
  max-width: 1200px;
  margin: 0 auto;
  padding-bottom: 30px;
  background: #fff;
  z-index: 1; }
  #gaikokugoIndex .topMain .homeImg {
    width: 100%;
    max-width: 1200px;
    height: auto; }
    @media only screen and (min-width: 0px) and (max-width: 768px) {
      #gaikokugoIndex .topMain .homeImg {
        width: 100%;
        height: auto; } }
    @media only screen and (min-width: 769px) and (max-width: 1024px) {
      #gaikokugoIndex .topMain .homeImg {
        width: 100%;
        height: auto; } }
#gaikokugoIndex .content {
  background: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px;
  position: relative; }
  #gaikokugoIndex .content .main article {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; }
    #gaikokugoIndex .content .main article .newsTopContents {
      overflow: hidden;
      *zoom: 1;
      width: 100%;
      max-width: 1110px;
      margin: 0 auto; }
      #gaikokugoIndex .content .main article .newsTopContents #news {
        width: 60%;
        float: left;
        border-top: 3px solid #000;
        position: relative; }
        #gaikokugoIndex .content .main article .newsTopContents #news h2 {
          font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
          font-size: 18px;
          font-size: 1.8rem;
          margin: 10px 0; }
        #gaikokugoIndex .content .main article .newsTopContents #news .sub-link {
          position: absolute;
          right: 5px;
          top: 5px; }
        #gaikokugoIndex .content .main article .newsTopContents #news ul {
          padding-left: 0;
          height: 270px;
          overflow: auto;
          -webkit-overflow-scrolling: touch;
          border-top: 1px solid #dedede;
          border-bottom: 1px solid #dedede; }
          #gaikokugoIndex .content .main article .newsTopContents #news ul li {
            padding: 5px 0;
            margin-bottom: 3px;
            border-bottom: 1px dotted #ccc;
            font-size: 12px;
            font-size: 1.2rem; }
            #gaikokugoIndex .content .main article .newsTopContents #news ul li .date {
              font-size: 10px;
              font-size: 1rem;
              color: #858585; }
            #gaikokugoIndex .content .main article .newsTopContents #news ul li a {
              display: block;
              text-decoration: none; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #gaikokugoIndex .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
        @media only screen and (min-width: 481px) and (max-width: 1024px) {
          #gaikokugoIndex .content .main article .newsTopContents #news {
            width: 50%; } }
      #gaikokugoIndex .content .main article .newsTopContents #bannerArea {
        width: 100%;
        max-width: 400px;
        margin: 0 auto 30px;
        position: relative;
        float: right; }
        @media only screen and (min-width: 481px) and (max-width: 1024px) {
          #gaikokugoIndex .content .main article .newsTopContents #bannerArea {
            width: 48%; } }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #gaikokugoIndex .content .main article .newsTopContents #bannerArea {
            width: 100%;
            max-width: 480px;
            float: none;
            text-align: center; } }
        #gaikokugoIndex .content .main article .newsTopContents #bannerArea .bigBnr {
          margin-bottom: 20px;
          width: 100%;
          height: auto; }
          @media only screen and (min-width: 481px) and (max-width: 1024px) {
            #gaikokugoIndex .content .main article .newsTopContents #bannerArea .bigBnr {
              width: 100%; } }
          #gaikokugoIndex .content .main article .newsTopContents #bannerArea .bigBnr a img {
            width: 100%;
            height: auto; }
            @media only screen and (min-width: 481px) and (max-width: 1024px) {
              #gaikokugoIndex .content .main article .newsTopContents #bannerArea .bigBnr a img {
                width: 100%;
                height: auto; } }
            @media only screen and (min-width: 0px) and (max-width: 480px) {
              #gaikokugoIndex .content .main article .newsTopContents #bannerArea .bigBnr a img {
                width: 98%;
                height: auto; } }
        #gaikokugoIndex .content .main article .newsTopContents #bannerArea .smallBnr {
          display: -webkit-flex;
          /*--- safari（PC）用 ---*/
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap; }
          @media only screen and (min-width: 0px) and (max-width: 480px) {
            #gaikokugoIndex .content .main article .newsTopContents #bannerArea .smallBnr {
              width: 100%; } }
          #gaikokugoIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
            margin: 0 0 20px 0; }
            @media only screen and (min-width: 0px) and (max-width: 480px) {
              #gaikokugoIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
                width: 50%; }
                #gaikokugoIndex .content .main article .newsTopContents #bannerArea .smallBnr a img {
                  width: 95%;
                  height: auto; } }
    #gaikokugoIndex .content .main article #lecContents {
      background: #f3e9d1;
      width: 100%; }
      #gaikokugoIndex .content .main article #lecContents h2 {
        text-align: center;
        margin-top: -10px; }
      #gaikokugoIndex .content .main article #lecContents ul {
        width: 100%;
        max-width: 1110px;
        margin: 0 auto 30px;
        text-align: center;
        padding-left: 0; }
        #gaikokugoIndex .content .main article #lecContents ul li {
          list-style: none;
          position: relative;
          margin: 0 5px 10px;
          display: inline-block;
          width: 30%;
          height: auto;
          min-height: 150px; }
          #gaikokugoIndex .content .main article #lecContents ul li a {
            display: block;
            color: #fff;
            text-decoration: none;
            font-size: 16px;
            font-size: 1.6rem;
            background: url("/gengo/assets/img/gaikokugo-gakusyu/contentsImg-btn.png") repeat-x 0 0; }
            #gaikokugoIndex .content .main article #lecContents ul li a p {
              padding: 5px 10px 5px 40px;
              margin: 0;
              font-family: "Noto Sans Japanese", serif;
              font-weight: bold;
              text-align: left; }
            #gaikokugoIndex .content .main article #lecContents ul li a:before {
              font-family: "icomoon";
              content: "\ea1c";
              display: inline-block;
              color: #fff;
              text-align: center;
              width: 20px;
              height: 20px;
              font-size: 12px;
              font-size: 1.2rem;
              position: absolute;
              top: 110px;
              left: 10px; }
      @media only screen and (min-width: 0px) and (max-width: 468px) {
        #gaikokugoIndex .content .main article #lecContents ul li {
          width: 100%;
          height: auto;
          margin: 0 0 20px;
          padding: 0; }
          #gaikokugoIndex .content .main article #lecContents ul li a {
            font-size: 14px;
            font-size: 1.4rem; } }
      @media only screen and (min-width: 469px) and (max-width: 800px) {
        #gaikokugoIndex .content .main article #lecContents ul li {
          width: 47%;
          height: auto; }
          #gaikokugoIndex .content .main article #lecContents ul li a {
            font-size: 14px;
            font-size: 1.4rem; } }

.gaikokugoContents #container {
  background: #48bdbd;
  position: relative; }
  .gaikokugoContents #container .content {
    background: #fff;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 30px;
    padding-bottom: 30px; }
    .gaikokugoContents #container .content .topMain {
      margin: 0 auto;
      z-index: 1;
      background: url("/gengo/assets/img/gaikokugo-gakusyu/topMain_bg.png") no-repeat 0 0; }
      .gaikokugoContents #container .content .topMain h1 {
        color: #fff;
        font-size: 48px;
        font-size: 4.8rem;
        text-align: center;
        padding: 10px 0;
        margin: 0 0 30px; }
        @media only screen and (min-width: 0px) and (max-width: 780px) {
          .gaikokugoContents #container .content .topMain h1 {
            font-size: 24px;
            font-size: 2.4rem; } }
        .gaikokugoContents #container .content .topMain h1 img {
          text-align: center; }
        .gaikokugoContents #container .content .topMain h1 span {
          display: block; }
    .gaikokugoContents #container .content article {
      width: 100%;
      max-width: 1080px;
      margin: 0 auto 30px; }
      .gaikokugoContents #container .content article .lead {
        position: relative;
        font-size: 14px;
        font-size: 1.4rem;
        margin-bottom: 30px; }
      .gaikokugoContents #container .content article .brBox {
        background: #f3e9d1;
        padding: 20px; }
      .gaikokugoContents #container .content article #use {
        display: flex;
        display: -webkit-flex;
        margin: 0 auto 30px; }
        .gaikokugoContents #container .content article #use .useBox {
          width: 30%;
          text-align: center;
          margin: 0 1.5%; }
          .gaikokugoContents #container .content article #use .useBox p {
            text-align: left; }
      .gaikokugoContents #container .content article #application {
        margin: 0 auto 30px; }
        .gaikokugoContents #container .content article #application .btnArea {
          margin: 0 auto 30px;
          text-align: center;
          position: relative; }
          .gaikokugoContents #container .content article #application .btnArea ul {
            padding-left: 0; }
            .gaikokugoContents #container .content article #application .btnArea ul li {
              display: inline-block;
              width: 40%;
              text-align: center;
              list-style: none; }
              .gaikokugoContents #container .content article #application .btnArea ul li a {
                display: block;
                margin: 0 5px; }
                .gaikokugoContents #container .content article #application .btnArea ul li a img {
                  width: 100%;
                  height: auto; }
      .gaikokugoContents #container .content article #schedule h2 {
        display: block;
        font-size: 20px;
        font-size: 2rem;
        background: #EFC147;
        color: #fff;
        text-align: center;
        border-radius: 10px;
        /* CSS3草案 */
        -webkit-border-radius: 10px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 10px;
        /* Firefox用 */
        width: auto;
        padding: 10px 0; }
      .gaikokugoContents #container .content article #schedule h3 {
        font-size: 20px;
        font-size: 2rem;
        color: #efc147;
        width: 94%;
        margin: 20px auto;
        position: relative; }
        .gaikokugoContents #container .content article #schedule h3 .access {
          padding: 5px 7px;
          font-size: 12px;
          font-size: 1.2rem;
          border-radius: 5px;
          /* CSS3草案 */
          -webkit-border-radius: 5px;
          /* Safari,Google Chrome用 */
          -moz-border-radius: 5px;
          /* Firefox用 */
          border: 2px solid #e4e4e4;
          display: inline-block;
          position: absolute;
          right: 0;
          top: 0; }
        .gaikokugoContents #container .content article #schedule h3 p {
          margin: 0; }
      .gaikokugoContents #container .content article #schedule h4 {
        font-size: 16px;
        font-size: 1.6rem;
        color: #333;
        border: 1px solid #999;
        text-align: center;
        width: 94%;
        margin: 0 auto 20px;
        padding: 10px 0; }
      .gaikokugoContents #container .content article #schedule table thead th {
        background: #999;
        color: #fff; }
      .gaikokugoContents #container .content article #schedule table tbody tr th {
        background: #eee; }
      .gaikokugoContents #container .content article #schedule table tbody tr td {
        background: #fff; }
      .gaikokugoContents #container .content article #schedule table tbody .even td {
        background: #f4eddc; }
      .gaikokugoContents #container .content article .other {
        background: #fff;
        border: 3px solid #f3e9d1;
        padding: 20px;
        border-radius: 10px;
        /* CSS3草案 */
        -webkit-border-radius: 10px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 10px;
        /* Firefox用 */
        margin: 0 auto 30px;
        font-size: 12px;
        font-size: 1.2rem; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        .gaikokugoContents #container .content article .lead {
          width: 96%; }
        .gaikokugoContents #container .content article #use {
          display: block; }
          .gaikokugoContents #container .content article #use .useBox {
            width: 100%; }
        .gaikokugoContents #container .content article #application .btnArea ul li {
          display: block;
          margin: 0 0 10px;
          width: 100%; }
          .gaikokugoContents #container .content article #application .btnArea ul li img {
            width: 90%;
            height: auto; }
        .gaikokugoContents #container .content article #schedule h2 {
          font-size: 14px;
          font-size: 1.4rem; }
          .gaikokugoContents #container .content article #schedule h2:before {
            display: block; }
        .gaikokugoContents #container .content article #schedule h3 {
          font-size: 16px;
          font-size: 1.6rem; } }
      @media only screen and (min-width: 481px) and (max-width: 780px) {
        .gaikokugoContents #container .content article .lead {
          width: 96%; }
        .gaikokugoContents #container .content article #application .btnArea ul li {
          margin: 0 0 10px;
          width: 45%; }
          .gaikokugoContents #container .content article #application .btnArea ul li img {
            width: 90%;
            height: auto; } }

.slicknav_nav {
  background: #f3e9d1; }

#dantai #container .content article .ttl {
  font-size: 20px;
  font-size: 2rem;
  color: #333; }
#dantai #container .content article .newsTopContents {
  overflow: hidden;
  *zoom: 1;
  width: 100%;
  max-width: 1110px;
  margin: 0 auto; }
  #dantai #container .content article .newsTopContents #news {
    width: 55%;
    float: left;
    border-top: 3px solid #000;
    position: relative; }
    #dantai #container .content article .newsTopContents #news h2 {
      font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
      font-size: 18px;
      font-size: 1.8rem;
      margin: 10px 0; }
    #dantai #container .content article .newsTopContents #news .sub-link {
      position: absolute;
      right: 5px;
      top: 5px; }
    #dantai #container .content article .newsTopContents #news ul {
      padding-left: 0;
      height: 200px;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      border-top: 1px solid #dedede;
      border-bottom: 1px solid #dedede; }
      #dantai #container .content article .newsTopContents #news ul li {
        padding: 5px 0;
        margin-bottom: 3px;
        border-bottom: 1px dotted #ccc;
        font-size: 12px;
        font-size: 1.2rem; }
        #dantai #container .content article .newsTopContents #news ul li .date {
          font-size: 10px;
          font-size: 1rem;
          color: #858585; }
        #dantai #container .content article .newsTopContents #news ul li a {
          display: block;
          text-decoration: none; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #dantai #container .content article .newsTopContents #news {
        float: none;
        width: 100%; } }
    @media only screen and (min-width: 481px) and (max-width: 1024px) {
      #dantai #container .content article .newsTopContents #news {
        width: 50%; } }
  #dantai #container .content article .newsTopContents #bannerArea {
    width: 100%;
    max-width: 450px;
    margin: 0 auto 30px;
    position: relative;
    float: right; }
    #dantai #container .content article .newsTopContents #bannerArea .smallArea {
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #dantai #container .content article .newsTopContents #bannerArea {
        width: 100%;
        max-width: 480px;
        float: none;
        text-align: center; }
        #dantai #container .content article .newsTopContents #bannerArea .smallBnr a {
          width: 50%;
          height: auto; }
          #dantai #container .content article .newsTopContents #bannerArea .smallBnr a img {
            width: 95%;
            height: auto; } }
    @media only screen and (min-width: 481px) and (max-width: 1024px) {
      #dantai #container .content article .newsTopContents #bannerArea {
        width: 48%; }
        #dantai #container .content article .newsTopContents #bannerArea .smallBnr {
          width: 100%; }
          #dantai #container .content article .newsTopContents #bannerArea .smallBnr a {
            width: 50%; }
            #dantai #container .content article .newsTopContents #bannerArea .smallBnr a img {
              width: 95%;
              height: auto; } }
#dantai #container .content article #howto {
  display: -webkit-flex;
  display: flex;
  margin: 0 auto 60px; }
  #dantai #container .content article #howto .howtoBox {
    margin-bottom: 20px;
    width: 45%;
    margin: 0 2%;
    height: auto;
    justify-content: space-between;
    flex-wrap: wrap;
    border: 2px solid #666;
    padding: 20px; }
    #dantai #container .content article #howto .howtoBox h3 {
      font-size: 16px;
      font-size: 1.6rem;
      color: #333;
      margin: 0; }
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #dantai #container .content article #howto {
      display: block; }
      #dantai #container .content article #howto .howtoBox {
        width: 100%;
        margin: 0 0 20px; } }
#dantai #container .content article #schedule .inner {
  width: 94%;
  margin: 0 auto 40px;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch; }

#eLearning #container .content article .ttl {
  font-size: 20px;
  font-size: 2rem;
  color: #333; }
#eLearning #container .content article .newsTopContents {
  overflow: hidden;
  *zoom: 1;
  width: 100%;
  max-width: 1110px;
  margin: 0 auto; }
  #eLearning #container .content article .newsTopContents #news {
    width: 100%;
    border-top: 3px solid #000;
    position: relative;
    margin-bottom: 30px; }
    #eLearning #container .content article .newsTopContents #news h2 {
      font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
      font-size: 18px;
      font-size: 1.8rem;
      margin: 10px 0; }
    #eLearning #container .content article .newsTopContents #news .sub-link {
      position: absolute;
      right: 5px;
      top: 5px; }
    #eLearning #container .content article .newsTopContents #news ul {
      padding-left: 0;
      height: 230px;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      border-top: 1px solid #dedede;
      border-bottom: 1px solid #dedede; }
      #eLearning #container .content article .newsTopContents #news ul li {
        padding: 5px 0;
        margin-bottom: 3px;
        border-bottom: 1px dotted #ccc;
        font-size: 12px;
        font-size: 1.2rem; }
        #eLearning #container .content article .newsTopContents #news ul li .date {
          font-size: 10px;
          font-size: 1rem;
          color: #858585; }
        #eLearning #container .content article .newsTopContents #news ul li a {
          display: block;
          text-decoration: none; }
  #eLearning #container .content article .newsTopContents #levelArea {
    width: 100%;
    max-width: 450px;
    margin: 0 auto;
    position: relative;
    float: right;
    text-align: center; }
    #eLearning #container .content article .newsTopContents #levelArea dl {
      border: 1px solid #995C20; }
      #eLearning #container .content article .newsTopContents #levelArea dl dt {
        background: #995C20;
        color: #fff;
        padding: 5px; }
      #eLearning #container .content article .newsTopContents #levelArea dl dd {
        margin: 0;
        padding: 5px; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #eLearning #container .content article .newsTopContents #levelArea {
        width: 100%;
        max-width: 480px;
        float: none;
        text-align: center; } }
#eLearning #container .content article .twoColumn {
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1080px; }
  #eLearning #container .content article .twoColumn #use {
    width: 68%;
    margin-right: 2%; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #eLearning #container .content article .twoColumn #use {
        width: 100%; } }
  #eLearning #container .content article .twoColumn #levelArea {
    width: 30%;
    text-align: center; }
    #eLearning #container .content article .twoColumn #levelArea dl {
      border: 1px solid #995C20;
      margin-top: 0; }
      #eLearning #container .content article .twoColumn #levelArea dl dt {
        background: #995C20;
        color: #fff;
        padding: 5px; }
      #eLearning #container .content article .twoColumn #levelArea dl dd {
        margin: 0;
        padding: 5px; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #eLearning #container .content article .twoColumn #levelArea {
        width: 100%;
        max-width: 480px;
        float: none;
        text-align: center; } }
#eLearning #container .content article #application .btnArea {
  margin-bottom: 10px; }
  #eLearning #container .content article #application .btnArea ul li a img {
    width: 100%;
    height: auto;
    max-width: 300px;
    max-height: 110px; }
#eLearning #container .content article .other {
  padding: 10px; }

#communications #container article .ttl {
  font-size: 20px;
  font-size: 2rem;
  color: #333; }
#communications #container article #outline {
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding: 20px 5px; }
  #communications #container article #outline img {
    width: 35%;
    height: auto;
    max-width: 500px;
    max-height: 297px; }
  #communications #container article #outline .lead {
    width: 60%;
    margin-left: 20px; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    #communications #container article #outline img {
      width: 80%;
      height: auto; }
    #communications #container article #outline .lead {
      width: 100%; } }
#communications #container article #utilizingMethod {
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 30px; }
  #communications #container article #utilizingMethod dl {
    width: 30%;
    margin: 10px 1.5%; }
    #communications #container article #utilizingMethod dl dt {
      font-size: 14px;
      font-size: 1.4rem;
      font-weight: bold;
      border-bottom: 1px solid #333;
      padding-bottom: 10px;
      margin-bottom: 10px; }
      #communications #container article #utilizingMethod dl dt:before {
        font-family: 'icomoon';
        content: "\ea10";
        display: inline-block;
        margin-right: 5px;
        color: #F2AF07;
        padding: 0 10px;
        border: 1px solid #F2AF07;
        border-radius: 3px;
        /* CSS3草案 */
        -webkit-border-radius: 3px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 3px;
        /* Firefox用 */ }
    #communications #container article #utilizingMethod dl dd {
      margin-left: 0;
      font-size: 13px;
      font-size: 1.3rem; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    #communications #container article #utilizingMethod dl {
      width: 100%;
      margin-bottom: 20px; } }
#communications #container article #step {
  margin-bottom: 30px; }
  #communications #container article #step h2 {
    margin-top: 0; }
  #communications #container article #step ul {
    padding-left: 0;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    flex-wrap: wrap; }
    #communications #container article #step ul li {
      display: inline-block;
      width: 30%;
      margin: 0 1.5%;
      text-align: center;
      position: relative;
      padding: 5px 10px;
      vertical-align: top;
      border: 1px solid #ccc; }
      #communications #container article #step ul li .number {
        font-size: 18px;
        font-size: 1.8rem;
        font-weight: bold;
        margin-bottom: 0; }
      #communications #container article #step ul li .text {
        margin-top: 0;
        font-size: 13px;
        font-size: 1.3rem; }
        #communications #container article #step ul li .text:before {
          font-size: 30px;
          font-size: 3rem;
          font-family: 'icomoon';
          display: block;
          margin-right: 5px;
          color: #F2AF07;
          padding: 0 10px;
          border-radius: 3px;
          /* CSS3草案 */
          -webkit-border-radius: 3px;
          /* Safari,Google Chrome用 */
          -moz-border-radius: 3px;
          /* Firefox用 */ }
      #communications #container article #step ul li .flow1:before {
        content: "\e953"; }
      #communications #container article #step ul li .flow2:before {
        content: "\e94e"; }
      #communications #container article #step ul li .flow3:before {
        content: "\e96c"; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    #communications #container article #step ul li {
      display: block;
      width: 100%;
      margin-bottom: 20px; } }
#communications #container article #schedule {
  margin: 0 20px 10px; }
  #communications #container article #schedule .r-tabs {
    position: relative;
    border: 1px solid #dedede;
    background: #fff; }
    #communications #container article #schedule .r-tabs .r-tabs-nav {
      margin: 0;
      padding: 0;
      background: #dedede;
      text-align: center; }
      #communications #container article #schedule .r-tabs .r-tabs-nav .r-tabs-tab {
        position: relative;
        display: inline-block;
        margin: 0;
        padding: 0;
        list-style: none;
        text-decoration: none;
        font-size: 14px;
        font-size: 1.4rem;
        font-weight: bold; }
        #communications #container article #schedule .r-tabs .r-tabs-nav .r-tabs-tab a {
          background: #fff;
          margin: 10px 5px; }
      #communications #container article #schedule .r-tabs .r-tabs-nav .r-tabs-anchor {
        color: #666;
        display: inline-block;
        font-weight: bold;
        padding: 10px 12px;
        text-decoration: none; }
      #communications #container article #schedule .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
        color: #efc147;
        text-shadow: none; }
      #communications #container article #schedule .r-tabs .r-tabs-nav .r-tabs-state-disabled {
        opacity: 0.5; }
    #communications #container article #schedule .r-tabs .r-tabs-panel {
      display: none;
      background: #fff; }
      #communications #container article #schedule .r-tabs .r-tabs-panel .r-tabs-state-active {
        display: block; }
    #communications #container article #schedule .r-tabs .r-tabs-accordion-title {
      display: none; }
      #communications #container article #schedule .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
        display: block;
        padding: 10px;
        color: #fff;
        font-weight: bold;
        text-decoration: none;
        font-size: 14px; }
    #communications #container article #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
      background: #efc147;
      color: #fff;
      text-shadow: none; }
    #communications #container article #schedule .r-tabs .tab-inner {
      width: 94%;
      margin: 0 auto 40px; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    #communications #container article #schedule {
      margin: 10px 0; }
      #communications #container article #schedule .r-tabs .r-tabs-nav {
        display: none; }
      #communications #container article #schedule .r-tabs .r-tabs-accordion-title {
        display: block;
        border-bottom: 1px solid #fff; }
        #communications #container article #schedule .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
          background: #858585; }
      #communications #container article #schedule .r-tabs r-tabs-state-active .r-tabs-anchor {
        color: #fff;
        background: #e4e4e4; }
      #communications #container article #schedule .r-tabs .tab-inner {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch; } }
#communications #container article section {
  margin-bottom: 20px; }

#sup #container .content .topMain {
  margin: 0 auto;
  z-index: 1;
  background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/sup_topMain_bg.png") no-repeat center center;
  background-size: cover; }
  #sup #container .content .topMain h1 {
    text-align: center;
    padding: 100px 0 0;
    margin-bottom: 0; }
    #sup #container .content .topMain h1 img {
      text-align: center; }
    #sup #container .content .topMain h1 span {
      display: block; }
  @media only screen and (min-width: 0px) and (max-width: 780px) {
    #sup #container .content .topMain {
      width: 100%;
      height: auto; }
      #sup #container .content .topMain h1 {
        font-size: 24px;
        font-size: 2.4rem;
        padding: 50px 0 40px; }
        #sup #container .content .topMain h1 .contentsImg {
          width: 80%;
          height: auto; } }
  @media only screen and (min-width: 769px) and (max-width: 3000px) {
    #sup #container .content .topMain {
      width: 100%;
      height: 610px; }
      #sup #container .content .topMain h1 {
        font-size: 24px;
        font-size: 2.4rem; }
        #sup #container .content .topMain h1 .contentsImg {
          width: 768px;
          height: 318px; } }
#sup #container .content .main article {
  margin: 0 auto 30px;
  max-width: 1200px;
  width: 100%; }
  #sup #container .content .main article section {
    margin-bottom: 30px;
    text-align: center; }
    #sup #container .content .main article section h2 {
      border-bottom: 4px solid #333;
      display: inline-block;
      font-size: 30px;
      font-size: 3rem; }
    #sup #container .content .main article section .dlList {
      width: 90%;
      margin: 0 auto 10px;
      border: 1px solid #ccc;
      background: #eeeeee;
      font-size: 14px;
      font-size: 1.4rem;
      display: table; }
      #sup #container .content .main article section .dlList dt {
        font-weight: bold;
        display: table-cell;
        vertical-align: middle;
        padding: 10px;
        clear: both;
        width: 30%; }
      #sup #container .content .main article section .dlList dd {
        padding: 10px;
        display: table-cell;
        vertical-align: middle;
        text-align: left;
        background: #fff;
        width: 70%; }
        #sup #container .content .main article section .dlList dd strong {
          font-size: 18px;
          font-size: 1.8rem;
          font-weight: bold;
          color: #3ab8cf;
          display: block; }
      @media only screen and (min-width: 0px) and (max-width: 468px) {
        #sup #container .content .main article section .dlList {
          font-size: 12px;
          font-size: 1.2rem; }
          #sup #container .content .main article section .dlList dt {
            display: block;
            width: 100%; }
          #sup #container .content .main article section .dlList dd {
            display: block;
            width: 100%;
            margin-left: 0; } }
  #sup #container .content .main article #btnArea {
    background: #94d5d3; }
    #sup #container .content .main article #btnArea ul {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap;
      padding-left: 0;
      max-width: 850px;
      margin: 60px auto; }
      #sup #container .content .main article #btnArea ul li {
        list-style: none;
        margin: 0 auto; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #sup #container .content .main article #btnArea {
        margin-bottom: 15px; }
        #sup #container .content .main article #btnArea ul {
          margin: 20px auto 0; }
          #sup #container .content .main article #btnArea ul li {
            margin-bottom: 20px; }
            #sup #container .content .main article #btnArea ul li a {
              width: 50%;
              height: auto; }
              #sup #container .content .main article #btnArea ul li a img {
                width: 95%;
                height: auto; } }
    @media only screen and (min-width: 481px) and (max-width: 769px) {
      #sup #container .content .main article #btnArea ul li {
        margin-bottom: 10px; }
        #sup #container .content .main article #btnArea ul li a {
          width: 90%;
          height: auto; }
          #sup #container .content .main article #btnArea ul li a img {
            width: 95%;
            height: auto; } }
  #sup #container .content .main article #btnsubArea {
    background: #fff; }
    #sup #container .content .main article #btnsubArea ul {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap;
      padding-left: 0;
      max-width: 850px;
      margin: 30px auto; }
      #sup #container .content .main article #btnsubArea ul li {
        list-style: none;
        margin: 0 auto; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #sup #container .content .main article #btnsubArea ul li {
        margin-bottom: 10px; }
        #sup #container .content .main article #btnsubArea ul li a {
          width: 50%;
          height: auto; }
          #sup #container .content .main article #btnsubArea ul li a img {
            width: 95%;
            height: auto; } }
    @media only screen and (min-width: 481px) and (max-width: 769px) {
      #sup #container .content .main article #btnsubArea ul li {
        margin-bottom: 10px; }
        #sup #container .content .main article #btnsubArea ul li a {
          width: 90%;
          height: auto; }
          #sup #container .content .main article #btnsubArea ul li a img {
            width: 95%;
            height: auto; } }
  #sup #container .content .main article #exactly h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 0;
    border-bottom: none; }
  #sup #container .content .main article #exactly .exactlyBox {
    margin: 30px auto;
    border: 3px solid #333;
    width: 100%;
    max-width: 1090px;
    background: #fff;
    font-size: 18px;
    font-size: 1.8rem; }

    #sup #container .content .main article #exactly .exactlyBox h3 span {
      display: inline-block; }
    #sup #container .content .main article #exactly .exactlyBox ul {
      padding: 0 0 0 200px;
      text-align: left; }
      #sup #container .content .main article #exactly .exactlyBox ul li {
        list-style: none;
        line-height: 1.8;
        margin-bottom: 10px; }
        #sup #container .content .main article #exactly .exactlyBox ul li:before {
          font-family: 'icomoon';
          content: "\ea10";
          display: inline-block;
          margin-right: 5px;
          color: #3ab8cf;
          padding: 0 10px;
          border: 1px solid #3ab8cf;
          border-radius: 3px;
          /* CSS3草案 */
          -webkit-border-radius: 3px;
          /* Safari,Google Chrome用 */
          -moz-border-radius: 3px;
          /* Firefox用 */ }
    #sup #container .content .main article #exactly .exactlyBox .youtube iframe {
      width: 100%; }
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #sup #container .content .main article #exactly h2 {
      font-size: 16px;
      font-size: 1.6rem; }
    #sup #container .content .main article #exactly .exactlyBox {
      margin: 20px auto; }
      #sup #container .content .main article #exactly .exactlyBox h3 {
        font-size: 14px;
        font-size: 1.4rem; }
      #sup #container .content .main article #exactly .exactlyBox ul {
        padding: 10px; }
        #sup #container .content .main article #exactly .exactlyBox ul li {
          font-size: 12px;
          font-size: 1.2rem; } }
  @media only screen and (min-width: 481px) and (max-width: 800px) {
    #sup #container .content .main article #exactly h2 {
      font-size: 20px;
      font-size: 2rem; }
    #sup #container .content .main article #exactly .exactlyBox ul {
      padding: 10px; } }
  #sup #container .content .main article #period {
    margin-bottom: 60px; }
  #sup #container .content .main article #supImageArea .supImageBox {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap; }
    #sup #container .content .main article #supImageArea .supImageBox .figure {
      width: 50%; }
      #sup #container .content .main article #supImageArea .supImageBox .figure img {
        width: 100%;
        height: auto;
        max-width: 600px;
        max-height: 300px; }
    #sup #container .content .main article #supImageArea .supImageBox .figcaption {
      width: 50%;
      color: #fff;
      font-size: 18px;
      font-size: 1.8rem;
      font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; }
      #sup #container .content .main article #supImageArea .supImageBox .figcaption p {
        margin: 0;
        padding: 20% 0 0; }
  #sup #container .content .main article #supImageArea .supImage01 .figcaption {
    background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/supImage-bg01.png") no-repeat center center; }
  #sup #container .content .main article #supImageArea .supImage02 {
    flex-direction: row-reverse; }
    #sup #container .content .main article #supImageArea .supImage02 .figcaption {
      background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/supImage-bg02.png") no-repeat center center; }
  #sup #container .content .main article #supImageArea .supImage03 .figcaption {
    background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/supImage-bg03.png") no-repeat center center; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    #sup #container .content .main article #supImageArea .supImageBox .figure {
      width: 100%;
      display: block; }
      #sup #container .content .main article #supImageArea .supImageBox .figure img {
        width: 100%;
        height: auto; }
    #sup #container .content .main article #supImageArea .supImageBox .figcaption {
      width: 100%;
      display: block; }
      #sup #container .content .main article #supImageArea .supImageBox .figcaption p {
        position: relative;
        display: block;
        padding: 10% 0;
        font-size: 13px;
        font-size: 1.3rem; } }
  @media only screen and (min-width: 601px) and (max-width: 800px) {
    #sup #container .content .main article #supImageArea .supImageBox .figure img {
      width: 100%;
      height: auto; }
    #sup #container .content .main article #supImageArea .supImageBox .figcaption {
      font-size: 14px;
      font-size: 1.4rem; } }
  #sup #container .content .main article #when .dlList ul {
    display: -webkit-flex;
    display: flex;
    padding-left: 0; }
    #sup #container .content .main article #when .dlList ul li {
      width: 30%;
      list-style: none;
      text-align: center;
      margin-right: 10px;
      padding: 10px;
      border-radius: 10px;
      -webkit-border-radius: 10px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 10px;
      /* Firefox用 */ }
      #sup #container .content .main article #when .dlList ul li a {
        display: block;
        text-decoration: none; }
        #sup #container .content .main article #when .dlList ul li a:before {
          font-family: 'icomoon';
          content: "\ea1c";
          display: inline-block;
          font-size: 14px;
          font-size: 1.4rem;
          margin-right: 5px; }
    #sup #container .content .main article #when .dlList ul .kic {
      background: #FFF1A5; }
    #sup #container .content .main article #when .dlList ul .bkc {
      background: #C3E5F4; }
    #sup #container .content .main article #when .dlList ul .oic {
      background: #F9D2BD; }
  #sup #container .content .main article #how ul {
    padding-left: 0; }
    #sup #container .content .main article #how ul li {
      background: #fff;
      display: inline-block;
      width: 28%;
      margin: 0 1.5%;
      text-align: center;
      position: relative;
      padding: 5px 10px;
      vertical-align: top;
      margin-bottom: 30px;
      border: 1px solid #ccc; }
      #sup #container .content .main article #how ul li .number {
        background: #ffe33f;
        font-size: 24px;
        font-size: 2.4rem;
        color: #333;
        width: 50px;
        height: 50px;
        -webkit-border-radius: 25px;
        /* width,heightの半分 */
        -moz-border-radius: 25px;
        border-radius: 25px;
        position: absolute;
        top: -35px;
        left: -25px;
        padding-top: 5px; }
      #sup #container .content .main article #how ul li h3 {
        font-size: 30px;
        font-size: 3rem;
        margin: 20px 0 10px; }
      #sup #container .content .main article #how ul li .text {
        text-align: left;
        font-size: 12px;
        font-size: 1.2rem; }
      #sup #container .content .main article #how ul li:before {
        font-family: 'icomoon';
        content: "\ea1c";
        color: #858585;
        font-size: 30px;
        font-size: 3rem;
        position: absolute;
        top: 70px;
        left: -30px; }
    #sup #container .content .main article #how ul .first:before {
      display: none; }
  @media only screen and (min-width: 0px) and (max-width: 599px) {
    #sup #container .content .main article #how ul {
      width: 100%; }
      #sup #container .content .main article #how ul li {
        width: 80%;
        height: auto;
        padding-bottom: 10px; }
        #sup #container .content .main article #how ul li:before {
          content: "\ea3e";
          font-size: 20px;
          font-size: 2rem;
          position: absolute;
          top: -30px;
          right: -30px; } }
  @media only screen and (min-width: 600px) and (max-width: 800px) {
    #sup #container .content .main article #how ul {
      width: 100%; }
      #sup #container .content .main article #how ul li {
        width: 40%; } }
  @media only screen and (min-width: 801px) and (max-width: 3000x) {
    #sup #container .content .main article #how ul {
      width: 100%; }
      #sup #container .content .main article #how ul li {
        width: 40%; }
        #sup #container .content .main article #how ul li:before {
          font-family: 'icomoon';
          content: "\ea1c";
          color: #858585;
          font-size: 30px;
          font-size: 3rem;
          position: absolute; } }
  #sup #container .content .main article #faq dl {
    border: 3px solid #333;
    text-align: left;
    width: 90%;
    padding: 10px;
    margin: 0 auto 30px;
    font-size: 12px;
    font-size: 1.2rem; }
  #sup #container .content .main article #programCoordinators {
    background: #fff;
    font-size: 12px;
    font-size: 1.2rem; }
    #sup #container .content .main article #programCoordinators .potential {
      position: relative;
      background: #fff;
      border: 2px dotted #333;
      width: 90%;
      margin: 0 auto 30px;
      padding: 10px; }
      #sup #container .content .main article #programCoordinators .potential h3 {
        margin: 10px; }
    #sup #container .content .main article #programCoordinators .staff-recruitment {
      position: relative;
      width: 90%;
      background: #FBDE25;
      margin: 0 auto 30px;
      padding: 10px 0 10px 0;
      font-size: 14px;
      font-size: 1.4rem; }
      @media only screen and (min-width: 0px) and (max-width: 468px) {
        #sup #container .content .main article #programCoordinators .staff-recruitment {
          font-size: 13px;
          font-size: 1.3rem;
          padding: 10px 10px 10px 10px; } }
      #sup #container .content .main article #programCoordinators .staff-recruitment .recruitmentImage {
        display: inline-block; }
        @media only screen and (min-width: 0px) and (max-width: 468px) {
          #sup #container .content .main article #programCoordinators .staff-recruitment .recruitmentImage {
            width: 90%;
            height: auto; } }
    #sup #container .content .main article #programCoordinators .inner {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap;
      margin: 0 auto; }
      #sup #container .content .main article #programCoordinators .inner .voiceBox {
        width: 46%;
        margin: 0 auto 20px;
        background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/sup-voice-bg.png") repeat 0 0;
        border-radius: 10px;
        -webkit-border-radius: 10px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 10px;
        /* Firefox用 */
        padding: 15px; }
        #sup #container .content .main article #programCoordinators .inner .voiceBox .figure {
          float: left;
          width: 35%; }
          #sup #container .content .main article #programCoordinators .inner .voiceBox .figure img {
            width: 100%;
            height: auto; }
        #sup #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
          padding-left: 10px;
          text-align: left;
          float: right;
          width: 60%; }
      #sup #container .content .main article #programCoordinators .inner .bosyuBox img {
        width: 100%;
        height: auto;
        max-width: 316px;
        max-height: 232px; }
      #sup #container .content .main article #programCoordinators .inner .bosyuBox a {
        color: #333; }
        #sup #container .content .main article #programCoordinators .inner .bosyuBox a .bosyuText {
          font-size: 14px;
          font-size: 1.4rem;
          font-weight: bold; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #sup #container .content .main article #programCoordinators .potential h3 {
        margin: 10px auto;
        width: 100%;
        height: auto; }
        #sup #container .content .main article #programCoordinators .potential h3 img {
          width: 90%;
          height: auto; }
      #sup #container .content .main article #programCoordinators .inner .voiceBox {
        width: 90%; }
        #sup #container .content .main article #programCoordinators .inner .voiceBox .figure {
          float: none;
          width: 90%;
          margin: 0 auto; }
        #sup #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
          float: none;
          width: 100%; } }
    @media only screen and (min-width: 481px) and (max-width: 769px) {
      #sup #container .content .main article #programCoordinators .potential h3 {
        margin: 10px auto;
        width: 100%;
        height: auto; }
        #sup #container .content .main article #programCoordinators .potential h3 img {
          width: 80%;
          height: auto; }
      #sup #container .content .main article #programCoordinators .inner .voiceBox {
        width: 45%;
        text-align: center; }
        #sup #container .content .main article #programCoordinators .inner .voiceBox .figure {
          float: none;
          width: 90%;
          margin: 0 auto; }
        #sup #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
          float: none;
          width: 100%;
          text-align: left; } }

.eng#sup #container .content .main article #exactly .exactlyBox ul {
  padding: 30px; }

#supStaff #container .content .topMain {
  margin: 0 auto;
  z-index: 1;
  background: url("/gengo/assets/img/gaikokugo-gakusyu/staff/staff_topMain_bg.png") no-repeat center center;
  background-size: cover; }
  #supStaff #container .content .topMain h1 {
    text-align: center;
    padding: 50px 0 0;
    margin-bottom: 0; }
    #supStaff #container .content .topMain h1 img {
      text-align: center; }
    #supStaff #container .content .topMain h1 span {
      display: block; }
  @media only screen and (min-width: 0px) and (max-width: 780px) {
    #supStaff #container .content .topMain {
      width: 100%;
      height: auto; }
      #supStaff #container .content .topMain h1 {
        padding: 10px 0 20px; }
        #supStaff #container .content .topMain h1 .contentsImg {
          width: 80%;
          height: auto; } }
  @media only screen and (min-width: 769px) and (max-width: 3000px) {
    #supStaff #container .content .topMain {
      width: 100%;
      height: 550px; }
      #supStaff #container .content .topMain h1 .contentsImg {
        width: 624px;
        height: 225px; } }
  #supStaff #container .content .topMain .slider {
    margin: 0;
    padding: 60px 0 0 0; }
    @media only screen and (min-width: 0px) and (max-width: 780px) {
      #supStaff #container .content .topMain .slider {
        padding: 30px 0 0 0; } }
    #supStaff #container .content .topMain .slider li {
      margin: 0 0 0 0; }
#supStaff #container .content .main article {
  margin: 0 auto 30px;
  max-width: 1200px;
  width: 100%; }
  #supStaff #container .content .main article section {
    margin-bottom: 30px; }
    #supStaff #container .content .main article section h2 {
      border-bottom: 4px solid #333;
      display: inline-block;
      font-size: 30px;
      font-size: 3rem; }
    #supStaff #container .content .main article section .dlList {
      width: 90%;
      margin: 0 auto 10px;
      border: 1px solid #ccc;
      background: #eeeeee;
      font-size: 14px;
      font-size: 1.4rem;
      display: table; }
      #supStaff #container .content .main article section .dlList dt {
        font-weight: bold;
        display: table-cell;
        vertical-align: middle;
        padding: 10px;
        clear: both;
        width: 30%; }
      #supStaff #container .content .main article section .dlList dd {
        padding: 10px;
        display: table-cell;
        vertical-align: middle;
        text-align: left;
        background: #fff;
        width: 70%; }
        #supStaff #container .content .main article section .dlList dd strong {
          font-size: 18px;
          font-size: 1.8rem;
          font-weight: bold;
          color: #3ab8cf;
          display: block; }
      @media only screen and (min-width: 0px) and (max-width: 468px) {
        #supStaff #container .content .main article section .dlList {
          font-size: 12px;
          font-size: 1.2rem; }
          #supStaff #container .content .main article section .dlList dt {
            display: block;
            width: 100%; }
          #supStaff #container .content .main article section .dlList dd {
            display: block;
            width: 100%;
            margin-left: 0; } }
  #supStaff #container .content .main article #programCoordinators {
    background: #fff;
    font-size: 12px;
    font-size: 1.2rem;
    text-align: center; }
    #supStaff #container .content .main article #programCoordinators .staff-recruitment {
      position: relative;
      width: 90%;
      background: url("/gengo/assets/img/gaikokugo-gakusyu/staff/staff-recruitment_bg.jpg") no-repeat right top;
      margin: 0 auto 30px;
      padding: 10px 0 10px 0;
      font-size: 14px;
      font-size: 1.4rem; }
      #supStaff #container .content .main article #programCoordinators .staff-recruitment a {
        display: inline-block;
        background: #fff;
        border-radius: 5px;
        text-decoration: none;
        margin: 0 0 10px 0; }
        #supStaff #container .content .main article #programCoordinators .staff-recruitment a p {
          margin: 10px 10px 10px 10px; }
      @media only screen and (min-width: 0px) and (max-width: 468px) {
        #supStaff #container .content .main article #programCoordinators .staff-recruitment {
          font-size: 13px;
          font-size: 1.3rem;
          padding: 10px 10px 10px 10px; } }
      #supStaff #container .content .main article #programCoordinators .staff-recruitment .recruitmentImage {
        display: block;
        margin: 0 auto; }
        @media only screen and (min-width: 0px) and (max-width: 468px) {
          #supStaff #container .content .main article #programCoordinators .staff-recruitment .recruitmentImage {
            width: 90%;
            height: auto; } }
    #supStaff #container .content .main article #programCoordinators .r-tabs {
      position: relative;
      width: 90%;
      margin: 0 auto; }
      #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav {
        margin: 0;
        padding: 0;
        text-align: left;
        margin: 0 0 0 0; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-tab {
          position: relative;
          display: inline-block;
          margin: 0;
          padding: 0;
          list-style: none;
          text-decoration: none;
          font-size: 14px;
          font-size: 1.4rem;
          font-weight: bold;
          text-align: center;
          width: 33%; }
          #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-tab a {
            margin: 0 0 0 0;
            width: 100%; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-anchor {
          color: #666;
          display: inline-block;
          font-weight: bold;
          padding: 10px 12px;
          text-decoration: none; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
          color: #000;
          text-shadow: none; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-state-active #kic {
          background: #b5e1cf; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-state-active #bkc {
          background: #b4cee0; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-state-active #oic {
          background: #e5c9de; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav .r-tabs-state-disabled {
          opacity: 0.5; }
      #supStaff #container .content .main article #programCoordinators .r-tabs #tab1 {
        background: #b5e1cf; }
      #supStaff #container .content .main article #programCoordinators .r-tabs #tab2 {
        background: #b4cee0; }
      #supStaff #container .content .main article #programCoordinators .r-tabs #tab3 {
        background: #e5c9de; }
      #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-panel {
        display: none;
        background: #fff; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-panel .r-tabs-state-active {
          display: block; }
      #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-accordion-title {
        display: none; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
          display: block;
          padding: 10px;
          color: #fff;
          font-weight: bold;
          text-decoration: none;
          font-size: 14px; }
      #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-state-active .r-tabs-anchor {
        background: #efc147;
        color: #fff;
        text-shadow: none; }
      #supStaff #container .content .main article #programCoordinators .r-tabs .tab-inner {
        width: 94%;
        margin: 0 auto 40px; }
    #supStaff #container .content .main article #programCoordinators #tab-1 {
      background: #b5e1cf; }
    #supStaff #container .content .main article #programCoordinators #tab-2 {
      background: #b4cee0; }
    #supStaff #container .content .main article #programCoordinators #tab-3 {
      background: #e5c9de; }
    #supStaff #container .content .main article #programCoordinators .inner {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap;
      margin: 0 20px 10px;
      padding: 30px 0; }
      @media only screen and (min-width: 0px) and (max-width: 468px) {
        #supStaff #container .content .main article #programCoordinators .inner {
          margin: 0 10px 10px; } }
      #supStaff #container .content .main article #programCoordinators .inner .position {
        position: relative;
        background: #fff;
        border: 1px dotted #333;
        width: 95%;
        margin: 0 auto 30px;
        padding: 10px; }
        #supStaff #container .content .main article #programCoordinators .inner .position ul {
          padding: 0 0 0 0; }
          @media only screen and (min-width: 0px) and (max-width: 468px) {
            #supStaff #container .content .main article #programCoordinators .inner .position ul {
              margin: 0 0 0 0;
              padding: 0 0 0 0; } }
          #supStaff #container .content .main article #programCoordinators .inner .position ul li {
            list-style: none;
            display: inline-block;
            font-weight: bold;
            margin: 0 20px 0 0; }
            @media only screen and (min-width: 0px) and (max-width: 468px) {
              #supStaff #container .content .main article #programCoordinators .inner .position ul li {
                display: block;
                text-align: left;
                margin: 0 5px 0 5px; } }
            #supStaff #container .content .main article #programCoordinators .inner .position ul li .icon {
              vertical-align: center;
              margin: 0 5px 0 0; }
      #supStaff #container .content .main article #programCoordinators .inner .coming-soon {
        margin: 0 auto; }
      #supStaff #container .content .main article #programCoordinators .inner .voiceBox {
        width: 46%;
        margin: 0 auto 20px;
        background: url("/gengo/assets/img/gaikokugo-gakusyu/staff/staff-voice-bg.png") repeat 0 0;
        padding: 20px 15px 15px 15px; }
        #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure {
          float: left;
          width: 35%; }
          #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure .photo {
            width: 100%;
            height: auto; }
          #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure .voicePosition {
            padding: 0 0 0 0; }
            #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure .voicePosition li {
              list-style: none;
              display: inline-block;
              font-weight: bold;
              margin: 0 0 0 0; }
              #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure .voicePosition li .icon {
                vertical-align: center;
                margin: 0 0 0 0; }
        #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
          padding-left: 10px;
          text-align: left;
          float: right;
          width: 60%; }
      #supStaff #container .content .main article #programCoordinators .inner .bosyuBox img {
        width: 100%;
        height: auto;
        max-width: 316px;
        max-height: 232px; }
      #supStaff #container .content .main article #programCoordinators .inner .bosyuBox a {
        color: #333; }
        #supStaff #container .content .main article #programCoordinators .inner .bosyuBox a .bosyuText {
          font-size: 14px;
          font-size: 1.4rem;
          font-weight: bold; }
    @media only screen and (min-width: 0px) and (max-width: 600px) {
      #supStaff #container .content .main article #programCoordinators {
        margin: 10px 0; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-nav {
          display: none; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-accordion-title {
          display: block;
          border-bottom: 1px solid #fff; }
          #supStaff #container .content .main article #programCoordinators .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
            background: #858585; }
        #supStaff #container .content .main article #programCoordinators .r-tabs r-tabs-state-active .r-tabs-anchor {
          color: #fff;
          background: #e4e4e4; }
        #supStaff #container .content .main article #programCoordinators .r-tabs .tab-inner {
          overflow-x: auto;
          white-space: nowrap;
          -webkit-overflow-scrolling: touch; } }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #supStaff #container .content .main article #programCoordinators .potential h3 {
        margin: 10px auto;
        width: 100%;
        height: auto; }
        #supStaff #container .content .main article #programCoordinators .potential h3 img {
          width: 90%;
          height: auto; }
      #supStaff #container .content .main article #programCoordinators .inner .voiceBox {
        width: 95%; }
        #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure {
          float: none;
          width: 90%;
          margin: 0 auto; }
        #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
          float: none;
          width: 100%;
          text-align: left; } }
    @media only screen and (min-width: 481px) and (max-width: 769px) {
      #supStaff #container .content .main article #programCoordinators .potential h3 {
        margin: 10px auto;
        width: 100%;
        height: auto; }
        #supStaff #container .content .main article #programCoordinators .potential h3 img {
          width: 80%;
          height: auto; }
      #supStaff #container .content .main article #programCoordinators .inner .voiceBox {
        width: 45%;
        text-align: center; }
        #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figure {
          float: none;
          width: 90%;
          margin: 0 auto; }
        #supStaff #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
          float: none;
          width: 100%;
          text-align: left; } }

#talkfest #container .content {
  margin-bottom: 0;
  padding-bottom: 0; }
  #talkfest #container .content .topMain {
    margin: 0 auto;
    z-index: 1;
    background: url("/gengo/assets/img/gaikokugo-gakusyu/talkfest/talkfest_topMain_bg.png") no-repeat 0 0;
    background-size: contain; }
    #talkfest #container .content .topMain .inner {
      position: relative; }
      #talkfest #container .content .topMain .inner h1 {
        padding: 0;
        margin: 0; }
      #talkfest #container .content .topMain .inner p {
        margin: 0; }
        #talkfest #container .content .topMain .inner p .contentsImg {
          z-index: 5;
          position: absolute;
          top: 0;
          left: 0; }
    @media only screen and (min-width: 0px) and (max-width: 1280px) {
      #talkfest #container .content .topMain {
        width: 100%;
        height: auto; }
        #talkfest #container .content .topMain img {
          width: 100%;
          height: auto; } }
  #talkfest #container .content .main article {
    margin: 0 auto 30px;
    max-width: 1200px;
    width: 100%; }
    #talkfest #container .content .main article section {
      margin-bottom: 0;
      text-align: center; }
      #talkfest #container .content .main article section h2 {
        border-bottom: 4px solid #333;
        display: inline-block;
        font-size: 30px;
        font-size: 3rem; }
        @media only screen and (min-width: 0px) and (max-width: 600px) {
          #talkfest #container .content .main article section h2 {
            font-size: 20px;
            font-size: 2rem; } }
      #talkfest #container .content .main article section .dlList {
        width: 90%;
        margin: 0 auto;
        background: #333;
        font-size: 14px;
        font-size: 1.4rem;
        display: table; }
        #talkfest #container .content .main article section .dlList dt {
          font-weight: bold;
          display: table-cell;
          vertical-align: middle;
          color: #fff;
          padding: 10px;
          clear: both;
          width: 30%; }
        #talkfest #container .content .main article section .dlList dd {
          padding: 10px;
          display: table-cell;
          vertical-align: middle;
          text-align: left;
          background: #fff;
          width: 70%; }
          #talkfest #container .content .main article section .dlList dd strong {
            font-size: 18px;
            font-size: 1.8rem;
            font-weight: bold;
            display: block; }
        @media only screen and (min-width: 0px) and (max-width: 468px) {
          #talkfest #container .content .main article section .dlList {
            font-size: 12px;
            font-size: 1.2rem; }
            #talkfest #container .content .main article section .dlList dt {
              display: block;
              width: 100%; }
            #talkfest #container .content .main article section .dlList dd {
              display: block;
              width: 100%;
              margin-left: 0; } }
    #talkfest #container .content .main article #exactly {
      background: #fae455; }
      #talkfest #container .content .main article #exactly h2 {
        font-size: 30px;
        font-size: 3rem;
        margin-bottom: 0;
        border-bottom: none; }
      #talkfest #container .content .main article #exactly .exactlyBox {
        margin: 30px auto 60px;
        width: 100%;
        max-width: 1090px;
        background: #fff;
        font-size: 18px;
        font-size: 1.8rem; }
        #talkfest #container .content .main article #exactly .exactlyBox h3 {
          padding-top: 30px; }
          #talkfest #container .content .main article #exactly .exactlyBox h3 span {
            border-bottom: 3px solid #333;
            display: inline-block; }
        #talkfest #container .content .main article #exactly .exactlyBox ul {
          padding: 30px;
          text-align: left; }
          #talkfest #container .content .main article #exactly .exactlyBox ul li {
            list-style: none;
            line-height: 1.8;
            margin-bottom: 10px; }
            #talkfest #container .content .main article #exactly .exactlyBox ul li:before {
              font-family: 'icomoon';
              content: "\ea10";
              display: inline-block;
              margin-right: 5px;
              padding: 0 10px;
              border: 1px solid #333;
              border-radius: 3px;
              /* CSS3草案 */
              -webkit-border-radius: 3px;
              /* Safari,Google Chrome用 */
              -moz-border-radius: 3px;
              /* Firefox用 */ }
      @media only screen and (min-width: 0px) and (max-width: 800px) {
        #talkfest #container .content .main article #exactly h2 {
          font-size: 20px;
          font-size: 2rem; }
        #talkfest #container .content .main article #exactly .exactlyBox {
          font-size: 13px;
          font-size: 1.3rem; }
          #talkfest #container .content .main article #exactly .exactlyBox h3 {
            font-size: 20px;
            font-size: 2rem; }
          #talkfest #container .content .main article #exactly .exactlyBox ul {
            padding: 10px; } }
    #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox {
      display: -webkit-flex;
      display: flex;
      flex-wrap: wrap; }
      #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figure {
        width: 50%; }
        #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figure img {
          width: 100%;
          height: auto;
          max-width: 403px;
          height: 389px; }
      #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figcaption {
        width: 50%;
        color: #333;
        font-size: 18px;
        font-size: 1.8rem;
        padding-top: 100px; }
        #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figcaption h3 {
          border-bottom: 5px dotted #fff; }
          #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figcaption h3:before {
            font-family: 'icomoon';
            content: "\e9b2";
            padding: 2px;
            font-size: 30px;
            font-size: 3rem;
            display: inline-block;
            margin-right: 5px;
            vertical-align: middle; }
      @media only screen and (min-width: 0px) and (max-width: 1280px) {
        #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox {
          margin: 0 auto; }
          #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figure {
            width: 100%;
            display: block; }
            #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figure img {
              width: 80%;
              height: auto; }
          #talkfest #container .content .main article #talkfestImageArea .talkfestImageBox .figcaption {
            width: 100%;
            display: block;
            padding-top: 10px; } }
    #talkfest #container .content .main article #talkfestImageArea .talkfestImage01 {
      background: #00D3FF; }
    #talkfest #container .content .main article #talkfestImageArea .talkfestImage02 {
      background: #70E7FF;
      flex-direction: row-reverse; }
    #talkfest #container .content .main article #talkfestImageArea .talkfestImage03 {
      background: #00D3FF; }
    #talkfest #container .content .main article #talkfestImageArea .talkfestImage04 {
      background: #70E7FF;
      flex-direction: row-reverse; }
    #talkfest #container .content .main article #when {
      padding-bottom: 60px;
      background: #2099ED; }
      #talkfest #container .content .main article #when .whenBox {
        background: #fff;
        padding: 10px;
        margin: 30px auto 60px;
        max-width: 1090px;
        width: 100%; }
        #talkfest #container .content .main article #when .whenBox strong {
          color: #3ab8cf;
          display: block;
          font-size: 1.8rem;
          font-weight: bold; }
        #talkfest #container .content .main article #when .whenBox ul {
          display: -webkit-flex;
          display: flex;
          padding-left: 0;
          justify-content: center; }
          #talkfest #container .content .main article #when .whenBox ul li {
            width: 30%;
            list-style: none;
            text-align: center;
            margin-right: 10px;
            padding: 10px;
            border-radius: 10px;
            -webkit-border-radius: 10px;
            /* Safari,Google Chrome用 */
            -moz-border-radius: 10px;
            /* Firefox用 */ }
            #talkfest #container .content .main article #when .whenBox ul li a {
              display: block;
              text-decoration: none; }
              #talkfest #container .content .main article #when .whenBox ul li a:before {
                font-family: 'icomoon';
                content: "\ea1c";
                display: inline-block;
                font-size: 14px;
                font-size: 1.4rem;
                margin-right: 5px; }
          #talkfest #container .content .main article #when .whenBox ul .kic {
            background: #FFF1A5; }
          #talkfest #container .content .main article #when .whenBox ul .bkc {
            background: #C3E5F4; }
          #talkfest #container .content .main article #when .whenBox ul .oic {
            background: #F9D2BD; }
    #talkfest #container .content .main article #programCoordinators {
      background: #fff;
      font-size: 12px;
      font-size: 1.2rem; }
      #talkfest #container .content .main article #programCoordinators .potential {
        position: relative;
        background: #fff;
        border: 2px dotted #333;
        width: 90%;
        margin: 0 auto 30px;
        padding: 10px; }
        #talkfest #container .content .main article #programCoordinators .potential h3 {
          margin: 10px; }
      #talkfest #container .content .main article #programCoordinators .staff-recruitment {
        position: relative;
        width: 90%;
        background: #FBDE25;
        margin: 0 auto 30px;
        padding: 10px 0 10px 0;
        font-size: 14px;
        font-size: 1.4rem; }
        @media only screen and (min-width: 0px) and (max-width: 468px) {
          #talkfest #container .content .main article #programCoordinators .staff-recruitment {
            font-size: 13px;
            font-size: 1.3rem;
            padding: 10px 10px 10px 10px; } }
        #talkfest #container .content .main article #programCoordinators .staff-recruitment .recruitmentImage {
          display: inline-block; }
          @media only screen and (min-width: 0px) and (max-width: 468px) {
            #talkfest #container .content .main article #programCoordinators .staff-recruitment .recruitmentImage {
              width: 90%;
              height: auto; } }
      #talkfest #container .content .main article #programCoordinators .inner {
        display: -webkit-flex;
        display: flex;
        flex-wrap: wrap;
        margin: 0 auto; }
        #talkfest #container .content .main article #programCoordinators .inner .voiceBox {
          width: 46%;
          margin: 0 auto 20px;
          background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/sup-voice-bg.png") repeat 0 0;
          border-radius: 10px;
          -webkit-border-radius: 10px;
          /* Safari,Google Chrome用 */
          -moz-border-radius: 10px;
          /* Firefox用 */
          padding: 15px; }
          #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figure {
            float: left;
            width: 35%; }
            #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figure img {
              width: 100%;
              height: auto; }
          #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
            padding-left: 10px;
            text-align: left;
            float: right;
            width: 60%; }
        #talkfest #container .content .main article #programCoordinators .inner .bosyuBox img {
          width: 100%;
          height: auto;
          max-width: 316px;
          max-height: 232px; }
        #talkfest #container .content .main article #programCoordinators .inner .bosyuBox a {
          color: #333; }
          #talkfest #container .content .main article #programCoordinators .inner .bosyuBox a .bosyuText {
            font-size: 14px;
            font-size: 1.4rem;
            font-weight: bold; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        #talkfest #container .content .main article #programCoordinators .potential h3 {
          margin: 10px auto;
          width: 100%;
          height: auto; }
          #talkfest #container .content .main article #programCoordinators .potential h3 img {
            width: 90%;
            height: auto; }
        #talkfest #container .content .main article #programCoordinators .inner .voiceBox {
          width: 90%; }
          #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figure {
            float: none;
            width: 90%;
            margin: 0 auto; }
          #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
            float: none;
            width: 100%; } }
      @media only screen and (min-width: 481px) and (max-width: 769px) {
        #talkfest #container .content .main article #programCoordinators .potential h3 {
          margin: 10px auto;
          width: 100%;
          height: auto; }
          #talkfest #container .content .main article #programCoordinators .potential h3 img {
            width: 80%;
            height: auto; }
        #talkfest #container .content .main article #programCoordinators .inner .voiceBox {
          width: 45%;
          text-align: center; }
          #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figure {
            float: none;
            width: 90%;
            margin: 0 auto; }
          #talkfest #container .content .main article #programCoordinators .inner .voiceBox .figcaption {
            float: none;
            width: 100%;
            text-align: left; } }

#ebook #container .content .topMain {
  margin: 0 auto;
  z-index: 1;
  background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/ebook_topMain_bg.png") no-repeat center center;
  background-size: cover; }
  #ebook #container .content .topMain .lead {
    z-index: 2;
    position: relative;
    margin: 0 auto;
    text-align: center; }
    @media only screen and (min-width: 1025px) and (max-width: 3000px) {
      #ebook #container .content .topMain .lead {
        width: 100%;
        height: 630px; } }
    @media only screen and (min-width: 0px) and (max-width: 1024px) {
      #ebook #container .content .topMain .lead {
        width: 100%;
        height: auto; } }
    #ebook #container .content .topMain .lead h1 {
      text-align: center;
      padding: 50px 0 0;
      margin-bottom: 0; }
      @media only screen and (min-width: 0px) and (max-width: 780px) {
        #ebook #container .content .topMain .lead h1 {
          padding: 10px 0 20px;
          margin: 0 0 0 0; } }
      #ebook #container .content .topMain .lead h1 img {
        text-align: center; }
        @media only screen and (min-width: 769px) and (max-width: 3000px) {
          #ebook #container .content .topMain .lead h1 img {
            width: 674px;
            height: 383px; } }
        @media only screen and (min-width: 0px) and (max-width: 780px) {
          #ebook #container .content .topMain .lead h1 img {
            width: 80%;
            height: auto; } }
    #ebook #container .content .topMain .lead p {
      margin: 0 0 0 0; }
    @media only screen and (min-width: 1025px) and (max-width: 3000px) {
      #ebook #container .content .topMain .lead .sp-line {
        display: none; } }
    @media only screen and (min-width: 0) and (max-width: 1024px) {
      #ebook #container .content .topMain .lead .sp-line {
        display: block;
        border: 5px solid #48bdbd;
        background: #fff; } }
    #ebook #container .content .topMain .lead .text {
      z-index: 4;
      margin: 0 auto; }
      @media only screen and (min-width: 1025px) and (max-width: 3000px) {
        #ebook #container .content .topMain .lead .text {
          position: absolute;
          left: 0;
          right: 0;
          bottom: 30px;
          padding: 45px 0 20px 0; } }
      @media only screen and (min-width: 0) and (max-width: 1024px) {
        #ebook #container .content .topMain .lead .text {
          background: #fff;
          padding: 30px 0 20px 0; } }
      @media only screen and (min-width: 0) and (max-width: 767px) {
        #ebook #container .content .topMain .lead .text img {
          width: 90%;
          height: auto; } }
    #ebook #container .content .topMain .lead .text-bg {
      position: absolute;
      bottom: 0;
      z-index: 3; }
      @media only screen and (min-width: 0) and (max-width: 1024px) {
        #ebook #container .content .topMain .lead .text-bg img {
          display: none; } }
#ebook #container .content .main article {
  margin: 0 auto 30px;
  max-width: 1200px;
  width: 100%; }
  #ebook #container .content .main article section {
    margin-bottom: 30px; }
    #ebook #container .content .main article section h2 {
      display: inline-block;
      margin: 0 0 50px 0; }
      @media only screen and (min-width: 0) and (max-width: 767px) {
        #ebook #container .content .main article section h2 img {
          width: 95%;
          height: auto; } }
  #ebook #container .content .main article #ritsumeiLibrary {
    background: #fff;
    text-align: center; }
    #ebook #container .content .main article #ritsumeiLibrary .block {
      position: relative;
      margin: 0 0 30px 0; }
      @media only screen and (min-width: 0) and (max-width: 767px) {
        #ebook #container .content .main article #ritsumeiLibrary .block .photo {
          width: 90%;
          height: auto; } }
      #ebook #container .content .main article #ritsumeiLibrary .block p {
        font-size: 18px;
        font-size: 1.8rem;
        padding: 5px 0; }
        #ebook #container .content .main article #ritsumeiLibrary .block p .number {
          background: #fcd43e;
          color: #fff;
          width: 30px;
          height: 30px;
          -webkit-border-radius: 50%;
          /* 50%でもOK */
          -moz-border-radius: 50%;
          border-radius: 50%;
          display: inline-block;
          margin: 0 5px 0 0; }
      #ebook #container .content .main article #ritsumeiLibrary .block .fa-arrow-down {
        color: #49bdbd;
        font-size: 80px;
        font-size: 8rem; }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          #ebook #container .content .main article #ritsumeiLibrary .block .fa-arrow-down {
            font-size: 60px;
            font-size: 6rem; } }
      #ebook #container .content .main article #ritsumeiLibrary .block .innerLine {
        position: relative;
        display: inline-block;
        border: 1px solid #48bdbd;
        border-radius: 20px; }
        #ebook #container .content .main article #ritsumeiLibrary .block .innerLine img {
          border-radius: 20px; }
          @media only screen and (min-width: 0) and (max-width: 767px) {
            #ebook #container .content .main article #ritsumeiLibrary .block .innerLine img {
              width: 100%;
              height: auto; } }
        @media only screen and (min-width: 0) and (max-width: 767px) {
          #ebook #container .content .main article #ritsumeiLibrary .block .innerLine {
            width: 90%;
            height: auto; } }
    #ebook #container .content .main article #ritsumeiLibrary .r-tabs {
      position: relative;
      margin: 0 auto; }
      @media only screen and (min-width: 769px) and (max-width: 3000px) {
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs {
          width: 90%; } }
      @media only screen and (min-width: 481px) and (max-width: 768px) {
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs {
          width: 100%; } }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav {
        margin: 0;
        padding: 0;
        text-align: left;
        margin: 0 0 0 0;
        display: flex;
        flex-wrap: wrap; }
        @media only screen and (min-width: 0px) and (max-width: 660px) {
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav {
            display: block; } }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-tab {
          position: relative;
          margin: 0;
          padding: 0;
          list-style: none;
          text-decoration: none;
          font-size: 14px;
          font-size: 1.4rem;
          font-weight: bold;
          text-align: center;
          width: 50%; }
          @media only screen and (min-width: 0px) and (max-width: 660px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-tab {
              width: 100%;
              border-bottom: 1px solid #fff; } }
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-tab a {
            margin: 0 0 0 0;
            width: 100%; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-anchor {
          color: #666;
          display: inline-block;
          font-weight: bold;
          padding: 10px 12px;
          text-decoration: none; }
          @media only screen and (min-width: 0px) and (max-width: 660px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-anchor {
              color: #fff;
              background: #858585; } }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
          color: #000;
          text-shadow: none; }
          @media only screen and (min-width: 0px) and (max-width: 660px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
              color: #fff;
              background: #858585; } }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-active .macmillan {
          background: #d5c7a0; }
          @media only screen and (min-width: 0px) and (max-width: 660px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-active .macmillan {
              color: #fff;
              background: #858585; } }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-active .turners {
          background: #a3d7d5; }
          @media only screen and (min-width: 0px) and (max-width: 660px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-active .turners {
              color: #fff;
              background: #858585; } }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-nav .r-tabs-state-disabled {
          opacity: 0.5; }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-panel {
        display: none;
        background: #fff; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-panel .r-tabs-state-active {
          display: block; }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-accordion-title {
        display: none; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
          display: block;
          padding: 10px;
          color: #fff;
          font-weight: bold;
          text-decoration: none;
          font-size: 14px; }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs .r-tabs-state-active .r-tabs-anchor {
        background: #efc147;
        color: #fff;
        text-shadow: none; }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs .tab-inner {
        width: 94%;
        margin: 0 auto 40px; }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 {
        background: #d5c7a0; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 {
          height: 160px;
          margin: 0 0 20px 0; }
          @media only screen and (min-width: 1025px) and (max-width: 3000px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 {
              width: 1040px;
              padding: 30px 0 0 120px;
              background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/macmillan-ebook-ttl.png") no-repeat scroll left bottom; }
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 .ebookIcon {
                position: absolute;
                top: 14px;
                right: 22px; } }
          @media only screen and (min-width: 481px) and (max-width: 1025px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 {
              width: 100%;
              padding: 30px 0 0 100px;
              background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/macmillan-ebook-ttl.png") no-repeat scroll left bottom; }
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 .ebookIcon {
                display: none; } }
          @media only screen and (min-width: 0) and (max-width: 480px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 {
              width: 100%;
              height: 140px;
              background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/macmillan-ebook-ttl-sp.png") no-repeat scroll left bottom;
              padding: 20px 0 0 70px;
              font-size: 20px;
              font-size: 2rem; }
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h2 .ebookIcon {
                display: none; } }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab1 h3 {
            font-size: 14px;
            font-size: 1.4rem; } }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 {
        background: #a3d7d5; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 {
          height: 160px;
          margin: 0 0 20px 0;
          color: #fed404; }
          @media only screen and (min-width: 1025px) and (max-width: 3000px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 {
              width: 1040px;
              padding: 30px 0 0 120px;
              background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/turners-ebook-ttl.png") no-repeat scroll left bottom; }
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 .ebookIcon {
                position: absolute;
                top: 14px;
                right: 22px; } }
          @media only screen and (min-width: 481px) and (max-width: 1025px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 {
              width: 100%;
              padding: 30px 0 0 100px;
              font-size: 20px;
              font-size: 2rem;
              background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/turners-ebook-ttl.png") no-repeat scroll left bottom; }
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 .ebookIcon {
                display: none; } }
          @media only screen and (min-width: 0) and (max-width: 480px) {
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 {
              width: 100%;
              height: 150px;
              background: url("/gengo/assets/img/gaikokugo-gakusyu/ebook/turners-ebook-ttl-sp.png") no-repeat scroll left bottom;
              padding: 20px 0 0 80px;
              font-size: 18px;
              font-size: 1.8rem; }
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h2 .ebookIcon {
                display: none; } }
        @media only screen and (min-width: 0) and (max-width: 480px) {
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs #tab2 h3 {
            font-size: 13px;
            font-size: 1.3rem; } }
      #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner {
        margin: 0 20px 10px;
        padding: 30px 0; }
        @media only screen and (min-width: 0px) and (max-width: 468px) {
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner {
            margin: 0 10px 10px; } }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner h2 {
          display: block;
          text-align: left;
          font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
          font-size: 26px;
          font-size: 2.6rem;
          position: relative; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner h3 {
          border: 1px dotted #333;
          border-radius: 10px;
          padding: 20px 0;
          text-align: center;
          display: block;
          margin: 0 0 30px 0;
          font-size: 16px;
          font-size: 1.6rem; }
        #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          margin: 0 0 20px 0; }
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure {
            width: 55%;
            text-align: center; }
            @media only screen and (min-width: 769px) and (max-width: 3000px) {
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure {
                max-width: 500px; } }
            @media only screen and (min-width: 737px) and (max-width: 768px) {
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure {
                width: 350px;
                height: auto; } }
            @media only screen and (min-width: 0px) and (max-width: 736px) {
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure {
                width: 95%; } }
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure .photo {
              border-radius: 5px;
              margin: 0 0 20px 0;
              width: 100%;
              height: auto; }
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure .fa-arrow-down {
              color: #fff;
              font-size: 60px;
              font-size: 6rem; }
              @media only screen and (min-width: 0px) and (max-width: 480px) {
                #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block figure .fa-arrow-down {
                  font-size: 50px;
                  font-size: 5rem; } }
          #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block .textBox {
            width: 40%;
            margin: 0 0 0 5%;
            text-align: left;
            word-wrap: break-word; }
            @media only screen and (min-width: 0px) and (max-width: 736px) {
              #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block .textBox {
                width: 90%; } }
            #ebook #container .content .main article #ritsumeiLibrary .r-tabs .inner .book-block .textBox p {
              font-size: 16px;
              font-size: 1.6rem; }

.gaikokugoNews .topMain {
  background: #48bdbd;
  margin: 0 auto;
  z-index: 1; }
  .gaikokugoNews .topMain h1 {
    color: #fff;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: center;
    padding: 30px 0;
    margin: 0 0 30px; }
    .gaikokugoNews .topMain h1::before {
      font-family: 'icomoon';
      content: "\e902";
      color: #858585;
      display: inline-block;
      font-size: 40px;
      font-size: 4rem;
      background: #fff;
      border-radius: 50px;
      -webkit-border-radius: 50px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 50px;
      /* Firefox用 */
      white-space: pre;
      width: 70px;
      height: 70px; }
    .gaikokugoNews .topMain h1 span {
      display: block; }
    @media only screen and (min-width: 0px) and (max-width: 780px) {
      .gaikokugoNews .topMain h1 {
        font-size: 28px;
        font-size: 2.8rem; }
        .gaikokugoNews .topMain h1::before {
          font-size: 30px;
          font-size: 3rem;
          width: 50px;
          height: 50px; } }
.gaikokugoNews .content {
  overflow: hidden;
  *zoom: 1;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; }
  .gaikokugoNews .content .main {
    float: right;
    width: 70%; }
    .gaikokugoNews .content .main h3 {
      border-bottom: 2px dotted #ececec;
      clear: both;
      font-size: 16px;
      font-size: 1.6rem;
      font-weight: bold;
      line-height: 1.3;
      margin: 0 0 10px;
      padding: 8px 10px 7px 0; }
    .gaikokugoNews .content .main #month_selector {
      margin: 0 0 25px 0;
      display: -webkit-flex;
      display: flex;
      flex: flex-grow;
      flex-direction: row;
      width: 100%;
      padding-left: 0; }
      .gaikokugoNews .content .main #month_selector li {
        margin-right: 1px;
        -webkit-flex: 1 1 50px;
        /*--- safari（PC）用 ---*/
        flex: 1 1 50px;
        list-style: none outside; }
        .gaikokugoNews .content .main #month_selector li a {
          display: block;
          vertical-align: middle;
          padding: 5px 0;
          text-decoration: none;
          color: #000;
          text-align: center;
          background: #E9E9E9;
          border-bottom: 3px solid #fff; }
          .gaikokugoNews .content .main #month_selector li a:hover {
            border-bottom: 3px solid #900;
            background: none; }
          .gaikokugoNews .content .main #month_selector li a .current {
            background: none repeat scroll 0 0 #990000;
            color: #FFFFFF; }
            .gaikokugoNews .content .main #month_selector li a .current:hover {
              border-bottom: 3px solid #900;
              background: none;
              border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_01 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_01 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_02 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_02 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_03 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_03 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_04 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_04 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_05 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_05 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_06 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_06 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_07 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_07 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_08 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_08 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_09 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_09 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_10 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_10 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_11 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_11 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .gaikokugoNews .content .main #month_selector #news_12 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .gaikokugoNews .content .main #month_selector #news_12 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
    .gaikokugoNews .content .main #news_list article {
      clear: both;
      margin-bottom: 20px;
      padding-bottom: 20px;
      border-bottom: 1px dotted #b0ab96; }
      .gaikokugoNews .content .main #news_list article section {
        margin: 0;
        clear: none; }
        .gaikokugoNews .content .main #news_list article section .time {
          margin-bottom: 5px;
          font-size: 10px;
          font-size: 1rem;
          color: #666; }
        .gaikokugoNews .content .main #news_list article section h3 {
          font-size: 16px;
          font-size: 1.6rem; }
        .gaikokugoNews .content .main #news_list article section .desc {
          line-height: 1.6;
          font-size: 12px;
          font-size: 1.2rem; }
        .gaikokugoNews .content .main #news_list article section .read_more {
          margin: 5px 0 0 0;
          position: relative; }
    .gaikokugoNews .content .main #news_article article {
      font-size: 12px;
      font-size: 1.2rem;
      line-height: 1.8; }
  .gaikokugoNews .content #sub {
    float: left;
    width: 20%; }
    .gaikokugoNews .content #sub #local_nav ul {
      border-top: 5px solid #cecece;
      margin: 0 0 30px;
      position: relative;
      padding-left: 0; }
      .gaikokugoNews .content #sub #local_nav ul li {
        border-bottom: 2px solid #ececec;
        font-size: 12px;
        font-size: 1.2rem;
        font-weight: bold;
        list-style: none; }
        .gaikokugoNews .content #sub #local_nav ul li a {
          color: #000;
          display: block;
          padding: 15px 0 13px 2px;
          transition-delay: 0s;
          transition-duration: 0.2s;
          transition-property: background-color, color;
          transition-timing-function: linear;
          text-decoration: none; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    .gaikokugoNews .content .main {
      float: none;
      width: 96%;
      margin: 0 2%; }
    .gaikokugoNews .content #sub {
      float: none;
      width: 96%;
      margin: 0 2%; } }

#sns_button {
  display: none; }

#sup #sns_button, #talkfest #sns_button, #supStaff #sns_button {
  display: block;
  background: url("/gengo/assets/img/gaikokugo-gakusyu/sup/h_images/sns_bg.png") repeat scroll 0 0;
  padding: 8px;
  position: fixed;
  right: -5px;
  top: 80px; }
  #sup #sns_button ul, #talkfest #sns_button ul, #supStaff #sns_button ul {
    margin-bottom: -8px;
    list-style-type: none;
    padding: 0 0 0 0; }
    #sup #sns_button ul li, #talkfest #sns_button ul li, #supStaff #sns_button ul li {
      padding: 0 0 8px; }
      #sup #sns_button ul li a img, #talkfest #sns_button ul li a img, #supStaff #sns_button ul li a img {
        margin: 0 3px 0 0; }

.gaikoku-training .topMain {
  margin: 0 auto;
  z-index: 1; }
  .gaikoku-training .topMain h1 {
    color: #fff;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: center;
    padding: 30px 0;
    margin: 0 0 30px; }
    .gaikoku-training .topMain h1 span {
      display: block; }
      .gaikoku-training .topMain h1 span .u-forSp {
        display: none; }
    @media only screen and (min-width: 0px) and (max-width: 780px) {
      .gaikoku-training .topMain h1 {
        font-size: 28px;
        font-size: 2.8rem; }
        .gaikoku-training .topMain h1::before {
          font-size: 30px;
          font-size: 3rem;
          width: 50px;
          height: 50px; }
        .gaikoku-training .topMain h1 span .u-forSp {
          display: block; } }
.gaikoku-training .content {
  background: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px; }
  .gaikoku-training .content .main article {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; }
    .gaikoku-training .content .main article #outline {
      position: relative;
      min-height: 120px; }
      .gaikoku-training .content .main article #outline .outlineImg {
        position: absolute;
        top: 10px;
        left: 30px; }
      .gaikoku-training .content .main article #outline p {
        margin: 15px 10px 15px 200px;
        font-size: 13px;
        font-size: 1.3rem;
        line-height: 1.7; }
      .gaikoku-training .content .main article #outline .wtBox {
        margin: 10px 10px 10px 200px; }
        .gaikoku-training .content .main article #outline .wtBox p {
          margin-left: 0; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        .gaikoku-training .content .main article #outline .outlineImg {
          display: none; }
        .gaikoku-training .content .main article #outline p {
          margin: 15px 10px; }
        .gaikoku-training .content .main article #outline .wtBox {
          margin-left: 10px; } }
    .gaikoku-training .content .main article .newsTopContents {
      overflow: hidden;
      *zoom: 1;
      width: 100%;
      max-width: 1200px;
      margin: 0 auto; }
      .gaikoku-training .content .main article .newsTopContents #news {
        width: 45%;
        float: left;
        border-top: 3px solid #000;
        position: relative; }
        .gaikoku-training .content .main article .newsTopContents #news h2 {
          font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
          font-size: 18px;
          font-size: 1.8rem;
          margin: 10px 0;
          color: #333;
          text-align: left; }
        .gaikoku-training .content .main article .newsTopContents #news .sub-link {
          position: absolute;
          right: 5px;
          top: 5px; }
        .gaikoku-training .content .main article .newsTopContents #news ul {
          padding-left: 0;
          height: 170px;
          overflow: auto;
          -webkit-overflow-scrolling: touch;
          border-top: 1px solid #dedede;
          border-bottom: 1px solid #dedede; }
          .gaikoku-training .content .main article .newsTopContents #news ul li {
            padding: 5px 0;
            margin-bottom: 3px;
            border-bottom: 1px dotted #ccc;
            font-size: 12px;
            font-size: 1.2rem; }
            .gaikoku-training .content .main article .newsTopContents #news ul li .date {
              font-size: 10px;
              font-size: 1rem;
              color: #858585; }
            .gaikoku-training .content .main article .newsTopContents #news ul li a {
              display: block;
              text-decoration: none; }
          .gaikoku-training .content .main article .newsTopContents #news ul .icon {
            display: block;
            padding-left: 95px;
            text-decoration: none; }
          .gaikoku-training .content .main article .newsTopContents #news ul .newsToeic {
            background: url("/gengo/assets/img/cla/newsIcon-toeic.png") no-repeat 0 7px; }
          .gaikoku-training .content .main article .newsTopContents #news ul .newsToefl {
            background: url("/gengo/assets/img/cla/newsIcon-toefl.png") no-repeat 0 7px; }
          .gaikoku-training .content .main article .newsTopContents #news ul .newsIelts {
            background: url("/gengo/assets/img/cla/newsIcon-ielts.png") no-repeat 0 7px; }
          .gaikoku-training .content .main article .newsTopContents #news ul .newskaiwa {
            background: url("/gengo/assets/img/cla/newsIcon-kaiwa.png") no-repeat 0 7px; }
          .gaikoku-training .content .main article .newsTopContents #news ul .newsSyosyu {
            background: url("/gengo/assets/img/cla/newsIcon-syosyu.png") no-repeat 0 7px; }
          .gaikoku-training .content .main article .newsTopContents #news ul .newsCommon {
            background: url("/gengo/assets/img/cla/newsIcon-common.png") no-repeat 0 7px; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          .gaikoku-training .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
        @media only screen and (min-width: 481px) and (max-width: 768px) {
          .gaikoku-training .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
      .gaikoku-training .content .main article .newsTopContents #point {
        width: 52%;
        margin: 0 auto 30px;
        position: relative;
        float: right;
        background: #5EC6F8 url("/gengo/assets/img/cla/point-img.png") no-repeat center center;
        z-index: 1; }
        .gaikoku-training .content .main article .newsTopContents #point dl {
          background: #fff;
          opacity: 0.9;
          margin: 20px;
          width: 94%;
          height: 180px;
          overflow: hidden;
          *zoom: 1;
          z-index: 10; }
          .gaikoku-training .content .main article .newsTopContents #point dl dt {
            background: #68C2F7;
            font-size: 18px;
            font-size: 1.8rem;
            text-align: center;
            color: #fff;
            font-weight: bold;
            float: left;
            width: 30%;
            height: 160px;
            opacity: 1;
            margin: 10px;
            padding: 0 20px; }
            .gaikoku-training .content .main article .newsTopContents #point dl dt p {
              vertical-align: middle; }
          .gaikoku-training .content .main article .newsTopContents #point dl dd {
            margin-left: 32%;
            width: 60%;
            height: 170px;
            overflow-y: auto; }
            .gaikoku-training .content .main article .newsTopContents #point dl dd ul {
              margin-top: 10px;
              padding-left: 20px;
              font-size: 13px;
              font-size: 1.3rem; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          .gaikoku-training .content .main article .newsTopContents #point {
            background: none;
            float: none;
            width: 100%; }
            .gaikoku-training .content .main article .newsTopContents #point dl {
              width: 100%;
              height: 100%;
              margin: 0;
              padding: 0; }
              .gaikoku-training .content .main article .newsTopContents #point dl dt {
                float: none;
                padding-top: 0;
                margin-top: 0;
                width: 95%;
                height: auto;
                text-align: center; }
              .gaikoku-training .content .main article .newsTopContents #point dl dd {
                margin: 0;
                width: 95%;
                height: auto; } }
        @media only screen and (min-width: 481px) and (max-width: 768px) {
          .gaikoku-training .content .main article .newsTopContents #point {
            width: 100%;
            max-width: 767px;
            padding: 5px 0; }
            .gaikoku-training .content .main article .newsTopContents #point dl {
              width: 94%;
              margin: 20px;
              height: 180px; } }
        @media only screen and (min-width: 769px) and (max-width: 1024px) {
          .gaikoku-training .content .main article .newsTopContents #point {
            width: 52%;
            max-width: 620px;
            height: 220px; }
            .gaikoku-training .content .main article .newsTopContents #point dl {
              width: 94%;
              margin: 20px;
              height: 180px; }
              .gaikoku-training .content .main article .newsTopContents #point dl dt {
                height: 160px;
                font-size: 14px;
                font-size: 1.4rem; }
              .gaikoku-training .content .main article .newsTopContents #point dl dd {
                height: 170px; } }
      .gaikoku-training .content .main article .newsTopContents #entry {
        width: 50%;
        max-width: 620px;
        margin: 0 auto 30px auto;
        float: right; }
        .gaikoku-training .content .main article .newsTopContents #entry ul {
          list-style: none;
          padding: 0;
          display: flex; }
          .gaikoku-training .content .main article .newsTopContents #entry ul li:first-child {
            margin-right: 20px; }
          .gaikoku-training .content .main article .newsTopContents #entry ul li a {
            display: block; }
            .gaikoku-training .content .main article .newsTopContents #entry ul li a img {
              width: 100%;
              height: auto; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          .gaikoku-training .content .main article .newsTopContents #entry {
            float: none;
            width: 100%; }
            .gaikoku-training .content .main article .newsTopContents #entry ul {
              display: block;
              width: 84%;
              margin: 0 auto; }
              .gaikoku-training .content .main article .newsTopContents #entry ul li:first-child {
                margin-right: 0;
                margin-bottom: 20px; } }
        @media only screen and (min-width: 481px) and (max-width: 768px) {
          .gaikoku-training .content .main article .newsTopContents #entry {
            width: 100%;
            max-width: 767px; }
            .gaikoku-training .content .main article .newsTopContents #entry ul {
              justify-content: center; } }
    .gaikoku-training .content .main article .program-bgContents {
      background: url("/gengo/assets/img/common/bg-grey.png") repeat 0 0;
      padding-bottom: 20px; }
      .gaikoku-training .content .main article .program-bgContents section {
        margin-bottom: 30px; }
    .gaikoku-training .content .main article #entranceRequirementsList .entranceRequirementsListBox {
      background: #fff;
      border-radius: 10px;
      /* CSS3草案 */
      -webkit-border-radius: 10px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 10px;
      /* Firefox用 */
      margin: 10px 20px 0;
      padding: 20px; }
    .gaikoku-training .content .main article #schedule {
      margin: 0 20px 10px; }
      .gaikoku-training .content .main article #schedule .r-tabs {
        position: relative;
        border: 1px solid #dedede;
        background: #fff; }
        .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-nav {
          margin: 0;
          padding: 0;
          background: #dedede; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-tab {
            position: relative;
            display: inline-block;
            margin: 0;
            padding: 0;
            list-style: none;
            text-decoration: none;
            font-size: 14px;
            font-size: 1.4rem;
            font-weight: bold; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-anchor {
            color: #666;
            display: inline-block;
            font-weight: bold;
            padding: 10px 12px;
            text-decoration: none; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
            color: #fff;
            text-shadow: none;
            background: #44d5b3; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-nav .r-tabs-state-disabled {
            opacity: 0.5; }
        .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-panel {
          display: none;
          background: #fff; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-panel .r-tabs-state-active {
            display: block; }
        .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-accordion-title {
          display: none; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-accordion-title .r-tabs-anchor {
            display: block;
            padding: 10px;
            color: #fff;
            font-weight: bold;
            text-decoration: none;
            font-size: 14px; }
        .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
          background-color: #fff;
          color: #00c5ad;
          text-shadow: none; }
        .gaikoku-training .content .main article #schedule .r-tabs .tab-inner {
          width: 94%;
          margin: 0 auto 40px;
          overflow-x: auto;
          white-space: nowrap;
          -webkit-overflow-scrolling: touch; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        .gaikoku-training .content .main article #schedule {
          margin: 10px 0; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-nav {
            display: none; }
          .gaikoku-training .content .main article #schedule .r-tabs .r-tabs-accordion-title {
            display: block;
            border-bottom: 1px solid #fff; } }

#training #container .content .main article #outline {
  background: #b6f9e9 url("/gengo/assets/img/common/bg-wh.png") repeat 0 0; }
#training #container .content .main article .program-bgContents h2 {
  color: #44d5b3;
  font-size: 40px;
  font-size: 4rem;
  font-weight: bold;
  text-align: center;
  background: none; }
  #training #container .content .main article .program-bgContents h2 span {
    display: block;
    font-size: 14px;
    font-size: 1.4rem; }
#training #container .content .main article .program-bgContents #schedule .r-tabs .r-tab-nav {
  background: #44d5b3; }
#training #container .content .main article .program-bgContents #schedule .r-tabs .r-tabs-state-active .r-tabs-anchor {
  background: #44d5b3; }
#training #container .content .main article .program-bgContents #schedule h3 {
  margin: 20px 20px 40px 20px;
  color: #44d5b3;
  font-size: 18px;
  font-size: 1.8rem; }
#training #container .content .main article .program-bgContents #schedule table thead th {
  background: #44d5b3;
  color: #333; }
#training #container .content .main article .program-bgContents #schedule table tbody th {
  background: #d7f4ef; }
#training #container .content .main article .program-bgContents #schedule table tbody td {
  white-space: nowrap; }
@media only screen and (min-width: 0px) and (max-width: 480px) {
  #training #container .content .main article .program-bgContents #schedule .r-tabs-accordion-title .r-tabs-anchor {
    background: #44d5b3; }
  #training #container .content .main article .program-bgContents #schedule .r-tabs-state-active .r-tabs-anchor {
    color: #fff;
    background: #44d5b3; } }
#training #container .content .main article .program-bgContents #message .messageBox {
  border: 3px solid #44d5b3; }

/*seika
///////////////////////////////////////////////////////////////////*/
#seikaIndex #container {
  background: #48bd6f; }
#seikaIndex .topMain {
  max-width: 1200px;
  margin: 0 auto;
  padding-bottom: 30px;
  background: #fff;
  z-index: 1; }
  #seikaIndex .topMain .homeImg {
    width: 100%;
    max-width: 1200px;
    height: auto; }
    @media only screen and (min-width: 0px) and (max-width: 768px) {
      #seikaIndex .topMain .homeImg {
        width: 100%;
        height: auto; } }
    @media only screen and (min-width: 769px) and (max-width: 1024px) {
      #seikaIndex .topMain .homeImg {
        width: 100%;
        height: auto; } }
#seikaIndex .content {
  background: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px; }
  #seikaIndex .content .main article {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; }
    #seikaIndex .content .main article .newsTopContents {
      overflow: hidden;
      *zoom: 1;
      width: 100%;
      max-width: 1110px;
      margin: 0 auto; }
      #seikaIndex .content .main article .newsTopContents #news {
        width: 60%;
        float: left;
        border-top: 3px solid #000;
        position: relative; }
        #seikaIndex .content .main article .newsTopContents #news h2 {
          font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
          font-size: 18px;
          font-size: 1.8rem;
          margin: 10px 0; }
        #seikaIndex .content .main article .newsTopContents #news .sub-link {
          position: absolute;
          right: 5px;
          top: 5px; }
        #seikaIndex .content .main article .newsTopContents #news ul {
          padding-left: 0;
          height: 290px;
          overflow: auto;
          -webkit-overflow-scrolling: touch;
          border-top: 1px solid #dedede;
          border-bottom: 1px solid #dedede; }
          #seikaIndex .content .main article .newsTopContents #news ul li {
            padding: 5px 0;
            margin-bottom: 3px;
            border-bottom: 1px dotted #ccc;
            font-size: 12px;
            font-size: 1.2rem; }
            #seikaIndex .content .main article .newsTopContents #news ul li .date {
              font-size: 10px;
              font-size: 1rem;
              color: #858585; }
            #seikaIndex .content .main article .newsTopContents #news ul li a {
              display: block;
              text-decoration: none; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #seikaIndex .content .main article .newsTopContents #news {
            float: none;
            width: 100%; } }
        @media only screen and (min-width: 481px) and (max-width: 1024px) {
          #seikaIndex .content .main article .newsTopContents #news {
            width: 50%; } }
      #seikaIndex .content .main article .newsTopContents #bannerArea {
        width: 100%;
        max-width: 400px;
        margin: 0 auto 30px;
        position: relative;
        float: right; }
        #seikaIndex .content .main article .newsTopContents #bannerArea .bigBnr {
          margin-bottom: 10px;
          width: 100%;
          height: auto; }
          #seikaIndex .content .main article .newsTopContents #bannerArea .bigBnr a img {
            width: 100%;
            height: auto; }
        #seikaIndex .content .main article .newsTopContents #bannerArea .kamokuBg {
          background: url("/gengo/assets/img/seika-manabi/seika-btn-kamokuBg.png") repeat 0 0;
          min-height: 110px;
          position: relative;
          border-bottom: 5px solid #65acda;
          margin-bottom: 10px; }
          #seikaIndex .content .main article .newsTopContents #bannerArea .kamokuBg ul {
            margin-left: 150px;
            padding-left: 0;
            padding-top: 10px; }
            #seikaIndex .content .main article .newsTopContents #bannerArea .kamokuBg ul li {
              font-size: 12px;
              font-size: 1.2rem;
              list-style: none;
              text-align: left; }
        #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr {
          display: -webkit-flex;
          /*--- safari（PC）用 ---*/
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap; }
          #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
            margin-bottom: 20px; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #seikaIndex .content .main article .newsTopContents #bannerArea {
            width: 100%;
            max-width: 480px;
            float: none;
            text-align: center; }
            #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
              width: 50%;
              height: auto; }
              #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr a img {
                width: 95%;
                height: auto; } }
        @media only screen and (min-width: 481px) and (max-width: 1024px) {
          #seikaIndex .content .main article .newsTopContents #bannerArea {
            width: 48%; }
            #seikaIndex .content .main article .newsTopContents #bannerArea .bigBnr {
              width: 100%; }
              #seikaIndex .content .main article .newsTopContents #bannerArea .bigBnr img {
                width: 100%;
                height: auto; }
            #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr {
              width: 100%; }
              #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr a {
                width: 50%; }
                #seikaIndex .content .main article .newsTopContents #bannerArea .smallBnr a img {
                  width: 95%;
                  height: auto; } }
    #seikaIndex .content .main article #lecContents {
      background: #e1f9e3; }
      #seikaIndex .content .main article #lecContents h2 {
        text-align: center;
        margin-top: -10px; }
      #seikaIndex .content .main article #lecContents ul {
        width: 100%;
        max-width: 1110px;
        margin: 0 auto;
        padding-left: 0;
        position: relative;
        text-align: center; }
        #seikaIndex .content .main article #lecContents ul li {
          position: relative;
          list-style: none;
          display: inline-block;
          width: 45%;
          background: #fff;
          margin: 10px;
          padding: 10px; }
          #seikaIndex .content .main article #lecContents ul li a {
            display: block;
            background: #fff;
            text-decoration: none;
            text-align: center; }
            #seikaIndex .content .main article #lecContents ul li a .contentsImg {
              float: right;
              width: 150px;
              height: auto; }
            #seikaIndex .content .main article #lecContents ul li a .textbox {
              text-align: left;
              margin-right: 150px;
              overflow: hidden;
              *zoom: 1; }
              #seikaIndex .content .main article #lecContents ul li a .textbox h3 {
                color: #48bd6f;
                margin: 0;
                font-size: 16px;
                font-size: 1.6rem; }
              #seikaIndex .content .main article #lecContents ul li a .textbox .desc {
                font-size: 14px;
                font-size: 1.4rem;
                margin: 0;
                color: #333; }
            #seikaIndex .content .main article #lecContents ul li a .btn {
              background: #48bd6f;
              clear: both;
              font-size: 14px;
              font-size: 1.4rem;
              color: #fff;
              display: block;
              margin: 0 0 10px;
              text-align: center; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        #seikaIndex .content .main article #lecContents {
          width: 100%; }
          #seikaIndex .content .main article #lecContents ul {
            text-align: center;
            display: block; }
            #seikaIndex .content .main article #lecContents ul li {
              width: 100%;
              margin: 0 0 20px 0; }
              #seikaIndex .content .main article #lecContents ul li a .contentsImg {
                width: 50%;
                height: 50%; } }
      @media only screen and (min-width: 481px) and (max-width: 768px) {
        #seikaIndex .content .main article #lecContents ul {
          text-align: center; }
          #seikaIndex .content .main article #lecContents ul li {
            width: 45%; }
            #seikaIndex .content .main article #lecContents ul li a .contentsImg {
              float: none; }
            #seikaIndex .content .main article #lecContents ul li a .textbox {
              margin-right: 0; } }

.seikaContents #container {
  background: #48bd6f; }
  .seikaContents #container .content {
    background: #fff;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 30px;
    padding-bottom: 30px; }
    .seikaContents #container .content .topMain {
      background: url("/gengo/assets/img/seika-manabi/seika-program-image.png") no-repeat center center;
      text-align: center;
      color: #fff;
      height: 410px; }
      .seikaContents #container .content .topMain h1 {
        font-size: 48px;
        font-size: 4.8rem;
        padding: 20px; }
      .seikaContents #container .content .topMain p {
        text-align: left;
        font-size: 13px;
        font-size: 1.3rem;
        font-weight: bold;
        margin: 0 50px 20px; }
        .seikaContents #container .content .topMain p strong {
          background: #333; }
      .seikaContents #container .content .topMain .topmainPhoto {
        border: 3px solid #333;
        max-width: 258px;
        height: auto; }
      @media only screen and (min-width: 0px) and (max-width: 768px) {
        .seikaContents #container .content .topMain h1 {
          font-size: 24px;
          font-size: 2.4rem; }
        .seikaContents #container .content .topMain p {
          font-size: 12px;
          font-size: 1.2rem;
          margin: 0 20px 10px; }
        .seikaContents #container .content .topMain .topmainPhoto {
          display: none; } }
    .seikaContents #container .content .main article {
      max-width: 1080px;
      margin: 0 auto 30px; }
      .seikaContents #container .content .main article #about {
        background: #d3f4d7;
        padding: 20px; }
        .seikaContents #container .content .main article #about h2 {
          font-size: 18px;
          font-size: 1.8rem;
          color: #2fba5d;
          font-weight: bold; }
        .seikaContents #container .content .main article #about p {
          font-size: 13px;
          font-size: 1.3rem; }
      .seikaContents #container .content .main article .seikaBox {
        display: -webkit-flex;
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 30px; }
        .seikaContents #container .content .main article .seikaBox .box {
          border: 1px solid #48bd6f;
          width: 45%;
          margin: 0 2%;
          text-align: center;
          padding: 0 10px 10px 10px; }
          .seikaContents #container .content .main article .seikaBox .box h2 {
            font-size: 20px;
            font-size: 2rem;
            font-weight: normal;
            color: #2fba5d;
            margin: 0; }
            .seikaContents #container .content .main article .seikaBox .box h2:after {
              font-family: 'icomoon';
              display: inline-block;
              font-size: 50px;
              font-size: 5rem;
              margin-left: 10px;
              vertical-align: middle; }
        .seikaContents #container .content .main article .seikaBox .boxWide {
          border: 1px solid #48bd6f;
          width: 100%;
          margin: 0 2%;
          text-align: center;
          padding: 10px; }
          .seikaContents #container .content .main article .seikaBox .boxWide h2 {
            font-size: 16px;
            font-size: 1.6rem;
            font-weight: normal; }
            .seikaContents #container .content .main article .seikaBox .boxWide h2:after {
              font-family: 'icomoon';
              display: inline-block;
              font-size: 60px;
              font-size: 6rem;
              margin-left: 5px;
              display: block;
              color: #2fba5d; }
        .seikaContents #container .content .main article .seikaBox #targetGakubu h2:after {
          content: "\e9b2"; }
        .seikaContents #container .content .main article .seikaBox #targetGakubu dl {
          display: -webkit-flex;
          display: flex;
          font-size: 13px;
          font-size: 1.3rem;
          margin: 0 0 10px; }
          .seikaContents #container .content .main article .seikaBox #targetGakubu dl dt {
            border-radius: 5px;
            /* CSS3草案 */
            -webkit-border-radius: 5px;
            /* Safari,Google Chrome用 */
            -moz-border-radius: 5px;
            /* Firefox用 */
            padding: 5px;
            width: 20%; }
          .seikaContents #container .content .main article .seikaBox #targetGakubu dl .kic {
            background: #fff1a5; }
          .seikaContents #container .content .main article .seikaBox #targetGakubu dl .bkc {
            background: #c3e5f4; }
          .seikaContents #container .content .main article .seikaBox #targetGakubu dl .oic {
            background: #f9d2bd; }
          .seikaContents #container .content .main article .seikaBox #targetGakubu dl dd {
            padding: 5px;
            margin-left: 0;
            width: 80%;
            text-align: left; }
        .seikaContents #container .content .main article .seikaBox #timeSchedule h2:after {
          content: "\e953"; }
        .seikaContents #container .content .main article .seikaBox #timeSchedule .campusBtn {
          padding-left: 0;
          font-size: 14px;
          font-size: 1.4rem; }
          .seikaContents #container .content .main article .seikaBox #timeSchedule .campusBtn li {
            list-style: none;
            margin: 5px 0 10px;
            padding: 10px;
            border-radius: 5px;
            /* CSS3草案 */
            -webkit-border-radius: 5px;
            /* Safari,Google Chrome用 */
            -moz-border-radius: 5px;
            /* Firefox用 */ }
            .seikaContents #container .content .main article .seikaBox #timeSchedule .campusBtn li a {
              display: block;
              text-decoration: none; }
          .seikaContents #container .content .main article .seikaBox #timeSchedule .campusBtn .kic {
            background: #fff1a5; }
          .seikaContents #container .content .main article .seikaBox #timeSchedule .campusBtn .bkc {
            background: #c3e5f4; }
          .seikaContents #container .content .main article .seikaBox #timeSchedule .campusBtn .oic {
            background: #f9d2bd; }
        .seikaContents #container .content .main article .seikaBox #qaBox {
          height: 260px;
          overflow-y: auto; }
          .seikaContents #container .content .main article .seikaBox #qaBox h2:after {
            content: "\ea09"; }
        .seikaContents #container .content .main article .seikaBox #staffBosyu h2 {
          background: #fff;
          color: #2fba5d;
          border: 1px solid #2fba5d;
          font-weight: bold;
          font-size: 16px;
          font-size: 1.6rem;
          border-radius: 10px;
          /* CSS3草案 */
          -webkit-border-radius: 10px;
          /* Safari,Google Chrome用 */
          -moz-border-radius: 10px;
          /* Firefox用 */
          margin: 10px 10px 0;
          padding: 10px; }
        .seikaContents #container .content .main article .seikaBox #staffBosyu dl {
          display: -webkit-flex;
          display: flex;
          flex-wrap: wrap;
          margin: 10px 0;
          font-size: 12px;
          font-size: 1.2rem;
          border-bottom: 1px dotted #ccc;
          text-align: left; }
          .seikaContents #container .content .main article .seikaBox #staffBosyu dl dt {
            font-weight: bold;
            width: 50%;
            padding: 7px 10px; }
          .seikaContents #container .content .main article .seikaBox #staffBosyu dl dd {
            width: 40%;
            padding: 7px 5px; }
        .seikaContents #container .content .main article .seikaBox #staffBosyu .bosyuList {
          margin: 10px 10px 30px;
          background: #f6f5f3;
          padding-top: 5px; }
        @media only screen and (min-width: 0px) and (max-width: 768px) {
          .seikaContents #container .content .main article .seikaBox {
            display: block; }
            .seikaContents #container .content .main article .seikaBox .box {
              width: 98%;
              margin: 0 auto 30px; }
            .seikaContents #container .content .main article .seikaBox #staffBosyu dl dt {
              width: 100%; }
            .seikaContents #container .content .main article .seikaBox #staffBosyu dl dd {
              width: 100%;
              margin-left: 0; } }
      .seikaContents #container .content .main article #recruit .inner {
        width: 94%;
        margin: 0 auto 40px; }
        @media only screen and (min-width: 0px) and (max-width: 768px) {
          .seikaContents #container .content .main article #recruit .inner {
            overflow-x: auto;
            white-space: nowrap;
            -webkit-overflow-scrolling: touch; } }
      .seikaContents #container .content .main article #course {
        margin-bottom: 30px; }
        .seikaContents #container .content .main article #course h2 {
          font-size: 16px;
          font-size: 1.6rem; }
        .seikaContents #container .content .main article #course .inner {
          width: 100%;
          margin: 0 auto;
          overflow-x: auto;
          white-space: nowrap;
          -webkit-overflow-scrolling: touch; }
        @media only screen and (min-width: 0px) and (max-width: 768px) {
          .seikaContents #container .content .main article #course .inner {
            width: 94%; } }
      .seikaContents #container .content .main article #guide h2 {
        font-size: 18px;
        font-size: 1.8rem; }
      .seikaContents #container .content .main article #guide h3 {
        background: #48bd6f;
        color: #fff;
        font-size: 14px;
        font-size: 1.4rem;
        padding: 10px; }
      .seikaContents #container .content .main article #guide .guideList {
        margin-bottom: 10px; }
        .seikaContents #container .content .main article #guide .guideList li {
          font-size: 13px;
          font-size: 1.3rem; }
          .seikaContents #container .content .main article #guide .guideList li span {
            border-radius: 5px;
            padding: 5px;
            width: 20%;
            margin-right: 3px; }
          .seikaContents #container .content .main article #guide .guideList li .kic {
            background: #fff1a5; }
          .seikaContents #container .content .main article #guide .guideList li .bkc {
            background: #c3e5f4; }
          .seikaContents #container .content .main article #guide .guideList li .oic {
            background: #f9d2bd; }
          .seikaContents #container .content .main article #guide .guideList li .all {
            background: #222222; }
      .seikaContents #container .content .main article table thead th {
        background: #14A04C;
        color: #fff; }
      .seikaContents #container .content .main article table tbody tr th {
        background: #d3f4d7; }
      .seikaContents #container .content .main article table tbody tr td {
        background: #fff; }
      .seikaContents #container .content .main article table tbody .even td {
        background: #effff1; }

#minor #container .content article .newsTopContents {
  overflow: hidden;
  *zoom: 1;
  width: 100%;
  max-width: 1110px;
  margin: 0 auto;
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap; }
  #minor #container .content article .newsTopContents #news {
    width: 55%;
    border-top: 3px solid #000;
    position: relative;
    margin: 0 3% 30px 0; }
    #minor #container .content article .newsTopContents #news h2 {
      font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
      font-size: 18px;
      font-size: 1.8rem;
      margin: 10px 0; }
    #minor #container .content article .newsTopContents #news .sub-link {
      position: absolute;
      right: 5px;
      top: 5px; }
    #minor #container .content article .newsTopContents #news ul {
      padding-left: 0;
      height: 230px;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      border-top: 1px solid #dedede;
      border-bottom: 1px solid #dedede; }
      #minor #container .content article .newsTopContents #news ul li {
        padding: 5px 0;
        margin-bottom: 3px;
        border-bottom: 1px dotted #ccc;
        font-size: 12px;
        font-size: 1.2rem; }
        #minor #container .content article .newsTopContents #news ul li .date {
          font-size: 10px;
          font-size: 1rem;
          color: #858585; }
        #minor #container .content article .newsTopContents #news ul li a {
          display: block;
          text-decoration: none; }
    @media only screen and (min-width: 0px) and (max-width: 768px) {
      #minor #container .content article .newsTopContents #news {
        width: 98%;
        margin: 0 auto; } }
  #minor #container .content article .newsTopContents #about {
    width: 40%; }
    @media only screen and (min-width: 0px) and (max-width: 768px) {
      #minor #container .content article .newsTopContents #about {
        width: 98%;
        margin: 0 auto; } }
#minor #container .content article .seikaBox {
  margin-bottom: 30px; }

#minor2 #container .content article .newsTopContents {
  overflow: hidden;
  *zoom: 1;
  width: 100%;
  max-width: 1110px;
  margin: 0 auto;
  display: flex;
  display: -webkit-flex; }
  #minor2 #container .content article .newsTopContents #news {
    width: 55%;
    border-top: 3px solid #000;
    position: relative;
    margin: 0 3% 30px 0; }
    #minor2 #container .content article .newsTopContents #news h2 {
      font-family: YuMincho, "游明朝", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
      font-size: 18px;
      font-size: 1.8rem;
      margin: 10px 0; }
    #minor2 #container .content article .newsTopContents #news .sub-link {
      position: absolute;
      right: 5px;
      top: 5px; }
    #minor2 #container .content article .newsTopContents #news ul {
      padding-left: 0;
      height: 230px;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      border-top: 1px solid #dedede;
      border-bottom: 1px solid #dedede; }
      #minor2 #container .content article .newsTopContents #news ul li {
        padding: 5px 0;
        margin-bottom: 3px;
        border-bottom: 1px dotted #ccc;
        font-size: 12px;
        font-size: 1.2rem; }
        #minor2 #container .content article .newsTopContents #news ul li .date {
          font-size: 10px;
          font-size: 1rem;
          color: #858585; }
        #minor2 #container .content article .newsTopContents #news ul li a {
          display: block;
          text-decoration: none; }
    @media only screen and (min-width: 0px) and (max-width: 600px) {
      #minor2 #container .content article .newsTopContents #news {
        width: 100%;
        display: block; } }
    @media only screen and (min-width: 601px) and (max-width: 1024px) {
      #minor2 #container .content article .newsTopContents #news {
        width: 50%; } }
  #minor2 #container .content article .newsTopContents #about {
    width: 40%; }
    @media only screen and (min-width: 0px) and (max-width: 600px) {
      #minor2 #container .content article .newsTopContents #about {
        width: 100%; } }
    @media only screen and (min-width: 601px) and (max-width: 1024px) {
      #minor2 #container .content article .newsTopContents #about {
        width: 100%; } }

.seikaNews .topMain {
  background: #48bd6f;
  margin: 0 auto;
  z-index: 1; }
  .seikaNews .topMain h1 {
    color: #fff;
    font-size: 48px;
    font-size: 4.8rem;
    text-align: center;
    padding: 30px 0;
    margin: 0 0 30px; }
    .seikaNews .topMain h1::before {
      font-family: 'icomoon';
      content: "\e902";
      color: #858585;
      display: inline-block;
      font-size: 40px;
      font-size: 4rem;
      background: #fff;
      border-radius: 50px;
      -webkit-border-radius: 50px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 50px;
      /* Firefox用 */
      white-space: pre;
      width: 70px;
      height: 70px; }
    .seikaNews .topMain h1 span {
      display: block; }
    @media only screen and (min-width: 0px) and (max-width: 780px) {
      .seikaNews .topMain h1 {
        font-size: 28px;
        font-size: 2.8rem; }
        .seikaNews .topMain h1::before {
          font-size: 30px;
          font-size: 3rem;
          width: 50px;
          height: 50px; } }
.seikaNews .content {
  overflow: hidden;
  *zoom: 1;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; }
  .seikaNews .content .main {
    float: right;
    width: 70%; }
    .seikaNews .content .main h3 {
      border-bottom: 2px dotted #ececec;
      clear: both;
      font-size: 16px;
      font-size: 1.6rem;
      font-weight: bold;
      line-height: 1.3;
      margin: 0 0 10px;
      padding: 8px 10px 7px 0; }
    .seikaNews .content .main #month_selector {
      margin: 0 0 25px 0;
      display: -webkit-flex;
      display: flex;
      flex: flex-grow;
      flex-direction: row;
      width: 100%;
      padding-left: 0; }
      .seikaNews .content .main #month_selector li {
        margin-right: 1px;
        -webkit-flex: 1 1 50px;
        /*--- safari（PC）用 ---*/
        flex: 1 1 50px;
        list-style: none outside; }
        .seikaNews .content .main #month_selector li a {
          display: block;
          vertical-align: middle;
          padding: 5px 0;
          text-decoration: none;
          color: #000;
          text-align: center;
          background: #E9E9E9;
          border-bottom: 3px solid #fff; }
          .seikaNews .content .main #month_selector li a:hover {
            border-bottom: 3px solid #900;
            background: none; }
          .seikaNews .content .main #month_selector li a .current {
            background: none repeat scroll 0 0 #990000;
            color: #FFFFFF; }
            .seikaNews .content .main #month_selector li a .current:hover {
              border-bottom: 3px solid #900;
              background: none;
              border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_01 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_01 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_02 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_02 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_03 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_03 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_04 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_04 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_05 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_05 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_06 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_06 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_07 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_07 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_08 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_08 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_09 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_09 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_10 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_10 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_11 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_11 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
      .seikaNews .content .main #month_selector #news_12 a .active {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF; }
      .seikaNews .content .main #month_selector #news_12 a:hover {
        background: none repeat scroll 0 0 #990000;
        color: #FFFFFF;
        border-bottom: 3px solid #990000; }
    .seikaNews .content .main #news_list article {
      clear: both;
      margin-bottom: 20px;
      padding-bottom: 20px;
      border-bottom: 1px dotted #b0ab96; }
      .seikaNews .content .main #news_list article section {
        margin: 0;
        clear: none; }
        .seikaNews .content .main #news_list article section .time {
          margin-bottom: 5px;
          font-size: 10px;
          font-size: 1rem;
          color: #666; }
        .seikaNews .content .main #news_list article section h3 {
          font-size: 16px;
          font-size: 1.6rem; }
        .seikaNews .content .main #news_list article section .desc {
          line-height: 1.6;
          font-size: 12px;
          font-size: 1.2rem; }
        .seikaNews .content .main #news_list article section .read_more {
          margin: 5px 0 0 0;
          position: relative; }
    .seikaNews .content .main #news_article article {
      font-size: 12px;
      font-size: 1.2rem;
      line-height: 1.8; }
  .seikaNews .content #sub {
    float: left;
    width: 20%; }
    .seikaNews .content #sub #local_nav ul {
      border-top: 5px solid #cecece;
      margin: 0 0 30px;
      position: relative;
      padding-left: 0; }
      .seikaNews .content #sub #local_nav ul li {
        border-bottom: 2px solid #ececec;
        font-size: 12px;
        font-size: 1.2rem;
        font-weight: bold;
        list-style: none; }
        .seikaNews .content #sub #local_nav ul li a {
          color: #000;
          display: block;
          padding: 15px 0 13px 2px;
          transition-delay: 0s;
          transition-duration: 0.2s;
          transition-property: background-color, color;
          transition-timing-function: linear;
          text-decoration: none; }
  @media only screen and (min-width: 0px) and (max-width: 600px) {
    .seikaNews .content .main {
      float: none;
      width: 96%;
      margin: 0 2%; }
    .seikaNews .content #sub {
      float: none;
      width: 96%;
      margin: 0 2%; } }

/*online test
///////////////////////////////////////////////////////////////////*/
#online-test #container .content article .text {
  font-size: 14px;
  font-size: 1.4rem;
  margin-bottom: 10px; }
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #online-test #container .content article .text {
      width: 100%;
      padding: 0 10px; } }
  @media only screen and (min-width: 481px) and (max-width: 1024px) {
    #online-test #container .content article .text {
      width: 100%;
      padding: 0 20px; } }
#online-test #container .content article dl.testType {
  font-size: 1.4rem; }
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #online-test #container .content article dl.testType {
      padding: 0 10px; } }
  @media only screen and (min-width: 481px) and (max-width: 1024px) {
    #online-test #container .content article dl.testType {
      padding: 0 20px; } }
  #online-test #container .content article dl.testType dt {
    margin-bottom: 10px; }
  #online-test #container .content article dl.testType dd {
    position: relative;
    margin: 0 0 15px 0; }
    #online-test #container .content article dl.testType dd span {
      display: block;
      padding: 5px 0 0 0;
      margin-left: 40px; }
      #online-test #container .content article dl.testType dd span b {
        display: block;
        margin-bottom: 10px; }
    #online-test #container .content article dl.testType dd::before {
      position: absolute;
      content: 'A';
      padding: 0 10px;
      border-radius: 2px;
      background-color: #EE7785;
      background-repeat: no-repeat;
      background-position: center center;
      font-weight: bold;
      font-size: 1.9rem; }
    #online-test #container .content article dl.testType dd.testB::before {
      content: 'B';
      background-color: #8EC0E4; }
#online-test #container .content article p {
  margin: 0 0 10px; }
#online-test #container .content article ul {
  margin: 0;
  padding: 0; }
#online-test #container .content article #onlineTest .inner {
  margin: 0 auto 0;
  font-size: 1.4rem; }
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #online-test #container .content article #onlineTest .inner {
      width: 100%;
      padding: 0 10px; } }
  @media only screen and (min-width: 481px) and (max-width: 1024px) {
    #online-test #container .content article #onlineTest .inner {
      width: 100%;
      padding: 0 20px; } }
  #online-test #container .content article #onlineTest .inner h3 {
    position: relative;
    padding: 5px 0 5px 10px;
    font-size: 1.6em;
    background: #ececec;
    border-left: solid 2em #EFC147; }
    #online-test #container .content article #onlineTest .inner h3::before {
      content: '';
      position: absolute;
      left: -1.7em;
      top: 15%;
      padding: 0em;
      display: inline-block;
      width: 32px;
      height: 30px;
      background: url("/gengo/assets/img/online/icon_online.png") repeat-x 0 0;
      background-size: cover; }
  #online-test #container .content article #onlineTest .inner .pageLinkArea {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
    padding: 25px 20px 20px;
    border-radius: 2px;
    border: 5px solid #EE7785; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #online-test #container .content article #onlineTest .inner .pageLinkArea {
        padding: 15px 10px 10px; } }
    #online-test #container .content article #onlineTest .inner .pageLinkArea + .partA:before {
      content: 'A';
      background-color: #EE7785; }
    #online-test #container .content article #onlineTest .inner .pageLinkArea + .partB {
      border: 5px solid #8EC0E4; }
      #online-test #container .content article #onlineTest .inner .pageLinkArea + .partB:before {
        content: 'B';
        background-color: #8EC0E4; }
    #online-test #container .content article #onlineTest .inner .pageLinkArea:before {
      position: absolute;
      top: 20px;
      content: 'A';
      padding: 0 10px;
      border-radius: 2px;
      background-color: #EE7785;
      background-repeat: no-repeat;
      background-position: center center;
      font-weight: bold;
      font-size: 1.9rem; }
    #online-test #container .content article #onlineTest .inner .pageLinkArea p.testTitle {
      margin-left: 40px;
      font-size: 1.4rem;
      font-weight: bold; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        #online-test #container .content article #onlineTest .inner .pageLinkArea p.testTitle {
          padding: 10px 0 0; } }
    #online-test #container .content article #onlineTest .inner .pageLinkArea .pageLink {
      margin-top: 20px; }
      #online-test #container .content article #onlineTest .inner .pageLinkArea .pageLink li {
        display: block;
        margin-bottom: 10px;
        list-style: none;
        clear: both;
        font-size: 1.4rem; }
        #online-test #container .content article #onlineTest .inner .pageLinkArea .pageLink li::before {
          content: "\ea43";
          display: inline-block;
          margin-right: 5px;
          font-family: "icomoon"; }
        @media only screen and (min-width: 0px) and (max-width: 480px) {
          #online-test #container .content article #onlineTest .inner .pageLinkArea .pageLink li {
            display: block;
            margin-bottom: 10px; } }
  #online-test #container .content article #onlineTest .inner .precautionsList {
    margin-bottom: 20px;
    list-style: none; }
    #online-test #container .content article #onlineTest .inner .precautionsList li {
      padding-left: 1.5em;
      text-indent: -1.5em; }
  #online-test #container .content article #onlineTest .inner h2 {
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1.3;
    margin: 0 0 5px;
    padding: 8px 10px 7px 0; }
  #online-test #container .content article #onlineTest .inner .textLink ol {
    padding: 0;
    margin: 0 0 5px; }
    #online-test #container .content article #onlineTest .inner .textLink ol::before {
      content: "\ea1c";
      display: inline-block;
      margin-right: 3px;
      color: #99040C;
      font-family: "icomoon"; }
  #online-test #container .content article #onlineTest .inner .aboutTest {
    margin: 20px 0 0; }
    #online-test #container .content article #onlineTest .inner .aboutTest .gakubu {
      margin: 20px 0 0;
      padding-bottom: 10px;
      border-bottom: 1px solid #ccc; }
      #online-test #container .content article #onlineTest .inner .aboutTest .gakubu dt {
        font-weight: bold; }
      #online-test #container .content article #onlineTest .inner .aboutTest .gakubu dd {
        margin: 0;
        padding: 0; }
  #online-test #container .content article #onlineTest .inner .btnArea {
    margin-top: 30px;
    padding: 30px 0;
    text-align: center;
    font-size: 1.6rem;
    font-weight: bold;
    background-color: #ececec; }
    #online-test #container .content article #onlineTest .inner .btnArea input {
      margin-right: 5px; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #online-test #container .content article #onlineTest .inner .btnArea {
        padding: 20px 10px; } }
    #online-test #container .content article #onlineTest .inner .btnArea .gotest input {
      border: none;
      height: auto;
      margin: 10px 0 0 0;
      padding: 20px 50px;
      font-size: 16px;
      text-align: center;
      background: #99040C;
      color: #fff;
      outline: none;
      border-radius: 0; }
      #online-test #container .content article #onlineTest .inner .btnArea .gotest input:disabled {
        background-color: #ccc;
        color: #a0a0a0; }
      @media only screen and (min-width: 0px) and (max-width: 480px) {
        #online-test #container .content article #onlineTest .inner .btnArea .gotest input {
          width: 100%;
          height: 70px; } }
  #online-test #container .content article #onlineTest .inner .btnBack {
    width: 150px;
    margin: 20px 0 0;
    text-align: center;
    background-color: #999; }
    #online-test #container .content article #onlineTest .inner .btnBack a {
      display: block;
      padding: 10px;
      font-size: 1.4rem;
      color: #fff;
      text-decoration: none; }
      #online-test #container .content article #onlineTest .inner .btnBack a:hover {
        background-color: #7e7e7e; }
    @media only screen and (min-width: 0px) and (max-width: 480px) {
      #online-test #container .content article #onlineTest .inner .btnBack {
        margin-top: 30px; } }

.classblock{
  display: inline-block;/*inline-blockにします*/
  width: 150px;/*ボタン内の幅*/
  border-radius: 10px;
  border: 1px solid #0066c0;
  margin-right: 20px;
  margin-bottom: 20px;
  padding: 10px 0;/*余白*/
  vertical-align: middle;/*縦の表示位置*/
  background: white;/*背景を白色に*/
  font-weight: bold;/*文字を太字に*/
  color:skyblue; /*文字色を白に*/
} /*事務局作成*/

.toeicsupportblock1 {
    position: relative;
    padding: 5px 0 5px 10px;
    font-size: 1.2em;
    background: #ececec;
    border-left: solid 2em #EFC147; }/*事務局作成*/

.toeicsupportblock2 {
    position: relative;
    padding: 5px 0 5px 10px;
    font-size: 1.2em;
    background: #ececec;
    border-left: solid 2em #EFC147; }/*事務局作成*/

.toeicsupportblock3 {
    position: relative;
    padding: 5px 0 5px 10px;
    font-size: 1.2em;
    background: #ececec;
    border-left: solid 2em #EFC147; }/*事務局作成*/

#sup #container .content .topMain2 {
  margin: 0 auto;
  z-index: 1;
  background: url("/gengo/assets/img/mougyu_topMain_bg.jpg") no-repeat center center;
  background-size: cover; }/*事務局作成猛牛ちゃんねる*/
  #dantai #container .content article #howto .howtoBox2 {
    margin-bottom: 20px;
    width: 45%;
    margin: 0 2%;
    height: auto;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #FFFACD;
    border: 2px solid #FF4500;
    border-radius: 15px;
    padding: 20px; }/*事務局作成猛牛ちゃんねる*/
    #dantai #container .content article #howto .howtoBox2 h3 {
      font-size: 16px;
      font-size: 1.6rem;
      color: #333;
      margin: 0; }/*事務局作成猛牛ちゃんねる*/
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #dantai #container .content article #howto {
      display: block; }
      #dantai #container .content article #howto .howtoBox2 {
        width: 100%;
        margin: 0 0 20px; } }/*事務局作成猛牛ちゃんねる*/
  #dantai #container .content article #howto .howtoBox3 {
    margin-bottom: 20px;
    width: 45%;
    margin: 0 2%;
    height: auto;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #ffd6ea;
    border: 2px solid #FF4500;
    border-radius: 15px;
    padding: 20px; }/*事務局作成猛牛ちゃんねる*/
    #dantai #container .content article #howto .howtoBox3 h3 {
      font-size: 16px;
      font-size: 1.6rem;
      color: #333;
      margin: 0; }/*事務局作成猛牛ちゃんねる*/
  @media only screen and (min-width: 0px) and (max-width: 480px) {
    #dantai #container .content article #howto {
      display: block; }
      #dantai #container .content article #howto .howtoBox3 {
        width: 100%;
        margin: 0 0 20px; } }/*事務局作成猛牛ちゃんねる*/
/*↓↓事務局作成TOEFLタブ↓↓*/
#online-test #container .content article #onlineTest .tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0;
}
#online-test #container .content article #onlineTest .tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: DeepSkyBlue;
  display: block;
  order: -1;
}
#online-test #container .content article #onlineTest .tab-label {
  color: White;
  background: LightGray;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}
#online-test #container .content article #onlineTest .tab-label:not(:last-of-type) {
  margin-right: 5px;
}
#online-test #container .content article #onlineTest .tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
#online-test #container .content article #onlineTest .tab-switch:checked+.tab-label {
  background: DeepSkyBlue;
}
#online-test #container .content article #onlineTest .tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 15px;
  opacity: 1;
  transition: .5s opacity;
  box-shadow: 0 0 3px rgba(0,0,0,.2);
}
/* ラジオボタン非表示 */
#online-test #container .content article #onlineTest .tab-switch {
  display: none;
}
/*↑↑事務局作成TOEFLタブ↑↑*/