@charset "UTF-8";
/* --------------------

common

-------------------- */

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 16px;
  font-size: 1.6em;
  font-family: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro",
    "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", sans-serif;
  font-weight: 500;
}

.mincho {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",
    "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
p {
  line-height: 1.5;
}
p {
  line-height: 2;
}
.w10p {
  width: 10%;
}
.w15p {
  width: 15%;
}
.w20p {
  width: 20%;
}
.w25p {
  width: 25%;
}
.w30p {
  width: 30%;
}
.w33p {
  width: 33.3333%;
}
.w35p {
  width: 35%;
}
.w40p {
  width: 40%;
}
.w45p {
  width: 45%;
}
.w50p {
  width: 50%;
}
.w55p {
  width: 55%;
}
.w60p {
  width: 60%;
}
.w65p {
  width: 65%;
}
.w70p {
  width: 70%;
}
.w75p {
  width: 75%;
}
.w80p {
  width: 80%;
}
.w85p {
  width: 85%;
}
.w90p {
  width: 90%;
}
.w95p {
  width: 95%;
}
.w100p {
  width: 100%;
}

.fbld {
  font-weight: 600;
}
.fnml {
  font-weight: 500;
}

.bg_siro {
  background: #fff;
}
.bg_kuro {
  background: #000;
}
.bg_red {
  background: #cb0e0d;
}

.col_siro {
  color: #fff;
}
.col_kuro {
  color: #000;
}
.col_red {
  color: #da4d43;
}

.bdrB_red {
  border-bottom: #cb0e0d 2px dotted;
}

.txtCnt {
  text-align: center;
}
.txtLft {
  text-align: left;
}
.txtRig {
  text-align: right;
}

.left {
  float: left;
}
.right {
  float: right;
}

.fz12 {
  font-size: 12px;
  font-size: 1.2rem;
}
.fz14 {
  font-size: 14px;
  font-size: 1.4rem;
}
.fz16 {
  font-size: 16px;
  font-size: 1.6rem;
}
.fz18 {
  font-size: 18px;
  font-size: 1.8rem;
}
.fz20 {
  font-size: 20px;
  font-size: 2rem;
}
.fz22 {
  font-size: 22px;
  font-size: 2.2rem;
}
.fz24 {
  font-size: 24px;
  font-size: 2.4rem;
}
.fz26 {
  font-size: 26px;
  font-size: 2.6rem;
}
.fz28 {
  font-size: 28px;
  font-size: 2.8rem;
}
.fz30 {
  font-size: 30px;
  font-size: 3rem;
}
.fz40 {
  font-size: 40px;
  font-size: 4rem;
}
.fz100 {
  font-size: 100px;
  font-size: 10rem;
}

.light10 {
  line-height: 1;
}
.light11 {
  line-height: 1.1;
}
.light12 {
  line-height: 1.2;
}
.light13 {
  line-height: 1.3;
}
.light14 {
  line-height: 1.4;
}
.light15 {
  line-height: 1.5;
}
.light16 {
  line-height: 1.6;
}
.light17 {
  line-height: 1.7;
}
.light18 {
  line-height: 1.8;
}
.light19 {
  line-height: 1.9;
}
.light20 {
  line-height: 2;
}
.light21 {
  line-height: 2.1;
}
.light22 {
  line-height: 2.2;
}
.light23 {
  line-height: 2.3;
}
.light24 {
  line-height: 2.4;
}
.light25 {
  line-height: 2.5;
}
.light30 {
  line-height: 3;
}

.mt5 {
  margin-top: 5px;
}
.mt10 {
  margin-top: 10px;
}
.mt15 {
  margin-top: 15px;
}
.mt20 {
  margin-top: 20px;
}
.mt25 {
  margin-top: 25px;
}
.mt30 {
  margin-top: 30px;
}
.mt35 {
  margin-top: 35px;
}
.mt40 {
  margin-top: 40px;
}
.mt45 {
  margin-top: 45px;
}
.mt50 {
  margin-top: 50px;
}
.mt55 {
  margin-top: 55px;
}
.mt60 {
  margin-top: 60px;
}
.mt65 {
  margin-top: 65px;
}
.mt70 {
  margin-top: 70px;
}
.mt75 {
  margin-top: 75px;
}
.mt80 {
  margin-top: 80px;
}
.mt85 {
  margin-top: 85px;
}
.mt90 {
  margin-top: 90px;
}
.mt95 {
  margin-top: 95px;
}
.mt100 {
  margin-top: 100px;
}
.mt150 {
  margin-top: 150px;
}

.mb5 {
  margin-bottom: 5px;
}
.mb10 {
  margin-bottom: 10px;
}
.mb15 {
  margin-bottom: 15px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb25 {
  margin-bottom: 25px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb35 {
  margin-bottom: 35px;
}
.mb40 {
  margin-bottom: 40px;
}
.mb45 {
  margin-bottom: 45px;
}
.mb50 {
  margin-bottom: 50px;
}
.mb55 {
  margin-bottom: 55px;
}
.mb60 {
  margin-bottom: 60px;
}
.mb65 {
  margin-bottom: 65px;
}
.mb70 {
  margin-bottom: 70px;
}
.mb75 {
  margin-bottom: 75px;
}
.mb80 {
  margin-bottom: 80px;
}
.mb85 {
  margin-bottom: 85px;
}
.mb90 {
  margin-bottom: 90px;
}
.mb95 {
  margin-bottom: 95px;
}
.mb100 {
  margin-bottom: 100px;
}

.ml-50 {
  margin-left: -50px;
}
.ml10 {
  margin-left: 10px;
}
.ml15 {
  margin-left: 15px;
}
.ml20 {
  margin-left: 20px;
}
.ml25 {
  margin-left: 25px;
}
.ml30 {
  margin-left: 30px;
}
.ml35 {
  margin-left: 35px;
}
.ml40 {
  margin-left: 40px;
}
.ml45 {
  margin-left: 45px;
}
.ml50 {
  margin-left: 50px;
}
.ml55 {
  margin-left: 55px;
}
.ml60 {
  margin-left: 60px;
}
.ml65 {
  margin-left: 65px;
}
.ml70 {
  margin-left: 70px;
}
.ml75 {
  margin-left: 75px;
}
.ml80 {
  margin-left: 80px;
}
.ml85 {
  margin-left: 85px;
}
.ml90 {
  margin-left: 90px;
}
.ml95 {
  margin-left: 95px;
}
.ml100 {
  margin-left: 100px;
}

.mr-50 {
  margin-right: -50px;
}
.mr10 {
  margin-right: 10px;
}
.mr15 {
  margin-right: 15px;
}
.mr20 {
  margin-right: 20px;
}
.mr25 {
  margin-right: 25px;
}
.mr30 {
  margin-right: 30px;
}
.mr35 {
  margin-right: 35px;
}
.mr40 {
  margin-right: 40px;
}
.mr45 {
  margin-right: 45px;
}
.mr50 {
  margin-right: 50px;
}
.mr55 {
  margin-right: 55px;
}
.mr60 {
  margin-right: 60px;
}
.mr65 {
  margin-right: 65px;
}
.mr70 {
  margin-right: 70px;
}
.mr75 {
  margin-right: 75px;
}
.mr80 {
  margin-right: 80px;
}
.mr85 {
  margin-right: 85px;
}
.mr90 {
  margin-right: 90px;
}
.mr95 {
  margin-right: 95px;
}
.mr100 {
  margin-right: 100px;
}

.pt10 {
  padding-top: 10px;
}
.pt15 {
  padding-top: 15px;
}
.pt12 {
  padding-top: 12px;
}
.pt13 {
  padding-top: 13px;
}
.pt20 {
  padding-top: 20px;
}
.pt25 {
  padding-top: 25px;
}
.pt28 {
  padding-top: 28px;
}
.pt30 {
  padding-top: 30px;
}
.pt35 {
  padding-top: 35px;
}
.pt40 {
  padding-top: 40px;
}
.pt45 {
  padding-top: 45px;
}
.pt50 {
  padding-top: 50px;
}
.pt55 {
  padding-top: 55px;
}
.pt60 {
  padding-top: 60px;
}
.pt65 {
  padding-top: 65px;
}
.pt70 {
  padding-top: 70px;
}
.pt75 {
  padding-top: 75px;
}
.pt80 {
  padding-top: 80px;
}
.pt85 {
  padding-top: 85px;
}
.pt90 {
  padding-top: 90px;
}
.pt95 {
  padding-top: 95px;
}
.pt100 {
  padding-top: 100px;
}
.pt120 {
  padding-top: 120px;
}
.pt150 {
  padding-top: 150px;
}

.pb5 {
  padding-bottom: 5px;
}
.pb10 {
  padding-bottom: 10px;
}
.pb15 {
  padding-bottom: 15px;
}
.pb20 {
  padding-bottom: 20px;
}
.pb25 {
  padding-bottom: 25px;
}
.pb30 {
  padding-bottom: 30px;
}
.pb35 {
  padding-bottom: 35px;
}
.pb40 {
  padding-bottom: 40px;
}
.pb45 {
  padding-bottom: 45px;
}
.pb50 {
  padding-bottom: 50px;
}
.pb55 {
  padding-bottom: 55px;
}
.pb60 {
  padding-bottom: 60px;
}
.pb65 {
  padding-bottom: 65px;
}
.pb70 {
  padding-bottom: 70px;
}
.pb75 {
  padding-bottom: 75px;
}
.pb80 {
  padding-bottom: 80px;
}
.pb85 {
  padding-bottom: 85px;
}
.pb90 {
  padding-bottom: 90px;
}
.pb95 {
  padding-bottom: 95px;
}
.pb100 {
  padding-bottom: 100px;
}
.pb120 {
  padding-bottom: 120px;
}
.pb150 {
  padding-bottom: 150px;
}
.pb200 {
  padding-bottom: 200px;
}

.pl10 {
  padding-left: 10px;
}
.pl15 {
  padding-left: 15px;
}
.pl20 {
  padding-left: 20px;
}
.pl25 {
  padding-left: 25px;
}
.pl30 {
  padding-left: 30px;
}
.pl35 {
  padding-left: 35px;
}
.pl40 {
  padding-left: 40px;
}
.pl45 {
  padding-left: 45px;
}
.pl50 {
  padding-left: 50px;
}
.pl55 {
  padding-left: 55px;
}
.pl60 {
  padding-left: 60px;
}
.pl65 {
  padding-left: 65px;
}
.pl70 {
  padding-left: 70px;
}
.pl75 {
  padding-left: 75px;
}
.pl80 {
  padding-left: 80px;
}
.pl85 {
  padding-left: 85px;
}
.pl90 {
  padding-left: 90px;
}
.pl95 {
  padding-left: 95px;
}
.pl100 {
  padding-left: 100px;
}

.pr10 {
  padding-right: 10px;
}
.pr15 {
  padding-right: 15px;
}
.pr20 {
  padding-right: 20px;
}
.pr25 {
  padding-right: 25px;
}
.pr30 {
  padding-right: 30px;
}
.pr35 {
  padding-right: 35px;
}
.pr40 {
  padding-right: 40px;
}
.pr45 {
  padding-right: 45px;
}
.pr50 {
  padding-right: 50px;
}
.pr55 {
  padding-right: 55px;
}
.pr60 {
  padding-right: 60px;
}
.pr65 {
  padding-right: 65px;
}
.pr70 {
  padding-right: 70px;
}
.pr75 {
  padding-right: 75px;
}
.pr80 {
  padding-right: 80px;
}
.pr85 {
  padding-right: 85px;
}
.pr90 {
  padding-right: 90px;
}
.pr95 {
  padding-right: 95px;
}
.pr100 {
  padding-right: 100px;
}

.trandition {
  transition-duration: 0.6s;
  -webkit-transition-duration: 0.6s;
  -moz-transition-duration: 0.6s;
  -ms-transition-duration: 0.6s;
  -s-transition-duration: 0.6s;
}

/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

li {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500;
  font-size: 1em;
}

.cf:after {
  content: " ";
  display: block;
  clear: both;
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers (opinionated).
 */

body {
  margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */

article,
aside,
footer,
header,
nav,
section {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  margin: 0.67em 0;
}
#headder h1 {
  margin: 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */

figcaption,
figure,
main {
  /* 1 */
  display: block;
}

/**
 * Add the correct margin in IE 8.
 */

figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */

a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}

/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
  font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */

mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

audio,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */

details, /* 1 */
menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Scripting
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */

template {
  display: none;
}

/* Hidden
   ========================================================================== */

/**
 * Add the correct display in IE 10-.
 */

[hidden] {
  display: none;
}

body {
  background-color: #fff;
  color: #595757;
}

.spNone {
  display: block;
}
.pcNone {
  display: none;
}

.imgWrap img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}
.imgWrap img {
  margin: 30px auto;
}
.imgWrap a {
  display: block;
  width: 100%;
  height: 100%;
}
.wrap {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
}

#landingPage {
  margin: 0;
  padding: 0;
}

.gridBox {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.gridBox .imgWrap a {
  display: inline;
}
.gridBox.noflexWrap {
  flex-wrap: nowrap;
}
.gridBox.alignItemsCenter {
  align-items: center;
}
.gridBox.flexStart {
  justify-content: flex-start;
}

.gridBox.col_2 .gridItem {
  width: 48.5%;
  padding: 0;
}
.gridBox.col_3 .gridItem {
  width: 32%;
}
.gridBox.col_4 .gridItem {
  width: 23.5%;
}

.linkBox a {
  font-family: HiraKakuPro-W3, Hiragino Kaku Gothic Pro;
  position: relative;
  padding: 10px 24px;
  background-color: #e50012;
  color: #fff;
  width: 100%;
  max-width: 233px;
  min-height: 45px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  display: inline-block;
  margin: 0 auto;
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
a:link {
  text-decoration: none;
}

.linkBox a svg {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.linkBox a:hover {
  background-color: #f4f4f4;
  color: #666;
}

.linkBox.iconRight a svg {
  right: 10px;
}

.bkImage {
  position: relative;
}

.trim {
  overflow: hidden;
  position: relative;
}

.trim.tH100 {
  height: 100px; /* トリミングしたい枠の高さ */
}
.trim.tH150 {
  height: 150px;
}
.trim.tH200 {
  height: 200px;
}
.trim.tH300 {
  height: 300px;
}

.trim img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 200%;
  height: auto;
}

.fblod {
  font-weight: bold;
}
.mt10 {
  margin-top: 10px !important;
}
.mt20 {
  margin-top: 20px !important;
}

.list {
  list-style: none;
}

.sectionArea h2,
.sectionArea h3 {
  color: #009b45;
  margin-bottom: 30px;
}
.sectionArea h2 {
  font-size: 32px;
  font-weight: bold;
  line-height: 42px;
}
.sectionArea h2:before {
  margin-right: 15px;
}
.sectionArea h2.mgr0:before {
  margin-right: 0;
}
.sectionArea h3 {
  font-size: 30px;
  font-weight: bold;
  line-height: 42px;
  text-align: center;
}
.sectionArea p.bold-underline {
  font-size: 32px;
  text-align: center;
  font-weight: bold;
  line-height: 42px;
  text-decoration: underline;
  margin-bottom: 20px;
}
/* .presentBox:before,
.leaf:before,
.sectionArea h2:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
} */
/* .leaf:before,
.sectionArea h2:before {
  background: no-repeat url(../images/icon/leaf.png);
  background-size: contain;
  width: 36px;
  height: 31px;
} */
.presentBox:before {
  background: no-repeat url(../images/icon/present.png);
  background-size: contain;
  width: 21px;
  height: 27px;
}

.letterSp-3 {
  letter-spacing: -3px;
}

.bkOrange {
  background-color: #f4a76d;
}

.contactBotton {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

.contactBotton img {
  margin: 0 auto;
}

/* --------------------------

 サムネイルフェードイン

-------------------------- */
.fade-in {
  transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
}

/* --------------------

 header

-------------------- */
#header {
  position: fixed;
  margin: 0 auto;
  height: 80px;
  z-index: 100;
  width: 100%;
  background-color: #fff;
}
#headerInnerWrap {
  position: relative;
  height: 80px;
}
#headerInnerWrap #headerLogo {
  display: flex;
  align-items: center;
  max-width: 333px;
  width: 34%;
}
#headerInnerWrap #headerLogo a {
  display: flex;
  align-items: center;
  max-width: 333px;
  width: 100%;
  height: auto;
}

#headerInnerWrap #pageTitle {
  position: absolute;
  top: -115px;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 230px;
  height: 230px;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  text-align: center;
  background-color: #cf5555;
  border-radius: 100%;
  color: #fff;
  z-index: 2;
}
#headerInnerWrap #pageTitle h1 {
  font-size: 20px;
  font-weight: 600;
  padding: 0 0 13%;
  margin: 0;
  line-height: 34px;
}
#headerInnerWrap #pageTitle h1 span {
  display: inline-flex;
  font-size: 30px;
}

#headerContact {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#headerContact .imgWrap {
  margin: 0 10px;
}

/* --------------------

 #mainVisual

-------------------- */

#mainVisual {
  position: relative;
  padding: 11% 0 2%;
  height: 100%;
  background-size: cover;
  text-align: center;
  position: relative;
  overflow: hidden;
  background: url(../img/training/mainvisual.jpg) no-repeat;
  background-size: cover;
}

#mainVisualInner {
  width: 100%;
  padding: 40px 0 0;
}


#mainVisual video {
  position: absolute;
  top: 80px;
  left: 0;
  margin: 0 auto;
  width: 100%;
  opacity: 0.65;
  z-index: 1;
}
#mainVisual video {
  top: 0px;
}
#mainVisual{
  padding-top: 2%;
}
#titleWrap {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 4%;
  z-index: 2;
}

#contactMain {
  position: relative;
  max-width: 350px;
  width: 100%;
  padding: 0;
  margin: 0 auto;
  z-index: 2;
}

#scrollDown {
  position: relative;
  z-index: 2;
  padding: 3% 44% 0;
}
#scrollDown a {
  position: relative;
  display: block;
  z-index: 2;
}

h4{
  font-size: 25px;
  text-decoration: underline;
  margin-bottom: 20px;
}
h5{
  font-size: 22px;
  margin: 20px 0 15px 0;
}


/* --------------------

 #sect1

-------------------- */

#sect1 {
  padding-top: 100px;
}

#sect1 h2 {
  font-size: 36px;
  line-height: 42px;
  color: #595757;
  text-align: center;
  margin-top: 16px;
}
#sect1 h2 {
  font-size: 35px;
  line-height: 50px;
  width: 80%;
  margin: 0 auto;
}
#sect1 p {
  /* width: 50%; */
  margin: 30px auto;
  text-align: center;
  font-size: 20px;
}
#sect1 h2:before {
  content: none;
}

#sect1 #contensNavArea {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#sect1 #contensNavArea .pageLink {
  margin-top: 50px;
  border-radius: 5px;
}
#sect1 #contensNavArea .pageLink a {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  width: 232px;
  height: 50px;
  padding: 0 15px;
  font-size: 18px;
  color: #fff;
}

.merit {
  background-color: #e67f7d;
}
.message {
  background-color: #ed9bba;
}
.acquisition {
  background-color: #edbe56;
}
.moreDetail {
  background-color: #6dc1c6;
}

/* --------------------

 #sect2

-------------------- */

#sect2 {
  margin-top: 160px;
}
#sect2 > .gridBox {
  margin-bottom: 20px;
}

#sect2 .gridItem {
  position: relative;
  text-align: center;
  margin: 0 auto;
  width: 80%;
  margin: 0 auto 50px auto;
}
#sect2 .gridItem.imgWrap {
  text-align: center;
}
#sect2 .gridItem.spOrder2 {
  margin-top: 10px;
}

#sect2 .gridItem.spOrder2 h2:nth-of-type(2) {
  margin-top: 30px;
}

.logoBox {
  position: absolute;
  bottom: 0;
  border: 3px solid #ccc;
  border-radius: 10px;
  padding: 10px 5px;
  flex-wrap: nowrap;
  align-items: center;
  margin: 0;
}
.logoBox .imgWrap {
  min-width: 68px;
  width: 68px;
}
.logoBox p {
  /* max-width: 400px; */
  font-size: 14px;
  line-height: 1.3;
  margin-left: 0.5em;
  padding: 10px;
}

#sect2 .contactBotton {
  margin: 70px auto 0;
}
#sect2 .logoBox {
  position: relative;
  width: 60%;
  margin: 10px auto;
  text-align: left;
}
#sect2 .logoBox img{
  margin:2%;
  width: 18%;
}
#sect2 .logoBox p{
  width: 80%;
}
/* --------------------

 #sect3

-------------------- */

#sect3 {
  margin-top: 70px;
  padding: 70px 0 42px;
  text-align: center;
}
#sect3 .gridBox {
  flex-wrap: nowrap;
}
#sect3 .gridBox {
  flex-wrap: nowrap;
  /* display: block; */
  display: flex;
  margin-bottom: 60px;
}
#sect3 h2 {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-width: 500px;
  width: 100%;
  /* padding: 5%; */
  line-height: 40px;
  color: #666;
  background-color: #fff;
  border-radius: 53px;
  text-align: center;
  margin: 0 auto 60px;
}
#sect3 h2:before {
  content: none;
}

#sect3 .gridBox .gridItem {
  width: 33%;
  padding: 0 1%;
}

#sect3 h3 {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-width: 500px;
  width: 100%;
  /*padding: 5%;*/
  line-height: 40px;
  color: #666;
  background-color: #fff;
  border-radius: 53px;
  text-align: center;
  margin: 0 auto 20px;
}
#sect3 ul.gridBox{
  display: block;
}
#sect3 ul.gridBox li{
  padding: 1%;
  width: 40%;
  margin: 1% auto;
  background-color:white;
}
#sect3 .gridBox .gridItem {
  width: 33%;
  padding: 0 1%;
  align-self: flex-end;
}
#sect3 .gridBox .gridItem p{
  font-size: 26px;
  font-weight: 900;
  line-height: 1.5;
}
#sect3 .imgWrap img{
  margin: 20px auto;
}
/* --------------------

 #sect4

-------------------- */

#sect4 .gridBox {
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
}

#sect4 h2 {
  max-width: 830px;
  margin: 111px auto 30px;
}
#sect4 h2:before {
  content: none;
}

#sect4 .meritArea {
  border: dashed 4px #ccc;
  max-width: 910px;
  padding: 10px 15px;
  margin: 25px auto;
}

#sect4 .meritArea ul {
  max-width: 670px;
  display: grid;
  margin-left: 20px;
}

#sect4 .meritArea ul h3 {
  color: #f39800;
  font-size: 32px;
  font-weight: 600;
  line-height: 36px;
  margin-bottom: 16px;
}

#sect4 .meritArea ul li {
  font-size: 14px;
  line-height: 1.5;
  margin: 0 0 14px;
}
#sect4 .meritArea ul li.leaf:before {
  width: 25px;
  height: 21px;
  margin-right: 5px;
}

#sect4 .meritArea .imgWrap {
  max-width: 180px;
}

#sect4 .contactBotton {
  margin: 50px auto 0;
}
#sect4 h3{
  text-align: left;
}
/* --------------------

 #sect5

-------------------- */

#sect5 {
  margin: 100px auto 0;
  padding: 50px 0 70px;
  width: 100%;
  background: url(../images/sect5/background-image.jpg) center top no-repeat;
  background-size: cover;
}

#sect5 .wrap {
  max-width: 680px;
  margin: 0 auto;
  background-color: #fff;
  padding: 21px 22px;
}

#sect5 .wrap .gridBox.boderBox {
  flex-wrap: nowrap;
  align-items: center;
  max-width: 640px;
  padding: 21px 18px;
  margin: 0 auto;
  border: #43b257 dashed 4px;
}

#sect5 h2 {
  color: #f39906;
  font-size: 36px;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 18px;
  text-align: center;
}
#sect5 h2:before {
  content: none;
}

#sect5 .gridBox .gridItem.profileArea {
  max-width: 170px;
  line-height: 18px;
  text-align: center;
}
#sect5 .gridBox .gridItem.profileArea .imgWrap {
  margin: 10px 15px 10px 0;
}

#sect5 .gridBox .gridItem.profileArea h3 {
  font-size: 16px;
  color: #666;
}
#sect5 .gridBox .gridItem.profileArea p {
  font-size: 12px;
  color: #43b257;
}

#sect5 .gridBox .gridItem.descriptionArea {
  max-width: 414px;
}

#sect5 .gridBox .gridItem.descriptionArea p {
  font-size: 18px;
  line-height: 24px;
  color: #666;
  margin: 0 0 10px;
}

#sect5 .gridBox.chilled {
  flex-wrap: nowrap;
  align-items: center;
}

/* --------------------

 #sect6

-------------------- */

#sect6 h2 {
  max-width: 830px;
  margin: 96px auto 50px;
}
#sect6 h2:before {
  content: none;
}

.youtubeWrap {
  text-align: center;
  margin: 0 auto;
}
.youtubeWrap iframe {
  width: 100%;
  max-width: 755px;
  height: 425px;
}

/* --------------------

 #sect7

-------------------- */

#sect7 {
  margin: 70px auto 50px;
  padding: 66px 0 42px;
  text-align: center;
}

#sect7 h2 {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-width: 616px;
  padding: 0 3.1%;
  width: 100%;
  height: 76px;
  font-weight: 600;
  line-height: 24px;
  background-color: #fff;
  border-radius: 38px;
  text-align: center;
  margin: 0 auto 30px;
}
#sect7 h2:before {
  content: none;
}
#sect7 .gridBox {
  max-width: 910px;
  padding: 2.2% 3.1% 1.6% 3.2%;
  border-radius: 50px;
  background-color: #fff;
}

#sect7 .gridBox .gridItem p {
  font-size: 18px;
  line-height: 26px;
  margin-top: 10px;
}

#sect7 .gridBox .gridItem.leftItem {
  max-width: 377px;
}
#sect7 .gridBox .gridItem.rightItem {
  max-width: 402px;
}
#sect7 .gridBox .gridItem.rightItem h3 {
  font-size: 24px;
  line-height: 26px;
  margin-bottom: 16px;
  font-weight: 600;
  color: #666;
}

/* --------------------

 #sect8

-------------------- */

#sect8 {
  margin: 100px auto 0;
  padding: 50px 0 0;
  text-align: center;
}

#sect8 h4{
  margin-top:55px ;
}

#sect8 table {
  max-width: 910px;
  margin: 0 auto;
  border-collapse: collapse;
}

#sect8 table caption {
  margin-bottom: 20px;
}
#sect8 table tr {
  height: 56.5px;
}
#sect8 table tr {
  height: auto;
}
#sect8 table th,
#sect8 table td {
  border: solid 2px #f39906;
  font-size: 16px;
  line-height: 20px;
}
#sect8 table th {
  background: #fff9ef;
  color: #666;
  line-height: 24px;
}
#sect8 table th {
  line-height: 44px;
}
#sect8 table th .course-name{
  font-weight: 900;
  font-size: 18px;
}
#sect8 table tbody td {
  line-height: 20px;
  padding: 10px;
}
#sect8 table tbody td li {
  text-align: left;
}

#sect8 table tbody tr th {
  width: 205px;
}
/* #sect8 table tbody tr td {
  width: 352px;
} */
#sect8 table tbody tr td {
  width: auto;
}
#sect8 table .spNone {
  display: table-cell;
}

#sect8 table tbody tr:last-of-type,
#sect8 table tbody tr:nth-last-of-type(2) {
  height: 95px;
}
#sect8 table tbody tr:last-of-type,
#sect8 table tbody tr:nth-last-of-type(2) {
  height: auto;
}
#sect8 table {
  max-width: 910px;
  margin: 10px auto 25px auto;
}
#sect8 table {
  width: 800px;
  max-width: none;
}
#sect8 table td{
  text-align: left;
}

/* --------------------

 #sect9

-------------------- */

#sect9 {
  margin: 80px auto 0;
  padding: 50px 0 0;
  text-align: center;
}

#sect9 .wrap {
  max-width: 630px;
  height: 483px;
  margin: 0 auto;
  padding: 26px 20px 15px;
  border: #ccc dashed 4px;
}

#sect9 h2 {
  font-weight: 600;
  margin-bottom: 15px;
  text-align: center;
}
#sect9 h2:before {
  content: none;
}

#sect9 .wrap .gridBox {
  justify-content: flex-start;
}
#sect9 .wrap .gridBox .gridItem.leftItem .imgWrap {
  max-width: 235px;
}

#sect9 .wrap .gridBox .gridItem.rightItem {
  max-width: 288px;
  margin: 0 0 0 33px;
  text-align: left;
  font-size: 18px;
  line-height: 24px;
  margin: 0 0 10px;
}
#sect9 .wrap .gridBox .gridItem.rightItem p {
  margin: 0 0 10px;
}

#sect9 .wrap .gridBox .gridItem.rightItem table {
  width: 240px;
}
#sect9 .wrap .gridBox .gridItem.rightItem table tr th {
  width: 60px;
}

#sect9 .wrap .gridBox .gridItem.rightItem table tr td.red {
  color: #d56d6d;
}

#sect9 .wrap .listBox {
  width: 100%;
  padding: 15px;
  background-color: #fff9ef;
  box-sizing: border-box;
}

#sect9 .wrap .listBox ul {
  width: 522px;
  text-align: left;
  line-height: 1.1;
}
#sect9 .wrap .listBox ul li {
  margin: 0.2em 0;
}

#sect9 .wrap .listBox ul li.presentBox span {
  display: block;
  margin-left: 1.6em;
}
.presentBox:before {
  margin-right: 5px;
}

/* --------------------

#sec10

--------------------*/
#sect10 .gridItem {
  position: relative;
  text-align: center;
  margin: 0 auto;
}
#sect10 .gridItem p{
  font-size: 25px;
}
#sect10 .gridItem .arrow{
  font-size: 30px;
  font-weight: 900;
  color: #CF5555;
}
#sect10 .gridItem h5{
  margin-top: 10px;
  text-decoration: underline;
}
#sect10 .gridItem p.bold-underline {
  font-size: 32px;
}
#sect10 .gridItem .difference-normal,
#sect10 .gridItem .difference-althera{
  padding: 25px;
  background-color:#f2eef5;
  border-radius: 15px;
}
#sect10 .gridItem .difference-normal ul li,
#sect10 .gridItem .difference-althera ul li{
  line-height: 30px;
  text-align: left;
}
#sect10 .gridItem .difference-normal{
  margin-bottom: 45px;
  background-color:#f2eef5;
}
#sect10 .gridItem .difference-althera{
  background-color:#fdc69d;
}
#sect10 .contactBotton {
  margin: 50px auto 0;
}
/* --------------------

#sec11

--------------------*/
#sect11 {
  margin-top: 70px;
  padding: 70px 0 42px;
  text-align: center;
}
#sect11 h3 {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-width: 500px;
  width: 100%;
  /*padding: 5%;*/
  line-height: 40px;
  color: #666;
  background-color: #fff;
  border-radius: 53px;
  text-align: center;
  margin: 0 auto 60px;
}
#sect11 ul.gridBox{
  display: block;
}
#sect11 ul.gridBox li{
  padding: 1%;
  width: 40%;
  margin: 1% auto;
  background-color:white;
}
#sect11 .gridBox .gridItem {
  width: 33%;
  padding: 0 1%;
}

/* --------------------

 #contactLink

-------------------- */

#contactLink {
  margin: 100px auto 0;
  padding: 40px 0 0;
  max-width: 510px;
}

#contactLink h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  color: #fff;
  font-size: 18px;
  margin: 0 auto;
}

#contactLink h2:before {
  content: none;
}
#contactLink h2 a {
  display: block;
  width: 100%;
  text-align: center;
  height: 56px;
  line-height: 56px;
  background-color: #43b257;
}
#contactLink h2 a:hover {
  background-color: #1a9530;
}

#contactLink form {
  display: block;
  margin: 40px auto 0;
}

#contactLink .contactButton {
  display: block;
  width: 270px;
  height: 60px;
  margin: 32px auto 0;
  font-size: 24px;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  line-height: 1;
  outline: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  background-color: #cf5555;
  color: #fff;
  border: 1px solid #cf5555;
  border-radius: 20px;
}

#contactLink .contactButton:hover {
  opacity: 0.7;
}

#contactLink label {
  display: inline-block;
  margin-bottom: 2px;
}
#contactLink .form-group label {
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  margin-top: 20px;
}

#contactLink .form-control {
  display: block;
  width: 100%;
  max-width: 510px;
  min-height: 42.5px;
  padding: 0.375rem 0.75rem;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
}

/* checkbox */
#contactLink .checkboxArea {
  /*margin: 54px auto 0;*/
  margin: 30px auto 20px;
  text-align: center;
  font-size: 18px;
}
#contactLink .checkbox-input {
  display: none;
}
#contactLink .checkbox-parts {
  padding-left: 20px;
  position: relative;
  margin-right: 20px;
  /*  opacity: .7;
*/
}
#contactLink a {
  font-weight: bold;
  color:white;
}
#contactLink .checkbox-parts span.red {
  color: #cf5555;
}
/*
#contactLink .checkbox-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  border-radius: 4px;
}
#contactLink .checkbox-input:checked + .checkbox-parts{
  opacity: 1;
  font-weight: 600;
}
#contactLink .checkbox-input:checked + .checkbox-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #cf5555;
  border-right: 3px solid #cf5555;
}*/

/* --------------------

 footer

-------------------- */

footer {
  border-top: 1px solid #f4f4f4;
  margin: 100px auto 0;
  padding: 20px 0;
  text-align: center;
}

/* --------------------

 addSect1

-------------------- */
#addSect1 {
  background-color: #f6ead9;
  width: 100%;
  max-width: 1000px;
  padding: 40px 26px 20px;
  margin: 54px auto 66px;
}
#addSect1 h2 {
  font-size: 38px;
  margin-bottom: 43px;
  display: flex;
}

#addSect1 h2:before,
#addSect1 h2:after {
  content: "";
  display: inline-block;
  width: 230px;
  height: 1px;
  margin: 20px 0;
  background: #666666;
}
#addSect1 h2:before {
  margin-right: 40px;
}
#addSect1 h2:after {
  margin-left: 40px;
}

#addSect1 .gridBox .gridItem {
  width: 227px;
  margin-bottom: 20px;
}
#addSect1 .gridBox .gridItem > .imgWrap {
  width: 100%;
  height: 170px;
}
#addSect1 .gridBox .gridItem > h3 {
  padding: 7px 0 5px;
  color: #cf5555;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}
#addSect1 .gridBox .gridItem > p {
  font-size: 15px;
  font-weight: bold;
  line-height: 18px;
  text-align: left;
}

/*************************************************************
*************************************************************
   980px 以下
*************************************************************
*************************************************************/
/* @media screen and (max-width: 980px) {
  #headerInnerWrap #pageTitle {
    position: relative;
  }
  #mainVisual {
    padding: 14% 0 2%;
  }
  #mainVisualInner {
    padding: 0 25%;
  }
  #headerContact .address {
    display: none;
  }

  .wrap {
    width: 100%;
    padding: 0 2%;
  }

  #sect2 .gridBox:first-of-type .gridItem:first-of-type {
    width: 41%;
  }
  #sect2 .gridBox:first-of-type .gridItem:first-of-type {
    width: 100%;
  }
  #sect2 .gridBox:first-of-type .gridItem:nth-of-type(2) {
    width: 56%;
  }
  #sect2 .gridBox:nth-of-type(2) .gridItem:first-of-type {
    width: 100%;
  }
  #sect2 .gridBox:nth-of-type(2) .gridItem:nth-of-type(2) {
    width: 41%;
  }

  #sect2 .logoBox {
    position: relative;
    margin-top: 10px;
    width: 100%;
  }

  #sect7 {
    width: 100%;
    padding: 30px 2%;
  }

  #sect7 .gridBox .gridItem p {
    text-align: left;
  }

  #sect8.wrap {
    padding: 40px 2% 0;
  }

  #addSect1 h2 {
    justify-content: center;
  }

  #addSect1 h2:after,
  #addSect1 h2:before {
    width: 100px;
  }
} 980px end */
/*************************************************************
/* *************************************************************
   767px 以下
*************************************************************
*************************************************************/
/* @media screen and (max-width: 767px) {
  #headerInnerWrap #pageTitle {
    top: -95px;
    width: 190px;
    height: 190px;
  }
  #headerInnerWrap #pageTitle h1 {
    font-size: 14px;
    line-height: 1.4;
    padding: 2%;
  }
  #headerInnerWrap #pageTitle h1 span {
    font-size: 20px;
  }

  .tbNone {
    display: none;
  }
  #sect2.sectionArea h2 {
    font-size: 24px;
    line-height: 1.5;
  }
  #sect2.sectionArea p {
    font-size: 14px;
    line-height: 2;
  }
  #sect2.sectionArea .logoBox .imgWrap {
    margin-right: 0.5em;
  }
  #sect2.sectionArea .leaf:before,
  .sectionArea h2:before {
    width: 24px;
    height: 24px;
  }

  #sect2.sectionArea .spOrder2 h2:last-of-type {
    margin-top: 10px;
  }
  #sect6 .youtubeWrap {
    text-align: center;
    margin: 0 auto;
    position: relative;
    padding-bottom: 49%;
    height: 0;
    overflow: hidden;
  }
  #sect6 .youtubeWrap iframe {
    width: 100%;
    height: 100%;
    max-width: 755px;
    position: absolute;
    top: 0;
    left: 0;
  }
  #sect8 table th,
  #sect8 table td {
    font-size: 14px;
  }
  #sect8 table tbody td {
    padding: 1%;
    text-align: left;
  }
    #sect10 .gridItem p{
      font-size: 20px;
      line-height: 1.5;
    }
  #addSect1 {
    text-align: center;
    padding: 20px 2%;
  }
  #addSect1 h2 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    max-width: 616px;
    padding: 0 3.1%;
    width: 100%;
    height: 76px;
    font-size: 28px;
    font-weight: 600;
    line-height: 24px;
    background-color: #fff;
    border-radius: 38px;
    text-align: center;
    margin: 0 auto 20px;
  }
  #addSect1 h2:after,
  #addSect1 h2:before {
    content: none;
  }

  #addSect1 .gridBox {
    justify-content: space-around;
  }
  #addSect1 .gridBox .gridItem:first-of-type,
  #addSect1 .gridBox .gridItem:nth-of-type(2) {
    margin-bottom: 40px;
  }
} 767px end */
/*************************************************************
*************************************************************
   1280px 以下
*************************************************************
*************************************************************/
@media screen and (max-width: 1280px) {
  #headerInnerWrap #pageTitle {
    position: relative;
  }
  #mainVisual {
    /* padding: 14% 0 2%; */
    padding-top: 64px;
  }
  #mainVisualInner {
    padding: 0 25%;
  }
  #mainVisual .imgWrap img{
    margin: 10px auto;
  }
  #headerContact .address {
    display: none;
  }

  .wrap {
    width: 100%;
    padding: 0 2%;
  }

  #sect2 .gridBox:first-of-type .gridItem:first-of-type {
    width: 41%;
  }
  #sect2 .gridBox:first-of-type .gridItem:first-of-type {
    width: 100%;
  }
  #sect2 .gridBox:first-of-type .gridItem:nth-of-type(2) {
    width: 56%;
  }
  #sect2 .gridBox:nth-of-type(2) .gridItem:first-of-type {
    width: 100%;
  }
  #sect2 .gridBox:nth-of-type(2) .gridItem:nth-of-type(2) {
    width: 41%;
  }

  #sect2 .logoBox {
    position: relative;
    margin-top: 10px;
    width: 100%;
  }

  #sect7 {
    width: 100%;
    padding: 30px 2%;
  }

  #sect7 .gridBox .gridItem p {
    text-align: left;
  }
  #sect8 table{
    width: 100%;
  }

  #sect8.wrap {
    padding: 40px 2% 0;
  }

  #addSect1 h2 {
    justify-content: center;
  }

  #addSect1 h2:after,
  #addSect1 h2:before {
    width: 100px;
  }
} /* 1280px end */
/*************************************************************
*************************************************************
   900px 以下
*************************************************************
*************************************************************/
@media screen and (max-width: 900px) {
  #headerInnerWrap #pageTitle {
    top: -95px;
    width: 190px;
    height: 190px;
  }
  #headerInnerWrap #pageTitle h1 {
    font-size: 14px;
    line-height: 1.4;
    /*padding: 2%;*/
  }
  #headerInnerWrap #pageTitle h1 span {
    font-size: 20px;
  }

  .tbNone {
    display: none;
  }
  /* -----------
 sect2
----------- */
  #sect2.sectionArea h2 {
    font-size: 24px;
    line-height: 1.5;
  }
  #sect2.sectionArea p {
    font-size: 14px;
    line-height: 2;
  }
  #sect2.sectionArea .logoBox .imgWrap {
    margin-right: 0.5em;
  }
  #sect2.sectionArea .leaf:before,
  .sectionArea h2:before {
    width: 24px;
    height: 24px;
  }

  #sect2.sectionArea .spOrder2 h2:last-of-type {
    margin-top: 10px;
  }

  /* -----------
 sect6
----------- */
  #sect6 .youtubeWrap {
    text-align: center;
    margin: 0 auto;
    position: relative;
    padding-bottom: 49%;
    height: 0;
    overflow: hidden;
  }
  #sect6 .youtubeWrap iframe {
    width: 100%;
    height: 100%;
    max-width: 755px;
    position: absolute;
    top: 0;
    left: 0;
  }

  /* -----------
 sect8
----------- */
  #sect8 table th,
  #sect8 table td {
    font-size: 14px;
  }
  #sect8 table tbody td {
    padding: 1%;
    text-align: left;
  }

  /* -----------
  sect8
  ----------- */
    #sect10 .gridItem p{
      font-size: 20px;
      line-height: 1.5;
    }

  /* --------------------

 addSect1

-------------------- */
  #addSect1 {
    text-align: center;
    padding: 20px 2%;
  }
  #addSect1 h2 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    max-width: 616px;
    padding: 0 3.1%;
    width: 100%;
    height: 76px;
    font-size: 28px;
    font-weight: 600;
    line-height: 24px;
    background-color: #fff;
    border-radius: 38px;
    text-align: center;
    margin: 0 auto 20px;
  }
  #addSect1 h2:after,
  #addSect1 h2:before {
    content: none;
  }

  #addSect1 .gridBox {
    justify-content: space-around;
  }
  #addSect1 .gridBox .gridItem:first-of-type,
  #addSect1 .gridBox .gridItem:nth-of-type(2) {
    margin-bottom: 40px;
  }
} /* 900px end */

/*************************************************************
*************************************************************
   600px 以下
*************************************************************
*************************************************************/
@media screen and (max-width: 600px) {
  /* -----------
 common
----------- */
  .imgWrap img {
    /* margin: 0 auto; */
  }
  .spNone {
    display: none;
  }
  .pcNone {
    display: block;
  }

  .spOrder1 {
    order: 1;
  }
  .spOrder2 {
    order: 2;
  }
  .spOrder3 {
    order: 3;
  }
  .sp-none{
    display: none;
  }
  .sectionArea h2 {
    font-size: 20px;
    line-height: 1.5;
    margin: 0 auto;
    padding: 2% 0;
  }
  .sectionArea h3{
    font-size: 20px;
  }
  .sectionArea h4{
    font-size: 18px;
  }
  .sectionArea h5{
    font-size: 16px;
  }
  .sectionArea h2:before {
    margin-right:
     0.5em;
  }

  .leaf:before,
  .sectionArea h2:before {
    width: 24px;
    height: 23px;
  }

  .contactBotton {
    width: 90%;
  }

  /* -----------
 header
----------- */
  #headder {
    height: 60px;
  }
  #headerInnerWrap {
    height: 60px;
  }
  #headerInnerWrap #headerLogo a {
    height: 100%;
  }
  #headerInnerWrap #headerLogo {
    width: 70%;
  }
  #headerContact {
    width: 30%;
    justify-content: flex-end;
  }
  #headerInnerWrap #pageTitle {
    display: none;
  }
  #mainVisual {
    padding: 0;
  }
  #mainVisualInnerSp {
    margin-top: 60px;
  }

  /* -----------
 sect1
----------- */
  #sect1 {
    /* padding-top: 60px; */
    padding-top: 0px;
  }
  #sect1 h2 {
    font-size: 24px;
    line-height: 28px;
    margin: 0 auto;
    padding: 5% 0;
    width: 100%;
  }
  #sect1 p {
    font-size: 18px;
  }
  #sect1 #contensNavArea {
    justify-content: space-around;
  }
  #sect1 #contensNavArea .pageLink {
    margin-top: 0;
    margin-bottom: 10px;
    width: 48.5%;
  }
  #sect1 #contensNavArea .pageLink a {
    width: 100%;
    font-size: 14px;
  }

  /* -----------
 sect2
----------- */
  #sect2 {
    margin-top: 0;
    padding-top: 80px;
  }

  #sect2 .gridBox:first-of-type .gridItem:first-of-type,
  #sect2 .gridBox:first-of-type .gridItem:nth-of-type(2),
  #sect2 .gridBox:nth-of-type(2) .gridItem:first-of-type,
  #sect2 .gridBox:nth-of-type(2) .gridItem:nth-of-type(2) {
    width: 100%;
    padding: 0 2%;
  }
  #sect2 .gridItem p.bold-underline{
    font-size: 20px;
  }
  #sect2 .logoBox p {
    max-width: initial;
    padding: 0 0 0 2%;
  }
  #sect2 .contactBotton {
    margin-top: 60px;
  }

  /* -----------
 sect3
----------- */
  #sect3 {
    margin-top: 40px;
    padding: 40px 2% 20px;
  }
  #sect3 h3{
    font-size: 20px;
    line-height: 27px;
  }
  #sect3 h2 {
    line-height: 1.5;
  }
  #sect3 .gridBox {
    /* margin-top: -40px; */
    flex-wrap: wrap;
    margin-top:0;
  }
  #sect3 .gridBox .gridItem {
    width: 100%;
    padding: 5%;
  }
  #sect3 .gridBox .gridItem {
    width: 100%;
    padding: 5%;
  }
  #sect3 ul.gridBox li {
    width: 100%;
    padding: 5%;
  }
  /* -----------
 sect4
----------- */
  #sect4 h2 {
    margin: 60px auto 20px;
  }
  #sect4 .meritArea {
    flex-wrap: wrap;
  }
  #sect4 .meritArea .imgWrap {
    margin: 0 auto;
  }
  #sect4 .meritArea {
    padding: 3%;
  }
  #sect4 .meritArea ul {
    margin: 0;
  }
  #sect4 .meritArea ul h3 {
    font-size: 20px;
    line-height: 1.5;
    margin: 0 auto;
    padding: 2% 0;
  }
  #sect4 .meritArea ul li:last-of-type {
    margin-bottom: 0;
  }
  #sect4 .meritArea ul li {
    margin-bottom: 10px;
  }
  #sect4 .meritArea ul li.leaf:before {
    content: none;
  }

  /* -----------
 sect5
----------- */
  #sect5 {
    margin: 20px auto 0;
    padding: 5% 0;
    background: none;
  }
  #sect5 h2 {
    font-size: 20px;
  }
  #sect5 .wrap {
    padding: 0 2%;
  }
  #sect5 .wrap .gridBox.boderBox {
    flex-wrap: wrap;
    padding: 3%;
  }
  #sect5 .gridBox .gridItem.profileArea {
    margin: 0 auto;
    padding-bottom: 5%;
  }
  #sect5 .gridBox .gridItem.profileArea h3 {
    padding: 2% 0;
  }
  #sect5 .gridBox .gridItem.profileArea .imgWrap {
    margin: 0;
    padding: 0 2% 5%;
  }
  #sect5 .gridBox .gridItem.descriptionArea {
    max-width: initial;
  }
  #sect5 .gridBox .gridItem.descriptionArea p {
    font-size: 14px;
  }

  /* -----------
 sect6
----------- */
  #sect6 h2 {
    margin: 40px auto 20px;
  }

  /* -----------
 sect7
----------- */
  #sect7 .gridBox {
    padding: 5% 2% 2%;
    height: auto;
  }
  #sect7 .gridBox.col_2 .gridItem {
    width: 100%;
    max-width: initial;
    padding: 3%;
  }
  #sect7 .gridBox .gridItem p {
    font-size: 14px;
  }

  /* -----------
 sect8
----------- */
  #sect8 {
    margin: 20px auto 0;
  }
  #sect8 table{
    width: 100%;
  }
  #sect8 table .spNone {
    display: none;
  }
  #sect8 table tbody tr th {
    width: 33%;
  }
  #sect8 table .thead {
    display: none;
  }
  #sect8 table.course-option-general tr{
    width: 100%;
  }
  #sect8 table.course-option-general td{
    display: block;
    width: 100%;
    text-align: left;
    border:none;
  }
  #sect8 table.course-option-general td:first-child{
    background: #e9727e;
    color: #fff;
    font-weight: bold;
    text-align: center;
  }
  #sect8 table.course-option-general td:before{
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
    /* width: 20%; */
    text-align: left;
  }
  #sect8 table th{
    line-height: 24px;
  }
  #sect8 table th .course-name{
    font-size: 16px;
  }
  /* -----------
 sect9
----------- */
  #sect9 {
    margin-top: 60px;
    padding: 2%;
  }

  #sect9 .wrap {
    height: auto;
    padding: 3%;
  }
  #sect9 .wrap .gridBox {
    justify-content: center;
  }
  #sect9 .wrap .gridBox .gridItem.rightItem {
    margin-top: 10px;
    max-width: initial;
  }
  #sect9 .wrap .gridBox .gridItem.rightItem p {
    font-size: 14px;
  }
  #sect9 .wrap .gridBox .gridItem.rightItem table {
    font-size: 16px;
  }
  #sect9 .wrap .listBox ul {
    font-size: 14px;
  }

  #sect9 .wrap .listBox {
    padding: 3%;
  }
  #sect9 .wrap .listBox ul {
    width: 100%;
    padding: 0;
  }
  #sect9 .wrap .listBox ul li {
    line-height: 1.4;
    margin: 0.3em 0;
  }
  #sect9 .wrap .listBox ul li.presentBox span {
    margin-left: 0;
  }

  #sect9 .presentBox:before {
    content: none;
  }

  /* -----------
 contact section
----------- */
  #contactLink {
    margin-top: 0;
    padding: 80px 2% 0;
  }
  #contactLink .form-group label {
    font-size: 16px;
  }
  #contactLink .form-control {
    font-size: 14px;
  }
} /* 640px end */

.bnr_training_course {
  margin: 0 0 70px;
  padding: 0;
  display: flex;
}
.bnr_training_course li {
  width: 30%;
  padding: 0 1.5%;
  box-sizing: content-box;
}
.bnr_training_course li a:hover img {
  opacity: 0.8;
}
.bnr_training_course li img {
  width: 100%;
}
@media screen and (max-width: 640px) {
  .bnr_training_course {
    margin: 0 auto;
    display: block;
  }
  .bnr_training_course li {
    width: 100%;
    padding: 0;
    text-align: center;
    margin-bottom: 20px;
  }
  .bnr_training_course li img {
    width: auto;
  }
}

@media screen and (max-width: 640px) {
  #mainVisual {
    background: url(../img/training/mainvisual_sp.jpg) no-repeat;
    height: 610px;
    padding-top: 60px;
  }
  #mainVisualInner {
    padding: 70px 2% 0;
  }
  #contactMain{
    width: 70%;
    margin-top: 40px;
  }
}
