@charset "UTF-8";
@-webkit-keyframes $animation-name { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

@-moz-keyframes $animation-name { 0% { opacity: 0;
    transform: translateX(100%); }
  100% { opacity: 1;
    transform: translateX(0); } }

@keyframes $animation-name { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/** 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; }

/* HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }

/** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */
audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }

/** 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/10. Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */
[hidden], template { display: none; }

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

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

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

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

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

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

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

/** 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/10. */
img { border: 0; }

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

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

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

/** Contain overflow in all browsers. */
pre { overflow: auto; }

/** Address odd `em`-unit font size rendering in all browsers. */
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

/* Forms ========================================================================== */
/** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */
/** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */
button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ }

/** Address `overflow` set to `hidden` in IE 8/9/10/11. */
button { overflow: visible; }

/** 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 Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */
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; }

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

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

/** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width. 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"] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari 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 and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** 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/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ }

/** Remove default vertical scrollbar in IE 8/9/10/11. */
textarea { overflow: auto; }

/** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */
optgroup { font-weight: bold; }

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

td, th { padding: 0; }

@font-face { font-family: 'icon'; src: url("/common/font/icon.eot?s7ebs9"); src: url("/common/font/icon.eot?s7ebs9#iefix") format("embedded-opentype"), url("/common/font/icon.ttf?s7ebs9") format("truetype"), url("/common/font/icon.woff?s7ebs9") format("woff"), url("/common/font/icon.svg?s7ebs9#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: 'icon' !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-academy:before { content: "\e900"; }

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

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

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

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

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

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

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

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

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

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

.icon-youtube:before { content: "\ea9d"; }

@-webkit-keyframes $animation-name { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

@-moz-keyframes $animation-name { 0% { opacity: 0;
    transform: translateX(100%); }
  100% { opacity: 1;
    transform: translateX(0); } }

@keyframes $animation-name { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body, html { font-size: 100%; padding: 0; margin: 0; }

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

body { position: relative; font-family: "Noto Sans Japanese", "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS P Gothic", Helvetica, Arial, Verdana, sans-serif, icon; font-size: 16px; color: #595959; letter-spacing: 0.02em; line-height: 180%; text-align: center; letter-spacing: 0.07em; }

@media screen and (max-width: 640px) { body { line-height: 190%; font-size: 14px; } }

html { height: 100%; }

body { min-height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; }

main { display: block; }

a { display: block; color: #5cb531; cursor: pointer; outline: none; background-color: transparent; border: 0; overflow: hidden; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

a:before, a:after { -moz-transition: 0.3s ease; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; -ms-transition: 0.3s ease; transition: 0.3s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

a img { -moz-transition: 0.3s ease; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; -ms-transition: 0.3s ease; transition: 0.3s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

a:link { color: #5cb531; }

a:visited { color: #5cb531; }

a:hover { color: #5cb531; text-decoration: none; }

a:active { color: #5cb531; }

a:hover img { opacity: .8; }

ul, dl, dt, dd { margin: 0; padding: 0; text-align: left; }

li { list-style: none; }

input, button, select, textarea { border-style: none; border-width: 0; border: none; border-radius: 0; border: 1px solid #cccccc; padding: 5px 10px; width: 100%; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

input[type=radio], input[type=checkbox] { display: none; }

input[type=radio] + label, input[type=checkbox] + label { position: relative; display: inline-block; margin-right: 12px; cursor: pointer; line-height: 140%; }

input[type=radio]:checked + label:before, input[type=radio]:checked + .mfp_element_all + .mfp_ok + label:before, input[type=checkbox]:checked + label:before, input[type=checkbox]:checked + .mfp_element_all + .mfp_ok + label:before { background: #FFFFFF; border: 1px solid #5cb531; }

input[type=radio]:checked + label:after, input[type=radio]:checked + .mfp_element_all + .mfp_ok + label:after, input[type=checkbox]:checked + label:after, input[type=checkbox]:checked + .mfp_element_all + .mfp_ok + label:after { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }

/* custom */
label { position: relative; display: inline-block; padding-left: 25px; cursor: pointer; }

label:before, label:after { position: absolute; content: ''; top: 0; bottom: 0; margin: auto; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

label:before { left: 0; width: 18px; height: 18px; border: 1px solid #cccccc; background: #FFFFFF; }

label:after { opacity: 0; left: 4px; width: 10px; height: 10px; background: #5cb531; -webkit-transform: scale(2); -ms-transform: scale(2); transform: scale(2); }

label:hover:before { background: #FFFFFF; }

select { width: auto; }

input:focus, select:focus, textarea:focus { outline: none; background: #f0faeb; }

button { border-style: none; border-width: 0; border: none; border-radius: 0; background: #FFFFFF; }

::-webkit-input-placeholder { color: #cccccc; opacity: 1; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; }

::-moz-placeholder { color: #cccccc; opacity: 1; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; }

:-moz-placeholder { color: #cccccc; opacity: 1; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; }

:-ms-input-placeholder { color: #cccccc; opacity: 1; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; }

::-placeholder { color: #cccccc; opacity: 1; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; }

:focus::-webkit-input-placeholder { opacity: .7; }

:focus:-moz-placeholder { opacity: .7; }

:focus::-moz-placeholder { opacity: .7; }

:focus:-ms-input-placeholder { opacity: .7; }

:focus::-placeholder { opacity: .7; }

i, em, address, b { font-style: normal; font-weight: normal; }

.tel-link a { display: inline-block; }

img, canvas, video, svg { max-width: 100%; }

.overflow-container { overflow-y: scroll; -webkit-overflow-scrolling: touch; }

@-webkit-keyframes $animation-name { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

@-moz-keyframes $animation-name { 0% { opacity: 0;
    transform: translateX(100%); }
  100% { opacity: 1;
    transform: translateX(0); } }

@keyframes $animation-name { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

#wrapper { position: relative; z-index: 3; }

.bg-fixed { position: fixed; width: 100%; min-height: 100%; background-attachment: fixed; z-index: 1; opacity: .6; }

.bg-fixed:before, .bg-fixed:after { display: block; position: absolute; content: ""; }

.bg-fixed:before { left: -200px; bottom: 10%; width: 502px; height: 430px; background: url("/vegefactory/common/img/bg_left01.png") no-repeat 0 0; background-size: contain; }

@media screen and (max-width: 1200px) { .bg-fixed:before { left: -300px; } }

@media screen and (max-width: 1024px) { .bg-fixed:before { opacity: .5; } }

.bg-fixed:after { top: 6%; right: -100px; width: 521px; height: 511px; background: url("/vegefactory/common/img/bg_right01.png") no-repeat 0 0; background-size: contain; }

@media screen and (max-width: 1200px) { .bg-fixed:after { right: -300px; } }

@media screen and (max-width: 1024px) { .bg-fixed:after { opacity: .5; } }

.head { position: relative; text-align: left; font-size: 32px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; color: #5cb531; border-bottom: 3px solid #5cb531; padding-bottom: 15px; margin: 30px auto 40px; line-height: 120%; }

@media screen and (max-width: 768px) { .head { font-size: 26px; padding-bottom: 7px; margin: 20px auto 30px; } }

@media screen and (max-width: 640px) { .head { font-size: 22px; padding-bottom: 5px; margin: 20px auto 20px; border-width: 2px; } }

.head + section { margin-top: 30px; }

@media screen and (max-width: 640px) { .head + section { margin-top: 15px; } }

.subHead { display: block; text-align: left; font-size: 32px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; color: #000000; line-height: 100%; margin-bottom: 20px; }

@media screen and (max-width: 768px) { .subHead { font-size: 22px; } }

@media screen and (max-width: 640px) { .subHead { font-size: 18px; margin-bottom: 15px; } }

.copyText { font-size: 24px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; color: #5cb531; line-height: 140%; margin-bottom: 25px; }

@media screen and (max-width: 768px) { .copyText { font-size: 22px; } }

@media screen and (max-width: 640px) { .copyText { font-size: 16px; margin-bottom: 15px; } }

.ttl { text-align: left; font-size: 20px; letter-spacing: 0em; line-height: 140%; margin: 0 0 20px; padding: 0 0 0 10px; border-left: 6px solid #5cb531; }

@media screen and (max-width: 640px) { .ttl { font-size: 16px; margin-bottom: 15px; border-width: 4px; padding: 0 0 0 7px; } }

.ttl + p { margin-top: 0; }

* + .ttl { margin-top: 40px; }

@media screen and (max-width: 640px) { * + .ttl { margin-top: 20px; } }

p { margin: 20px auto; text-align: left; }

@media screen and (max-width: 640px) { p { margin: 10px auto; } }

p + .ex { margin-top: -20px; }

@media screen and (max-width: 640px) { p + .ex { margin-top: -15px; } }

p.img + .ex { margin-top: 10px; }

figure p { text-align: center; }

.ex { font-size: 90%; font-weight: normal; vertical-align: top; }

b { font-weight: bold; }

.mainTtl { position: relative; text-align: left; font-size: 40px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; color: #000000; line-height: 100%; margin: 0; padding: 30px 50px; }

@media screen and (max-width: 1024px) { .mainTtl { padding-left: 30px; padding-right: 30px; } }

@media screen and (max-width: 768px) { .mainTtl { padding-left: 15px; padding-right: 15px; font-size: 32px; } }

@media screen and (max-width: 640px) { .mainTtl { font-size: 22px; padding: 10px 15px; } }

.mainTtl span { display: inline-block; font-size: 30px; line-height: 40px; margin-left: 1em; color: #a2a2a2; vertical-align: top; }

@media screen and (max-width: 768px) { .mainTtl span { font-size: 20px; line-height: 32px; } }

@media screen and (max-width: 640px) { .mainTtl span { font-size: 16px; line-height: 100%; margin-top: 3px; } }

body.about .mainTtl { color: #fc646d; }

body.exhibition .mainTtl { color: #ffca33; }

body.news .mainTtl { color: #5cb531; }

body.introduction .mainTtl { color: #2cbfb8; }

body.laboratory .mainTtl { color: #85a1cf; }

body.contact .mainTtl { color: #c2986d; }

body.download .mainTtl { color: #0000ff; }

#breadCrumb { text-align: left; margin: 10px auto 30px; }

@media screen and (max-width: 768px) { #breadCrumb { margin-bottom: 15px; } }

@media screen and (max-width: 640px) { #breadCrumb { margin: 5px auto; } }

@media screen and (max-width: 640px) { #breadCrumb .inner { padding-top: 0; padding-bottom: 0; } }

#breadCrumb ul li { position: relative; display: inline-block; font-size: 12px; vertical-align: middle; padding-right: 28px; letter-spacing: 0; line-height: 100%; }

@media screen and (max-width: 640px) { #breadCrumb ul li { font-size: 10px; } }

#breadCrumb ul li a { color: #595959; }

#breadCrumb ul li:before { position: absolute; top: 0; bottom: 0; right: 10px; margin: auto; content: ""; vertical-align: middle; width: 7px; height: 7px; margin: auto; border-top: 1px solid #595959; border-right: 1px solid #595959; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

#breadCrumb ul li:last-child { padding-right: 0; }

#breadCrumb ul li:last-child:before { display: none; }

.inner { position: relative; max-width: 1200px; width: auto; margin-left: auto; margin-right: auto; }

@media screen and (max-width: 1200px) { .inner { padding: 0 30px; } }

@media screen and (max-width: 1024px) { .inner { padding: 0 20px; } }

@media screen and (max-width: 640px) { .inner { padding: 0 15px; } }

#main { clear: both; overflow: hidden; }

section { clear: both; margin-top: 100px; }

@media screen and (max-width: 640px) { section { margin-top: 40px; } }

section .head:first-child, section .subHead:first-child { margin-top: 0; }

.head + section { padding-top: 0; }

#mainColumn { max-width: 1200px; margin: 0 auto; }

@media screen and (max-width: 1200px) { #mainColumn { padding: 0 30px; } }

@media screen and (max-width: 768px) { #mainColumn { padding: 0 20px; } }

@media screen and (max-width: 640px) { #mainColumn { padding: 0 15px; } }

#mainColumn figure.img { margin: 40px auto; }

@media screen and (max-width: 640px) { #mainColumn figure.img { margin: 20px auto; } }

#mainColumn header h1.head { color: #595959; margin-bottom: 15px; }

@media screen and (max-width: 640px) { #mainColumn header h1.head { margin-bottom: 7px; } }

#mainColumn header time { text-align: left; display: block; font-size: 18px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; color: #5cb531; }

@media screen and (max-width: 768px) { #mainColumn header time { font-size: 16px; } }

@media screen and (max-width: 640px) { #mainColumn header time { font-size: 14px; } }

#asideBottom { margin-top: 60px; }

@media screen and (max-width: 640px) { #asideBottom { margin-top: 40px; } }

@media screen and (max-width: 1200px) { .topImg { margin-left: -30px; margin-right: -30px; } }

#header { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; position: relative; overflow: hidden; color: #FFFFFF; background: #000000; padding: 14px 30px; z-index: 2; }

@media screen and (max-width: 1024px) { #header { padding: 10px 20px; } }

@media screen and (max-width: 640px) { #header { padding: 10px 15px; } }

#header:after { position: absolute; content: ''; display: block; left: 0; right: 0; bottom: 3px; margin: auto; width: 100%; height: 1px; background: #a2a2a2; }

#header .logo { margin: 0; }

#header .logo a, #header .logo > span { display: inline-block; vertical-align: middle; height: 66px; color: #FFFFFF; font-size: 18px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; letter-spacing: 0; line-height: 100%; text-align: left; line-height: 66px; background: url("/vegefactory/common/img/logo_header01.png") no-repeat 0 50%; padding-left: 195px; background-size: contain; text-decoration: none; }

#header .logo a:hover, #header .logo > span:hover { text-decoration: none; opacity: .8; }

@media screen and (max-width: 900px) { #header .logo a i, #header .logo > span i { display: none; } }

@media screen and (max-width: 1024px) { #header .logo a, #header .logo > span { background-size: 120px; padding-left: 134px; font-size: 16px; } }

@media screen and (max-width: 768px) { #header .logo a, #header .logo > span { text-indent: 130%; white-space: nowrap; overflow: hidden; width: 130px; } }

@media screen and (max-width: 640px) { #header .logo a, #header .logo > span { padding: 0; width: 86px; height: 48px; background-size: contain; } }

#header .subNav { font-size: 0; }

#header .subNav li { display: inline-block; margin-left: 3px; vertical-align: top; }

#header .subNav li.oficialsite a { text-indent: 130%; white-space: nowrap; overflow: hidden; width: 90px; background: url("/vegefactory/common/img/logo_white01.png") no-repeat 0 35%; background-size: contain; line-height: 50px; margin-right: 20px; }

@media screen and (max-width: 640px) { #header .subNav li.oficialsite a { background-size: 80px; margin-right: 10px; width: 80px; height: 50px; } }

@media screen and (max-width: 360px) { #header .subNav li.oficialsite a { width: 25px; } }

#header .subNav li.oficialsite a:hover { opacity: 0.8; }

#header .subNav li.oficialsite a:after { display: none; }

#header .subNav li.contact a, #header .subNav li.download a { position: relative; display: block; color: #FFFFFF; font-size: 18px; height: 50px; padding: 16px 20px 16px 60px; line-height: 100%; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; text-decoration: none; overflow: visible; }

@media screen and (max-width: 1024px) { #header .subNav li.contact a, #header .subNav li.download a { font-size: 16px; padding-left: 7vw; } }

@media screen and (max-width: 768px) { #header .subNav li.contact a, #header .subNav li.download a { font-size: 14px; letter-spacing: -0.02em; } }

@media screen and (max-width: 640px) { #header .subNav li.contact a, #header .subNav li.download a { height: auto; font-size: 10px; padding: 35px 5px 5px 5px; } }

#header .subNav li.contact a i, #header .subNav li.download a i { position: relative; z-index: 2; }

#header .subNav li.contact a:after, #header .subNav li.download a:after { position: absolute; content: ''; display: block; top: 0; left: 0; bottom: 0; margin: auto; width: 100%; height: 50px; border: 1px solid #00ff00; -webkit-transform: skew(-25deg); -ms-transform: skew(-25deg); transform: skew(-25deg); z-index: 1; }

@media screen and (max-width: 640px) { #header .subNav li.contact a:after, #header .subNav li.download a:after { height: auto; -webkit-transform: none; -ms-transform: none; transform: none; } }

#header .subNav li.contact a:hover:after, #header .subNav li.download a:hover:after { background: rgba(0, 255, 0, 0.5); }

#header .subNav li.contact a:before, #header .subNav li.download a:before { position: absolute; content: ""; display: block; width: 40px; height: 32px; top: 0; bottom: 0; left: 13px; margin: auto; background: url("/vegefactory/common/img/icon_contact01.png") no-repeat 0 50%; background-size: contain; }

@media screen and (max-width: 1024px) { #header .subNav li.contact a:before, #header .subNav li.download a:before { background-size: 4vw; } }

@media screen and (max-width: 640px) { #header .subNav li.contact a:before, #header .subNav li.download a:before { left: 0; right: 0; bottom: auto; width: 32px; background-size: 30px; } }

#header .subNav li.download a { letter-spacing: 0; padding-left: 50px; }

@media screen and (max-width: 1024px) { #header .subNav li.download a { font-size: 16px; padding-left: 7vw; } }

@media screen and (max-width: 768px) { #header .subNav li.download a { font-size: 14px; letter-spacing: -0.02em; } }

@media screen and (max-width: 640px) { #header .subNav li.download a { height: auto; font-size: 10px; padding: 35px 5px 5px 5px; } }

#header .subNav li.download a:after { border: 1px solid #0000ff; -webkit-transform: skew(-25deg); -ms-transform: skew(-25deg); transform: skew(-25deg); }

@media screen and (max-width: 640px) { #header .subNav li.download a:after { height: auto; -webkit-transform: none; -ms-transform: none; transform: none; } }

#header .subNav li.download a:hover:after { background: rgba(0, 0, 255, 0.5); }

#header .subNav li.download a:before { background: url("/vegefactory/common/img/icon_download01.png") no-repeat 0 50%; background-size: contain; width: 28px; left: 17px; }

@media screen and (max-width: 1024px) { #header .subNav li.download a:before { background-size: 4vw; } }

@media screen and (max-width: 640px) { #header .subNav li.download a:before { left: 0; right: 0; bottom: auto; width: 20px; background-size: 20px; } }

.nav { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; border-top: 1px solid #cccccc; background: #FFFFFF; text-align: center; padding-bottom: 1px; border-bottom: 3px solid #dddddd; }

@media screen and (max-width: 640px) { .nav { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } }

.nav li { position: relative; width: 100%; border-right: 1px solid #cccccc; }

.nav li:last-child { border-right: none; }

@media screen and (max-width: 640px) { .nav li { width: 33.333%; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; }
  .nav li:nth-child(3n) { border-right: none; } }

.nav li a { position: relative; display: block; font-size: 20px; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; letter-spacing: 0; color: #000000; padding: 10px 1vw; line-height: 100%; white-space: nowrap; border-top: 9px solid #a2a2a2; border-bottom: 1px solid #cccccc; text-decoration: none; }

@media screen and (max-width: 1024px) { .nav li a { font-size: 18px; letter-spacing: -0.01em; } }

@media screen and (max-width: 768px) { .nav li a { font-size: 16px; letter-spacing: 0; }
  .nav li a i { display: none; } }

@media screen and (max-width: 640px) { .nav li a { padding: 7px 1vw; font-size: 14px; } }

.nav li a span.jp { display: table-cell; width: 1000px; vertical-align: middle; height: 2.6em; line-height: 130%; }

@media screen and (max-width: 768px) { .nav li a span.jp { height: 1.3em; } }

.nav li a span.en { display: block; font-size: 14px; letter-spacing: 0.1em; margin-top: 0; }

@media screen and (max-width: 768px) { .nav li a span.en { font-size: 12px; } }

@media screen and (max-width: 640px) { .nav li a span.en { font-size: 10px; } }

.nav li.about a { border-top: 9px solid #fc646d; }

.nav li.about a span.en { color: #fc646d; }

.nav li.about a:hover { background: rgba(252, 100, 109, 0.15); }

@media screen and (max-width: 640px) { .nav li.about a { border-top: 3px solid #fc646d; } }

.nav li.exhibition a { border-top: 9px solid #ffca33; }

.nav li.exhibition a span.en { color: #ffca33; }

.nav li.exhibition a:hover { background: rgba(255, 202, 51, 0.15); }

@media screen and (max-width: 640px) { .nav li.exhibition a { border-top: 3px solid #ffca33; } }

.nav li.news a { border-top: 9px solid #5cb531; }

.nav li.news a span.en { color: #5cb531; }

.nav li.news a:hover { background: rgba(92, 181, 49, 0.15); }

@media screen and (max-width: 640px) { .nav li.news a { border-top: 3px solid #5cb531; } }

.nav li.introduction a { border-top: 9px solid #2cbfb8; }

.nav li.introduction a span.en { color: #2cbfb8; }

.nav li.introduction a:hover { background: rgba(44, 191, 184, 0.15); }

@media screen and (max-width: 640px) { .nav li.introduction a { border-top: 3px solid #2cbfb8; } }

.nav li.laboratory a { border-top: 9px solid #85a1cf; }

.nav li.laboratory a span.en { color: #85a1cf; }

.nav li.laboratory a:hover { background: rgba(133, 161, 207, 0.15); }

@media screen and (max-width: 640px) { .nav li.laboratory a { border-top: 3px solid #85a1cf; } }

.nav li.contact a { border-top: 9px solid #c2986d; }

.nav li.contact a span.en { color: #c2986d; }

.nav li.contact a:hover { background: rgba(194, 152, 109, 0.15); }

@media screen and (max-width: 640px) { .nav li.contact a { border-top: 3px solid #c2986d; } }

#footer { clear: both; text-align: center; font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; padding: 40px 0; }

#footer .inner { position: relative; }

#footer .pageTop { position: relative; text-align: right; margin: 0; width: 100%; }

#footer .pageTop a { position: fixed; bottom: 40px; right: 60px; display: inline-block; *display: inline; *zoom: 1; vertical-align: top; width: 60px; height: 60px; background: #5cb531; z-index: 100; }

@media screen and (max-width: 1024px) { #footer .pageTop a { right: 30px; } }

@media screen and (max-width: 640px) { #footer .pageTop a { right: 10px; bottom: 10px; width: 47px; height: 47px; } }

#footer .pageTop a.scrollBottom { bottom: 84px; }

@media screen and (max-width: 640px) { #footer .pageTop a.scrollBottom { bottom: 120px; } }

#footer .pageTop a:hover span:before { margin-top: -12px; }

#footer .pageTop a:hover span:after { margin-top: -12px; }

#footer .pageTop a span { position: relative; display: block; text-indent: 130%; white-space: nowrap; overflow: hidden; height: 60px; }

@media screen and (max-width: 640px) { #footer .pageTop a span { height: 47px; } }

#footer .pageTop a span:before { position: absolute; content: ""; top: 50%; left: 50%; width: 14px; height: 14px; margin: -9px 0 0 -7px; border-top: 2px solid #FFFFFF; border-right: 2px solid #FFFFFF; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); zoom: 1; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

@media screen and (max-width: 640px) { #footer .pageTop a span:before { width: 11px; height: 11px; margin: -8px 0 0 -6px; border-width: 1px; } }

#footer .pageTop a span:after { position: absolute; content: ""; top: 50%; left: 50%; width: 2px; height: 21px; margin: -9px 0 0 -1px; background: #FFFFFF; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

@media screen and (max-width: 640px) { #footer .pageTop a span:after { height: 17px; margin: -9px 0 0 -1px; width: 1px; } }

#footer .powered { text-align: center; font-size: 16px; margin: 0 auto 40px; }

@media screen and (max-width: 640px) { #footer .powered { font-size: 12px; } }

#footer .powered span { display: inline-block; text-indent: 130%; white-space: nowrap; overflow: hidden; width: 190px; height: 58px; vertical-align: bottom; background: url("/vegefactory/common/img/logo_footer01.png") no-repeat 50% 50%; margin-left: 10px; background-size: contain; }

@media screen and (max-width: 640px) { #footer .powered span { width: 89px; height: auto; margin-left: 5px; } }

#footer .copyright { margin: 0; text-align: center; }

#footer .copyright small { font-size: 14px; color: #5cb531; }

@media screen and (max-width: 640px) { #footer .copyright small { font-size: 11px; letter-spacing: 0; } }

#footer .footerNav { font-size: 0; }

#footer .footerNav ul { text-align: center; }

#footer .footerNav ul li { display: inline-block; border-right: 1px solid #cccccc; }

#footer .footerNav ul li:last-child { border: none; }

#footer .footerNav ul li a { display: block; font-size: 14px; color: #000000; padding: 0 10px; line-height: 100%; text-decoration: none; }

#footer .footerNav ul li a:hover { text-decoration: underline; }

@media screen and (max-width: 640px) { #footer .footerNav ul li a { font-size: 12px; padding: 0 5px; } }

img { max-width: 100%; height: auto; vertical-align: top; }

.tabList { text-align: center; font-size: 0; line-height: 100%; margin-bottom: 60px; }

@media screen and (max-width: 640px) { .tabList { margin-bottom: 40px; } }

.tabList li { display: inline-block; margin: 0 2px 4px; }

@media screen and (max-width: 640px) { .tabList li { margin: 0 3px 7px; } }

.tabList li a { display: block; font-size: 14px; background: #a2a2a2; color: #FFFFFF; padding: 10px 35px; line-height: 100%; -webkit-transform: none; -ms-transform: none; transform: none; text-decoration: none; }

@media screen and (max-width: 768px) { .tabList li a { padding: 15px 20px; font-size: 12px; } }

@media screen and (max-width: 640px) { .tabList li a { padding: 10px 15px; font-size: 11px; letter-spacing: 0; border-radius: 30px; } }

.tabList li a.active, .tabList li a:hover { text-decoration: none; color: #000000; background: #ffef00; }

.newsList { text-align: left; max-width: 824px; margin: 0 auto; }

.newsList li { margin-bottom: 5px; }

.newsList li a { font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; display: block; text-decoration: none; }

.newsList li a time { display: block; font-size: 18px; color: #5cb531; float: left; clear: both; }

@media screen and (max-width: 768px) { .newsList li a time { font-size: 16px; } }

@media screen and (max-width: 640px) { .newsList li a time { float: none; font-size: 14px; } }

.newsList li a .ttl { float: left; font-size: 18px; color: #000000; border: none; padding: 0; margin: 0; margin-left: 1em; }

@media screen and (max-width: 768px) { .newsList li a .ttl { font-size: 16px; } }

@media screen and (max-width: 640px) { .newsList li a .ttl { float: none; margin-left: 0; font-size: 14px; } }

.newsList li a:hover .ttl { text-decoration: underline; }

.pagination { font-size: 0; text-align: center; margin: 50px auto 60px; padding-top: 40px; border-top: 1px solid #cccccc; }

.pagination li { display: inline-block; margin: 0 7px; vertical-align: top; }

@media screen and (max-width: 640px) { .pagination li { margin: 0 3px; } }

.pagination li a { position: relative; font-size: 18px; color: #595959; width: 40px; height: 40px; line-height: 40px; border: 1px solid #cccccc; background: #FFFFFF; text-decoration: none; }

@media screen and (max-width: 640px) { .pagination li a { font-size: 14px; width: 32px; height: 36px; line-height: 36px; } }

.pagination li a:hover { background: #5cb531; color: #FFFFFF; }

.pagination li.current a { background: #5cb531; color: #FFFFFF; border-color: #5cb531; cursor: default; pointer-events: none; }

.pagination li.prev a, .pagination li.next a { font-size: 14px; color: #FFFFFF; width: auto; background: #5cb531; padding: 0 10px; border-color: #5cb531; overflow: visible; }

@media screen and (max-width: 768px) { .pagination li.prev a i, .pagination li.next a i { display: none; } }

.pagination li.prev a:hover, .pagination li.next a:hover { opacity: .8; }

.pagination li.prev a:after { position: absolute; display: block; content: ""; top: -1px; left: -21px; width: 0; height: 0; border-style: solid; border-width: 20px 20px 20px 0; border-color: transparent #5cb531 transparent transparent; }

@media screen and (max-width: 640px) { .pagination li.prev a:after { left: -11px; border-width: 18px 10px 18px 0; } }

@media screen and (max-width: 768px) { .pagination li.prev a { padding-left: 2px; padding-right: 7px; } }

.pagination li.next a:after { position: absolute; display: block; content: ""; top: -1px; right: -21px; width: 0; height: 0; border-style: solid; border-width: 20px 0 20px 20px; border-color: transparent transparent transparent #5cb531; }

@media screen and (max-width: 640px) { .pagination li.next a:after { right: -11px; border-width: 18px 0 18px 10px; } }

@media screen and (max-width: 768px) { .pagination li.next a { padding-right: 2px; padding-left: 7px; } }

.columnBox { overflow: hidden; }

.columnBox > *:first-child { margin-top: 0; }

.columnBox + * { margin-top: 40px; }

@media screen and (max-width: 640px) { .imgArea, .textArea { margin-top: 20px; } }

.imgArea.left, .textArea.left { float: left; }

@media screen and (max-width: 640px) { .imgArea.left, .textArea.left { float: none; } }

.imgArea.right, .textArea.right { float: right; }

@media screen and (max-width: 640px) { .imgArea.right, .textArea.right { float: none; } }

.imgArea > *:first-child, .textArea > *:first-child { margin-top: 0; }

.imgArea { width: 400px; width: 39%; }

.imgArea p { text-align: center; }

@media screen and (max-width: 768px) { .imgArea { width: 41.5%; } }

@media screen and (max-width: 640px) { .imgArea { width: auto; margin-left: 15px; margin-right: 15px; } }

.textArea { width: 570px; width: 55.6%; }

@media screen and (max-width: 640px) { .textArea { width: auto; } }

p.caption { text-align: left; font-size: 16px; line-height: 140%; margin: 10px auto 0; }

@media screen and (max-width: 640px) { p.caption { text-align: center; font-size: 13px; } }

p.caption span { display: inline-block; font-size: 12px; margin-right: 1em; }

button { position: relative; display: block; text-align: center; padding: 15px 0; margin: 0 auto; color: #5cb531; border: 1px solid #5cb531; background: #FFFFFF; margin: 0 auto 0; min-width: 260px; max-width: 260px; font-size: 14px; letter-spacing: 0.05em; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

button[type="reset"] { background: #f2f2f2; border-color: #f2f2f2; }

button:before { position: absolute; top: 0; bottom: 0; right: 15px; margin: auto; content: ""; vertical-align: middle; width: 8px; height: 8px; border-top: 1px solid #5cb531; border-right: 1px solid #5cb531; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); zoom: 1; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

button:hover { text-decoration: none; color: #FFFFFF; background: #5cb531; }

button:hover:before { border-color: #FFFFFF; }

.btn { text-align: center; margin: 30px auto 0; position: relative; z-index: 1; }

@media screen and (max-width: 640px) { .btn { margin-top: 15px; } }

.btn a, .btn input { position: relative; display: block; text-align: center; padding: 17px 40px 17px 15px; color: #595959; background: #FFFFFF; border: 1px solid #5cb531; margin: 0 auto 0; width: 280px; font-size: 15px; letter-spacing: 0.05em; text-decoration: none; }

@media screen and (max-width: 640px) { .btn a, .btn input { padding: 10px 30px 10px 15px; } }

.btn a:before, .btn input:before { position: absolute; top: 0; bottom: 0; right: 20px; margin: auto; content: ""; vertical-align: middle; width: 10px; height: 10px; border-top: 2px solid #595959; border-right: 2px solid #595959; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); zoom: 1; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.btn a:hover, .btn input:hover { text-decoration: none; background: #5cb531; color: #FFFFFF; }

.btn a:hover:before, .btn input:hover:before { border-color: #FFFFFF; }

a.link { display: inline; text-decoration: underline; color: #5cb531; }

a.link:hover { text-decoration: none; }

.banner { margin: 40px auto; }

@media screen and (max-width: 1200px) { .banner { padding: 0 30px; } }

@media screen and (max-width: 768px) { .banner { margin: 30px auto; padding: 0 20px; } }

@media screen and (max-width: 640px) { .banner { margin: 20px auto; padding: 0 15px; } }

.selectContainer { display: inline-block; position: relative; }

.selectContainer:before { position: absolute; top: 0; bottom: 0; right: 15px; margin: auto; content: ""; vertical-align: middle; width: 8px; height: 8px; border-top: 1px solid #5cb531; border-right: 1px solid #5cb531; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); zoom: 1; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.list_point { margin-top: 20px; margin-bottom: 20px; text-align: left; }

.list_point li { position: relative; padding-left: 1em; line-height: 140%; margin-bottom: 0.5em; }

.list_point li:before { position: absolute; display: block; content: "●"; top: 0; left: 0; width: 1em; height: 1em; margin: auto; color: #5cb531; vertical-align: middle; line-height: 140%; }

.list_point.color li { padding-left: 1.3em; }

.list_point.color li:before { position: absolute; display: block; content: "◯"; font-weight: bold; color: #5cb531; }

.list_number { text-align: left; margin-top: 10px; margin-bottom: 10px; }

.list_number > li { position: relative; counter-increment: count; list-style-type: none; text-align: left; padding-left: 2.2em; }

.list_number > li:before { position: absolute; top: 0; left: 0; width: 1.5em; display: marker; content: "(" counter(count) ")"; text-align: right; line-height: 180%; }

.indent { text-align: left; margin-left: 1.0em; margin-bottom: 20px; }

.indent li { text-indent: -1.0em; }

.indent.ex { font-size: 12px; }

.bgBox + .indent { margin-top: 20px; }

.column05, .column04, .column03, .column02 { margin: 20px -10px; overflow: hidden; }

@media screen and (max-width: 640px) { .column05, .column04, .column03, .column02 { margin: 15px -8px; } }

.column05 > li, .column04 > li, .column03 > li, .column02 > li { float: left; margin: 0 10px 30px; overflow: hidden; }

@media screen and (max-width: 640px) { .column05 > li, .column04 > li, .column03 > li, .column02 > li { float: none; margin: 0 8px 30px; } }

.column05 > li .bgBox, .column04 > li .bgBox, .column03 > li .bgBox, .column02 > li .bgBox { padding: 20px; margin-top: 30px; }

.column05.slim, .column04.slim, .column03.slim, .column02.slim { margin: 20px 0; }

.column05.slim li, .column04.slim li, .column03.slim li, .column02.slim li { margin: 0 0 10px; }

.column05 > li .subHead, .column04 > li .subHead, .column03 > li .subHead { font-size: 22px; padding-bottom: 10px; margin-bottom: 20px; }

@media screen and (max-width: 640px) { .column05 > li .subHead, .column04 > li .subHead, .column03 > li .subHead { font-size: 17px; padding-bottom: 5px; margin-bottom: 15px; } }

.column05 > li { width: calc((100% - (20px * 5)) / 5); }

.column05.slim > li { width: calc(100% / 5); }

.column04 > li { width: calc((100% - (20px * 4)) / 4); }

.column04.slim > li { width: calc(100% / 4); }

.column03 > li { width: calc((100% - (20px * 3)) / 3); }

.column03.slim > li { width: calc(100% / 3); }

.column02 > li { width: calc((100% - (20px * 2)) / 2); }

.column02.slim > li { width: calc(100% / 2); }

@media screen and (max-width: 640px) { .column05 > li, .column04 > li { float: left; width: calc((100% - (16px * 2)) / 2); }
  .column05.slim > li, .column04.slim > li { float: left; width: calc(100% / 2); }
  .column03 > li, .column03.slim, .column02 > li, .column02.slim > li { width: auto; } }

.tableA { width: 100%; }

.head + .tableA, .subHead + .tableA, .ttl + .tableA, p + .tableA { margin-bottom: 40px; }

@media screen and (max-width: 640px) { .head + .tableA, .subHead + .tableA, .ttl + .tableA, p + .tableA { margin-bottom: 30px; } }

div + .tableA { margin-top: 40px; }

@media screen and (max-width: 640px) { div + .tableA { margin-top: 30px; } }

.tableA thead th { text-align: center; background: rgba(89, 89, 89, 0.9); color: #FFFFFF; font-size: 16px; padding: 10px 15px; white-space: nowrap; }

@media screen and (max-width: 640px) { .tableA thead th { font-size: 13px; padding: 7px 10px; } }

.tableA thead th.inherit { white-space: inherit; }

.tableA tbody th { white-space: nowrap; }

.tableA tbody th.inherit { white-space: inherit; }

.tableA tbody th span { display: inline-block; font-weight: normal; font-size: 90%; line-height: 140%; }

.tableA th, .tableA td { text-align: left; border: 1px solid #cccccc; background: #FFFFFF; padding: 15px; vertical-align: middle; }

@media screen and (max-width: 640px) { .tableA th, .tableA td { padding: 7px; } }

.tableA th { vertical-align: middle; background: #f2f2f2; }

@media screen and (max-width: 1024px) { .introductionList .imgArea { width: 570px; width: 55.6%; } }

@media screen and (max-width: 640px) { .introductionList .imgArea { width: auto; } }

@media screen and (max-width: 1024px) { .introductionList .textArea { width: 400px; width: 39%; } }

@media screen and (max-width: 640px) { .introductionList .textArea { width: auto; } }

#domestic dl dt, #overseas dl dt { position: relative; float: left; clear: both; padding-right: 1em; }

#domestic dl dt:after, #overseas dl dt:after { position: absolute; display: block; content: "："; top: 0; right: 0; width: 1em; height: 1em; }

#domestic dl dd, #overseas dl dd { float: left; margin-left: 0.5em; }

.downloadList li figure { max-width: 200px; margin: 0 auto; }

.downloadList li .btn a { line-height: 140%; }

@media screen and (max-width: 1024px) { .downloadList li .btn a { width: auto; } }

.formContainer { margin: 0 auto 20px; max-width: 800px; }

.formContainer .note textarea { width: 100%; height: 8em; }

dl.formList { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 100%; margin: 0 auto 30px; border-top: 1px solid #cccccc; }

@media screen and (max-width: 640px) { dl.formList { border-top: none; } }

dl.formList dt, dl.formList dd { text-align: left; padding: 15px 20px; border-bottom: 1px solid #cccccc; border-right: 1px solid #cccccc; background: #FFFFFF; }

@media screen and (max-width: 640px) { dl.formList dt, dl.formList dd { padding: 15px 10px; } }

dl.formList dt { width: 30%; vertical-align: bottom; background: #f2f2f2; border-left: 1px solid #cccccc; }

@media screen and (max-width: 640px) { dl.formList dt { width: 100%; padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #cccccc; } }

dl.formList dt i { font-size: 90%; }

dl.formList dt span { display: inline-block; font-size: 10px; color: #fc646d; border: 1px solid #fc646d; padding: 3px 5px; line-height: 100%; margin-left: 10px; background: #FFFFFF; }

dl.formList dd { width: 70%; }

@media screen and (max-width: 640px) { dl.formList dd { width: 100%; margin-left: 0; border-left: 1px solid #cccccc; margin-bottom: 20px; } }

dl.formList dd .ttl { display: block; padding-left: 0; border: none; font-size: 16px; font-weight: bold; margin-bottom: 10px; }

dl.formList dd span { margin-right: 1em; }

dl.formList dd .bg { display: none; background: #f0faeb; border: 1px solid #cccccc; padding: 1px 15px; margin: 10px 0; -moz-transition: 0.2s ease; -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; -ms-transition: 0.2s ease; transition: 0.2s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

dl.formList dd .bg.display { display: block; }

dl.formList dd .bg .em { font-size: 14px; margin-bottom: 10px; }

dl.formList dd .bg .em i { color: #fc646d; }

dl.formList dd input { width: 70%; }

dl.formList dd input[type=radio], dl.formList dd input[type=checkbox] { width: 0; }

dl.formList dd .ex { display: inline-block; margin: 0 10px; font-size: 12px; }

dl.formList dd .ex:first-child { margin-left: 0; }

dl.formList dd input + .ex { margin-left: 10px; }

dl.formList dd textarea + .ex { margin-top: 10px; }

.submitList { margin: 40px auto 0; text-align: center; max-width: 700px; }

@media screen and (max-width: 640px) { .submitList { max-width: 300px; } }

.submitList li { display: inline-block; *display: inline; *zoom: 1; vertical-align: top; width: 49%; }

@media screen and (max-width: 768px) { .submitList li { width: auto; margin: 20px; } }

.submitList li button[type="reset"] { color: #595959; }

.submitList li button[type="reset"]:before { border-color: #595959; }

.submitList li button[type="reset"]:hover { background: #dddddd; }

.videoFrame { position: relative; padding-bottom: 36%; max-width: 800px; margin: 0 auto; height: 0; overflow: hidden; }

@media screen and (max-width: 640px) { .videoFrame { padding-bottom: 50%; } }

.videoFrame iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

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