@charset "UTF-8";
/*
[base]base
==========================================================================
*/
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
/** 1. Change the default font family in all browsers (opinionated). 2. Prevent adjustments of font size after orientation changes in IE and iOS. */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/** Remove the margin in all browsers (opinionated). */
body { margin: 0; }

/* HTML5 display definitions
========================================================================== */
/** Add the correct display in IE 9-. 1. Add the correct display in Edge, IE, and Firefox. 2. Add the correct display in IE. */
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { /* 1 */ display: block; }

/** Add the correct display in IE 9-. */
audio, canvas, progress, video { display: inline-block; }

/** Add the correct display in iOS 4-7. */
audio:not([controls]) { display: none; height: 0; }

/** Add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress { vertical-align: baseline; }

/** Add the correct display in IE 10-. 1. Add the correct display in IE. */
template, [hidden] { display: none; }

/* Links
========================================================================== */
/** 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 */ }

/** Remove the outline on focused links when they are also active or hovered in all browsers (opinionated). */
a:active, a:hover { outline-width: 0; }

/* Text-level semantics
========================================================================== */
/** 1. Remove the bottom border in 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; }

/** Add the correct font style in Android 4.3-. */
dfn { font-style: italic; }

/** Correct the font size and margin on `h1` elements within `section` and `article` contexts in Chrome, Firefox, and Safari. */
h1 { font-size: 2em; margin: 0.67em 0; }

/** 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
========================================================================== */
/** Remove the border on images inside links in IE 10-. */
img { border-style: none; }

/** Hide the overflow in IE. */
svg:not(:root) { overflow: hidden; }

/* Grouping content
========================================================================== */
/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
code, kbd, pre, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/** 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 */ }

/* Forms
========================================================================== */
/** 1. Change font properties to `inherit` in all browsers (opinionated). 2. Remove the margin in Firefox and Safari. */
button, input, select, textarea { font: inherit; /* 1 */ margin: 0; /* 2 */ }

/** Restore the font weight unset by the previous rule. */
optgroup { font-weight: bold; }

/** 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"], [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; }

/** Change the border, margin, and padding in all browsers (opinionated). */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 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 */ }

/** 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 OS X. */
[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Correct the text style of placeholders in Chrome, Edge, and Safari. */
::-webkit-input-placeholder { color: inherit; opacity: 0.54; }

/** 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 */ }

/* 
[base]html_element
==========================================================================
*/
body { font-size: 16px; line-height: 1.6; color: #000; font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif; background-color: #fff; }
body:after { content: ""; clear: both; display: block; }

nav ul, nav ol { margin: 0; padding: 0; list-style: none; }
nav li, nav dt, nav dd { margin: 0; padding: 0; }
nav a { line-height: 1; text-decoration: none; }

h1:after, h2:after, h3:after, h4:after, h5:after, h6:after { content: ""; clear: both; display: block; }

h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0; }

p { margin: 0; }

small { font-size: 75%; }

img { vertical-align: bottom; }

@media screen and (max-width: 768px) { img { max-width: 100%; height: auto; } }
a, a:hover, a:visited, a:active, a:focus { text-decoration: none; }

a img:hover { opacity: 0.6; }

table { border-collapse: collapse; border-spacing: 0; }

th { text-align: left; }

caption { padding: 0.5em; }

label, input, textarea, select { box-sizing: content-box; }

label { cursor: pointer; padding: 4px; display: inline-block; }

[type="text"], [type="tel"], [type="password"], [type="email"], [type="number"], textarea, select { font-size: 16px; border-radius: 4px; border: 1px solid #999; margin: 2px; }

[type="text"], [type="tel"], [type="password"], [type="email"], [type="number"], select, [type="button"], [type="submit"], [type="reset"] { height: 28px; line-height: 28px; padding: 2px 6px; }

textarea { padding: 6px 8px; }

[type="text"], [type="tel"], [type="password"], [type="email"], [type="number"], textarea { box-shadow: inset 1px 1px 1px rgba(50, 50, 50, 0.2); }

[type="checkbox"], [type="radio"], select { cursor: pointer; margin-right: 4px; }

[type="checkbox"], [type="radio"] { display: inline-block; }

[type="button"], [type="submit"], [type="reset"] { cursor: pointer; }

/*
[layout][siteframe]site
==========================================================================
*/
.site, .site-top, .site-middle, .site-bottom, .site-header, .header-top, .header-middle, .header-bottom, .site-main, .main-top, .main-middle, .main-bottom, .site-footer, .footer-top, .footer-middle, .footer-bottom { clear: both; }
.site:after, .site-top:after, .site-middle:after, .site-bottom:after, .site-header:after, .header-top:after, .header-middle:after, .header-bottom:after, .site-main:after, .main-top:after, .main-middle:after, .main-bottom:after, .site-footer:after, .footer-top:after, .footer-middle:after, .footer-bottom:after { content: ""; clear: both; display: block; }

.site-header { background: url(/_asset/images/global/bg/body_bg.png) repeat-x top left; background-size: contain; padding-top: 20px; }
@media screen and (max-width: 480px) { .site-header { background: url(/_asset/images/global/bg/body_bg_mb.png) repeat-x top left; background-size: contain; padding-top: 20px; } }

.site-footer { background: url(/_asset/images/global/bg/body_bg.png) repeat-x bottom left; background-size: contain; padding-bottom: 5px; }
@media screen and (max-width: 480px) { .site-footer { background: url(/_asset/images/global/bg/body_bg_mb.png) repeat-x bottom left; background-size: contain; padding-bottom: 5px; } }

/*
[layout][siteframe]site_width
==========================================================================
*/
.site_width { box-sizing: content-box; width: 1200px; margin: 0 auto; }
.site_width:after { content: ""; clear: both; display: block; }
.site_width.site_width-1000 { width: 1000px; }

@media screen and (max-width: 1200px) { .site_width { box-sizing: border-box; width: auto; padding: 0 10px; } }
@media screen and (max-width: 1080px) { .site_width.site_width-1000 { width: auto; } }
/*
[layout]grid
==========================================================================
*/
/*
GRID
--------------------------------------------------
* 最大有効幅： 1040px
* カラム分割数： 12分割
* 余白（ガター）： 40px

### カラム
*/
/* 1カラム ： 50px */
/* 2カラム ： 140px */
/* 3カラム ： 230px */
/* 4カラム ： 320px */
/* 5カラム ： 410px */
/* 6カラム ： 500px */
/* 7カラム ： 590px */
/* 8カラム ： 680px */
/* 9カラム ： 770px */
/* 10カラム ： 860px */
/* 11カラム ： 950px */
/* 12カラム ： 1040px */
/*
CLASS
--------------------------------------------------
* container： `.g-container`
* row： `.g-row`
* col： `.g-col-[数字]`
* push： `.g-push-[数字]`
* pull： `.g-pull-[数字]`
*/
/*
RESPONSIVE
--------------------------------------------------
*/
/*
### containerのフルード化
* 下側【ON】：　画面幅768px以下／ガター上書：20px
* 上側【ON】：　画面幅1600px以上／ガター上書：60px

### ブレイクポイント指定によるスクリーン
*/
/* スクリーン7 960px */
/* スクリーン6 768px */
/* スクリーン5 667px */
/* スクリーン4 600px */
/* スクリーン3 480px */
/* スクリーン2 414px */
/* スクリーン1 320px */
/*
`.g-container`と`.g-row`
--------------------------------------------------
*/
.g-container { width: 1040px; margin-left: auto; margin-right: auto; overflow: hidden; }
.g-container .g-row { display: flex; flex-wrap: wrap; clear: both; max-width: 1080px; margin-left: -20px; margin-right: -20px; }
.g-container .g-row:after { content: ""; clear: both; display: block; }

/*
### 画面幅が狭い方でのフルード有効時のカラムの親ボックスのフルード設定
*/
@media screen and (max-width: 768px) { .g-container { width: auto; max-width: 100%; }
  .g-container .g-row { margin-left: -10px; margin-right: -10px; } }
/*
### 画面幅が狭い方でのフルード有効時のカラムの親ボックスのフルード設定
*/
@media screen and (min-width: 1600px) { .g-container { width: auto; max-width: 100%; }
  .g-container .g-row { max-width: 200%; margin-left: -30px; margin-right: -30px; } }
/*
カラム
--------------------------------------------------
*/
.g-container .g-col-1 { position: relative; float: left; width: 8.3334%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-1 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-2 { position: relative; float: left; width: 16.6667%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-2 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-3 { position: relative; float: left; width: 25%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-3 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-4 { position: relative; float: left; width: 33.3334%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-4 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-5 { position: relative; float: left; width: 41.6667%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-5 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-6 { position: relative; float: left; width: 50%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-6 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-7 { position: relative; float: left; width: 58.3334%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-7 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-8 { position: relative; float: left; width: 66.6667%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-8 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-9 { position: relative; float: left; width: 75.0001%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-9 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-10 { position: relative; float: left; width: 83.3334%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-10 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-11 { position: relative; float: left; width: 91.6667%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-11 .g-row { margin-left: -20px; margin-right: -20px; }
.g-container .g-col-12 { position: relative; float: left; width: 100%; padding-left: 20px; padding-right: 20px; }
.g-container .g-col-12 .g-row { margin-left: -20px; margin-right: -20px; }

/*
### 画面幅が狭い方でのフルード有効時のカラムのガター設定
*/
@media screen and (max-width: 768px) { .g-container .g-col-1 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-1 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-2 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-2 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-3 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-3 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-4 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-4 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-5 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-5 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-6 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-6 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-7 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-7 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-8 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-8 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-9 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-9 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-10 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-10 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-11 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-11 .g-row { margin-left: -10px; margin-right: -10px; } }
@media screen and (max-width: 768px) { .g-container .g-col-12 { padding-left: 10px; padding-right: 10px; }
  .g-container .g-col-12 .g-row { margin-left: -10px; margin-right: -10px; } }

/*
### 画面幅が広い方でのフルード有効時のカラムのガター設定
*/
@media screen and (min-width: 1600px) { .g-container .g-col-1 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-1 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-2 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-2 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-3 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-3 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-4 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-4 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-5 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-5 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-6 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-6 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-7 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-7 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-8 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-8 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-9 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-9 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-10 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-10 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-11 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-11 .g-row { margin-left: -30px; margin-right: -30px; } }
@media screen and (min-width: 1600px) { .g-container .g-col-12 { padding-left: 30px; padding-right: 30px; }
  .g-container .g-col-12 .g-row { margin-left: -30px; margin-right: -30px; } }

/*
カラムの右移動
--------------------------------------------------
*/
.g-container .g-row > .g-push-1 { left: 8.3334%; }
.g-container .g-row > .g-push-2 { left: 16.6667%; }
.g-container .g-row > .g-push-3 { left: 25%; }
.g-container .g-row > .g-push-4 { left: 33.3334%; }
.g-container .g-row > .g-push-5 { left: 41.6667%; }
.g-container .g-row > .g-push-6 { left: 50%; }
.g-container .g-row > .g-push-7 { left: 58.3334%; }
.g-container .g-row > .g-push-8 { left: 66.6667%; }
.g-container .g-row > .g-push-9 { left: 75.0001%; }
.g-container .g-row > .g-push-10 { left: 83.3334%; }
.g-container .g-row > .g-push-11 { left: 91.6667%; }
.g-container .g-row > .g-push-12 { left: 100%; }

/*
カラムの左移動
--------------------------------------------------
*/
.g-container .g-row > .g-pull-1 { right: 8.33333%; }
.g-container .g-row > .g-pull-2 { right: 16.66667%; }
.g-container .g-row > .g-pull-3 { right: 25%; }
.g-container .g-row > .g-pull-4 { right: 33.33333%; }
.g-container .g-row > .g-pull-5 { right: 41.66667%; }
.g-container .g-row > .g-pull-6 { right: 50%; }
.g-container .g-row > .g-pull-7 { right: 58.33333%; }
.g-container .g-row > .g-pull-8 { right: 66.66667%; }
.g-container .g-row > .g-pull-9 { right: 75%; }
.g-container .g-row > .g-pull-10 { right: 83.33333%; }
.g-container .g-row > .g-pull-11 { right: 91.66667%; }
.g-container .g-row > .g-pull-12 { right: 100%; }

/*
GRID
--------------------------------------------------
* 最大有効幅： 1040px
* カラム分割数： 12分割
* 余白（ガター）： 40px

### カラム
*/
/* 1カラム ： 50px */
/* 2カラム ： 140px */
/* 3カラム ： 230px */
/* 4カラム ： 320px */
/* 5カラム ： 410px */
/* 6カラム ： 500px */
/* 7カラム ： 590px */
/* 8カラム ： 680px */
/* 9カラム ： 770px */
/* 10カラム ： 860px */
/* 11カラム ： 950px */
/* 12カラム ： 1040px */
/*
CLASS
--------------------------------------------------
* container： `.g-container`
* row： `.g-row`
* col： `.g-col-[数字]`
* push： `.g-push-[数字]`
* pull： `.g-pull-[数字]`
*/
/*
RESPONSIVE
--------------------------------------------------
*/
/*
### containerのフルード化
* 下側【ON】：　画面幅768px以下／ガター上書：20px
* 上側【ON】：　画面幅1600px以上／ガター上書：60px

### ブレイクポイント指定によるスクリーン
*/
/* スクリーン7 960px */
/* スクリーン6 768px */
/* スクリーン5 667px */
/* スクリーン4 600px */
/* スクリーン3 480px */
/* スクリーン2 414px */
/* スクリーン1 320px */
/* 
ブロックオプション
--------------------------------------------------
*/
/* .sc7 960px */
/* .sc6 768px */
/* .sc5 667px */
/* .sc4 600px */
/* .sc3 480px */
/* .sc2 414px */
/* .sc1 320px */
@media screen and (min-width: 961px) { .g-container > .sc8-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc8-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc8-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc8-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc8-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc8-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc8-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc8-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc8-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc8-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc8-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc8-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc7-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc7-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 960px) { .g-container > .sc7-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc7-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc7-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc7-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc7-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc7-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc7-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc7-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc7-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc7-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc7-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc7-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc7-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc7-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 768px) { .g-container > .sc6-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc6-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc6-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc6-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc6-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc6-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc6-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc6-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc6-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc6-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc6-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc6-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc6-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc6-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 667px) { .g-container > .sc5-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc5-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc5-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc5-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc5-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc5-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc5-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc5-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc5-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc5-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc5-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc5-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc5-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc5-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 600px) { .g-container > .sc4-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc4-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc4-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc4-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc4-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc4-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc4-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc4-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc4-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc4-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc4-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc4-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc4-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc4-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 480px) { .g-container > .sc3-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc3-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc3-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc3-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc3-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc3-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc3-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc3-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc3-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc3-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc3-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc3-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc3-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc3-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 414px) { .g-container > .sc2-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc2-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc2-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc2-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc2-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc2-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc2-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc2-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc2-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc2-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc2-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc2-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc2-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc2-b'] [class*='g-pull-'] { right: auto; } }
@media screen and (max-width: 320px) { .g-container > .sc1-b1 [class^='g-col-'] { width: 100%; }
  .g-container > .sc1-b2 [class^='g-col-'] { width: 50%; }
  .g-container > .sc1-b3 [class^='g-col-'] { width: 33.33333%; }
  .g-container > .sc1-b4 [class^='g-col-'] { width: 25%; }
  .g-container > .sc1-b5 [class^='g-col-'] { width: 20%; }
  .g-container > .sc1-b6 [class^='g-col-'] { width: 16.66667%; }
  .g-container > .sc1-b7 [class^='g-col-'] { width: 14.28571%; }
  .g-container > .sc1-b8 [class^='g-col-'] { width: 12.5%; }
  .g-container > .sc1-b9 [class^='g-col-'] { width: 11.11111%; }
  .g-container > .sc1-b10 [class^='g-col-'] { width: 10%; }
  .g-container > .sc1-b11 [class^='g-col-'] { width: 9.09091%; }
  .g-container > .sc1-b12 [class^='g-col-'] { width: 8.33333%; }
  .g-container [class*='sc1-b'] [class*='g-push-'] { left: auto; }
  .g-container [class*='sc1-b'] [class*='g-pull-'] { right: auto; } }

/* 
[module]element
==========================================================================*/
.heading-blue { color: #00aba7; font-size: 40px; line-height: 1.2; }

.heading-black { font-size: 30px; line-height: 1.2; }

@media (max-width: 479px) { .heading-blue { font-size: 20px; }
  .heading-black { font-size: 15px; } }
.text_box:after { content: ""; clear: both; display: block; }
.text_box > p { margin-top: 1.3em; }
.text_box > p:first-child { margin-top: 0.5em; }

.copy-catch_copy { margin: 0; padding: 0; font-size: 100%; font-weight: normal; font-size: 36px; color: #555577; }
.copy-catch_copy:after { content: ""; clear: both; display: block; }

.copy-read_copy { margin: 0; padding: 0; font-size: 100%; font-weight: normal; line-height: 2.0; }
.copy-read_copy:after { content: ""; clear: both; display: block; }
.copy-read_copy p { margin-top: 1em; }
.copy-read_copy p:first-child { margin-top: 0; }

.copy-catch_copy + .copy-read_copy { margin-top: 2em; }

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

a.link { color: #2222ff; }

a.link:hover { opacity: 0.7; }

a[class^="link_btn"] { position: relative; display: inline-block; padding: 1.0em 2em 1.0em 2em; background-color: #fff; border: 1px solid #ddd; border-radius: 6px; color: #f7f7f7; font-size: 20px; line-height: 1.2; text-align: center; text-decoration: none; }
a[class^="link_btn"] .text { display: inline-block; padding-top: 0.2em; }

a[class^="link_btn"]:hover { background-color: #eee; }

.link_btn-next .icon { position: absolute; top: 50%; right: 0.7em; margin-top: -0.5em; }

.link_btn-prev .icon { position: absolute; top: 50%; left: 0.7em; margin-top: -0.5em; }

.link_btn-fluid { min-width: 100%; }

.icon + .text { margin-left: 0.5em; }

.text + .icon { margin-left: 0.8em; }

.icon.icon-l, .icon.icon-c, .icon.icon-r { margin: 0; position: absolute; top: 50%; margin-top: -0.5em; }

.icon.icon-l { left: 1.3em; }

.icon.icon-c { left: 50%; }

.icon.icon-r { right: 1.3em; }

.icon.icon-t, .icon.icon-m, .icon.icon-b { margin: 0; position: absolute; }

.icon-t { top: 1em; }

.icon-m { top: 50%; margin-top: -0.5em; }

.icon-b { bottom: 1em; }

.list { margin: 0; padding: 0; line-height: 1; }
.list * { margin: 0; padding: 0; }

ol.list, ul.list { padding-left: 20px; }
ol.list .list, ul.list .list { padding-top: 0.5em; }
ol.list li, ul.list li { padding: 0.5em 0em; }

* + .list { margin-top: 1em; }

.table th, .table td { margin: 0; padding: 1.0em; border: 1px solid #ddd; }
.table thead th, .table thead td { background-color: #f7f7f7; }
.table thead th { background-color: #f7f7f7; }
.table tbody th { background-color: #f7f7f7; }

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

.form-actions:after { content: ""; clear: both; display: block; }

.btn, a.btn { color: #111; display: inline-block; height: auto; width: auto; background: #eee; border: 1px solid #aaa; cursor: pointer; text-decoration: none; padding: 0.5em 1.5em; border-radius: 4px; }
.btn:hover, a.btn:hover { opacity: 0.6; }
.btn.is-disabled, a.btn.is-disabled { cursor: not-allowed !important; }

.label { font-size: 14px; display: inline-block; padding: 0px 8px; background-color: #eee; border-radius: 4px; border: 1px solid #ccc; margin-right: 8px; }

/*
[module][site]header
==========================================================================*/
.header_appearance { padding: 10px; background-color: #fff; }
.header_appearance:after { content: ""; clear: both; display: block; }

.header_branding { float: left; margin-right: 30px; }
.header_branding:after { content: ""; clear: both; display: block; }

.header_branding-title { line-height: 1; margin: 0; padding: 0; font-size: 14px; text-align: left; }
@media screen and (max-width: 768px) { .header_branding-title { padding-right: 50px; } }
@media screen and (max-width: 480px) { .header_branding-title { display: none; } }

.header_branding-logo { float: left; margin-right: 14px; margin-top: 2px; }

@media screen and (max-width: 480px) { .header_branding-logo { margin-top: -20px; }
  .header_branding-logo img { width: 80%; } }
.header_branding-name { line-height: 1; margin: 0; padding: 0; float: left; color: #111; font-size: 18px; margin-top: 10px; }

.header_branding-tel { line-height: 1; margin: 0; padding: 0; float: left; color: #111; margin: 10px 0 0 120px; text-align: left; }
@media screen and (max-width: 1024px) { .header_branding-tel { margin: 10px 0 11px 0px; } }
@media screen and (max-width: 480px) { .header_branding-tel { display: none; } }
.header_branding-tel .info { font-size: 12px; }
.header_branding-tel .tel { background: url(/_asset/images/frame/header/hd_freedial_logo.png) no-repeat center left; padding-left: 50px; font-size: 32px; /*@media screen and (max-width:480px){
	font-size: 22px;
	margin-top: 7px;
}*/ }

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

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

.header_contact_info-dial:after { content: ""; clear: both; display: block; }

.header_contact_info-mail:after { content: ""; clear: both; display: block; }

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

.header_tagline { padding: 5px; background: none; margin-bottom: 15px; }
.header_tagline:after { content: ""; clear: both; display: block; }
@media screen and (max-width: 480px) { .header_tagline { margin-bottom: 0; } }

/*
[module][site]footer
==========================================================================*/
.footer_appearance { background-color: #F0EDDF; border-top: solid 1px #CCCCCC; padding-bottom: 15px; }
.footer_appearance:after { content: ""; clear: both; display: block; }

.btnWrap { margin-bottom: 60px; }

.contactBtn { width: 620px; margin: 25px auto; }

@media screen and (max-width: 640px) { .btnWrap { margin-bottom: 60px; }
  .contactBtn { width: 100%; margin: 25px auto; }
  .contactBtn img { width: 100%; } }
.housemaker_list { margin-bottom: 60px; }
.housemaker_list h2 { margin-bottom: 45px; }
@media screen and (max-width: 1199px) { .housemaker_list h2 img { width: 100%; } }
.housemaker_list ul { margin-bottom: 40px; }
.housemaker_list ul:after { content: ""; clear: both; display: block; }
.housemaker_list ul li { width: 25%; float: left; margin-bottom: 15px; }
.housemaker_list ul li a { width: 100%; text-align: center; }
.housemaker_list ul li a img { width: 98%; }
@media screen and (max-width: 480px) { .housemaker_list ul li { float: none; width: 100%; } }
.housemaker_list .coordinator { width: 25%; margin: 0 auto; text-align: center; }
.housemaker_list .coordinator a { width: 100%; text-align: center; }
.housemaker_list .coordinator a img { width: 98%; }
@media screen and (max-width: 480px) { .housemaker_list .coordinator { float: none; width: 100%; } }

.footer_sitemap { border-bottom: solid 1px #CCC; padding: 25px 0; margin-bottom: 50px; }
.footer_sitemap:after { content: ""; clear: both; display: block; }
@media screen and (max-width: 768px) { .footer_sitemap { margin-bottom: 25px; } }

.footer_sitemap-title { font-size: 20px; }

.footer_sitemap-list:after { content: ""; clear: both; display: block; }

.footer_sitemap-list > li { float: left; margin-right: 60px; }
.footer_sitemap-list > li a { color: #333; font-weight: normal; text-decoration: none; }
@media screen and (max-width: 768px) { .footer_sitemap-list > li { width: 33%; margin-right: 0; margin-bottom: 15px; font-size: 110%; } }
@media screen and (max-width: 480px) { .footer_sitemap-list > li { width: 50%; } }

.footer_sitemap a:hover { color: #5D5DB8; }

.footer_branding { margin-bottom: 35px; }
.footer_branding:after { content: ""; clear: both; display: block; }

.footer_branding-logo { float: left; margin-right: 42px; }
@media screen and (max-width: 768px) { .footer_branding-logo { margin-bottom: 20px; float: none; } }

.footer_branding-name { float: left; margin-top: 5px; }

.footer_branding-description { clear: both; padding-top: 10px; }

.footer_contact_info-dial { max-width: 528px; float: left; }
@media screen and (max-width: 768px) { .footer_contact_info-dial { float: none; width: 100%; }
  .footer_contact_info-dial img { width: 100%; } }

.footer_tagline { padding: 5px; background-color: #333; }
.footer_tagline:after { content: ""; clear: both; display: block; }

.footer_copyright { color: #333; text-align: center; font-size: 14px; }

/*
[module]navigation
==========================================================================*/
.gnav-main { background-color: none; margin-bottom: 30px; }
.gnav-main:after { content: ""; clear: both; display: block; }
@media screen and (max-width: 768px) { .gnav-main { display: none; } }

.gnav-main-list { display: table; table-layout: fixed; width: 100%; border: solid 2px #888888; border-radius: 6px; padding: 7px 0; }

.gnav-main-list > li { display: table-cell; border-left: 1px solid #888888; }
.gnav-main-list > li > a { text-align: center; color: #404949; display: block; font-size: 16px; /*height: 45px;*/ /*line-height: 45px;*/ padding: 4px 0; }
.gnav-main-list > li > a .icon { color: #999; margin-left: 10px; }
.gnav-main-list > li > a span { display: block; }
.gnav-main-list > li > a .en { font-size: 10px; margin-top: 4px; color: #008C81; font-weight: normal; }
.gnav-main-list > li > a:hover { background: #D8E8E4; color: #008C81; }

.gnav-main-list > li:first-child { border-left: none; }

.gnav-main-list > li:hover { color: #111; background-color: #fff; }

.gnav-sub { float: left; }
.gnav-sub:after { content: ""; clear: both; display: block; }
@media screen and (max-width: 768px) { .gnav-sub { display: none; } }

.gnav-sub-list { margin-top: 6px; }

.gnav-sub-list > li { float: left; padding-right: 10px; }
.gnav-sub-list > li > a { display: block; padding: 4px 10px; }
.gnav-sub-list > li > a:hover { color: #555; }

.gnav-function { float: right; }
.gnav-function:after { content: ""; clear: both; display: block; }
@media screen and (max-width: 1190px) { .gnav-function { float: left; margin: 10px 0 15px 0; } }

.gnav-function-list > li { float: left; }
.gnav-function-list > li + li { margin-left: 12px; }
.gnav-function-list > li > a { font-size: 16px; width: 150px; padding: 2px; display: block; height: 62px; line-height: 60px; background-color: #f7f7f7; color: #111; text-align: center; }
.gnav-function-list > li > a span { display: block; border: 1px solid #FFF; }

.gnav-function-list > li.list01 > a { display: block; background-color: #D7006C; color: #FFF; }
.gnav-function-list > li.list01 > a:hover { background-color: #FFBFDE; }

.gnav-function-list > li.list02 > a { display: block; background-color: #5EAD22; color: #FFF; }
.gnav-function-list > li.list02 > a:hover { background-color: #B9EA95; }

.gnav-mobile_menu { position: fixed; top: 0; left: 25%; width: 75%; background: #fff; opacity: 0; transition-property: opacity; transition-duration: 0.3s; transition-delay: 0.3s; z-index: -100; margin-bottom: -999999px; padding-bottom: 999999px; }

.gnav-mobile_menu-title { color: #fff; background-color: #ffcc00; }

.gnav-mobile_menu-list { list-style: none; }

.gnav-mobile_menu-list > li { border-bottom: 1px solid #ccc; line-height: 1; }
.gnav-mobile_menu-list > li:first-child { border-top: 1px solid #ccc; background: #FF933D; }
.gnav-mobile_menu-list > li:nth-child(2) { background: #FFD200; }
.gnav-mobile_menu-list > li:nth-child(3) { background: #46BA60; }
.gnav-mobile_menu-list > li:nth-child(4) { background: #008c81; }
.gnav-mobile_menu-list > li:nth-child(5) { background: #56adc3; }
.gnav-mobile_menu-list > li:nth-child(6) { background: #7587DB; }
.gnav-mobile_menu-list > li:nth-child(7) { background: #D7006C; }
.gnav-mobile_menu-list > li:nth-child(8) { background: #5EAD22; border-bottom: 1px solid #ffffff; }
.gnav-mobile_menu-list > li > a { display: block; padding: 15px 15px 15px 20px; color: #FFF; font-size: 16px; }
.gnav-mobile_menu-list > li > a:hover { opacity: 0.6; }

.gnav-mobile_menu-list > li.is-active { position: relative; }
.gnav-mobile_menu-list > li.is-active:before { content: ''; position: absolute; top: 50%; left: 8px; display: inline-block; margin-top: -0.5em; border: 0.5em solid transparent; border-left: 0.5em solid #408f89; }

.gnav-mobile_menu-switch { position: absolute; top: 30px; right: 12px; width: 42px; background-color: #eee; z-index: 100; display: none; }
.gnav-mobile_menu-switch > a { position: relative; display: block; width: 42px; height: 42px; border: 1px solid #333; box-shadow: inset 0 0 0 2px #fff; }
.gnav-mobile_menu-switch .gnav-mobile_menu-border { position: absolute; left: 50%; display: block; width: 20px; height: 4px; margin-left: -10px; background: #D8E8E4; }
.gnav-mobile_menu-switch .gnav-mobile_menu-border.border-1 { top: 10px; background: #5EAD22; }
.gnav-mobile_menu-switch .gnav-mobile_menu-border.border-2 { top: 18px; background: #5EAD22; }
.gnav-mobile_menu-switch .gnav-mobile_menu-border.border-3 { top: 26px; background: #5EAD22; }

@media screen and (max-width: 768px) { .gnav-mobile_menu-switch { display: block; } }
.site { position: relative; left: 0; top: 0; transition-property: left; transition-duration: 0.3s; }

body.is-open .site { left: -75%; }
body.is-open .gnav-mobile_menu { opacity: 1; z-index: 9999; }

.lnav { min-width: 270px; padding: 20px; font-size: 14px; line-height: 1.4; background-color: #eee; }
.lnav:after { content: ""; clear: both; display: block; }

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

.scroll_top-fixed { color: #fff; display: none; position: fixed; right: 20px; bottom: 20px; display: block; width: 50px; height: 50px; color: #fff; font-size: 24px; text-align: center; line-height: 50px; background-color: #555; z-index: 999999; }

.scroll_top-fixed:hover { color: #ccc; }

.dropdown { position: relative; }
.dropdown:hover .dropdown-list { display: block; position: absolute; z-index: 2; }

.dropdown-list { display: none; position: absolute; z-index: 5; padding: 1.0em 0 1.0em 0; background-color: #fff; border: solid 1px #999; width: 370px; right: 0; margin-top: -1px; margin-right: -1px; box-shadow: 0 2px 0px 14px rgba(20, 20, 20, 0.1); }

.dropdown-list > li > a { color: #333; display: block; width: 91%; margin: 0 auto; position: relative; padding: 1.1em 2.0em 1.1em 1.8em; border: 1px solid #fff; }
.dropdown-list > li > a .icon:first-child { color: #16a49d; }
.dropdown-list > li > a:hover { border: 1px solid #999; }

/* 
[module]contents
==========================================================================*/
.page_heading { padding: 60px 0; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #eee; }

.page_heading-title { color: #537879; line-height: 1; text-align: center; font-size: 30px; }

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

.page_heading-home { padding: 60px 0; border-bottom: 1px solid #ccc; }

.page_heading-home-title { color: #537879; line-height: 1; text-align: center; }
@media screen and (max-width: 768px) { .page_heading-home-title { font-size: 30px; line-height: 1.4; } }

.page_heading-home-description { text-align: center; }
.page_heading-home-description p { line-height: 1.8; }
.page_heading-home-description p + p { margin-top: 20px; }
@media screen and (max-width: 768px) { .page_heading-home-description { text-align: left; } }

.main_visual { position: relative; text-align: center; }
.main_visual:after { content: ""; clear: both; display: block; }
@media screen and (max-width: 1199px) { .main_visual img { width: 100%; } }

.main_visual_carousel-js { text-align: center; }
.main_visual_carousel-js:after { content: ""; clear: both; display: block; }

.main_visual_carousel-js .swiper-container .pagination { margin-top: 20px; }
.main_visual_carousel-js .swiper-container .pagination .swiper-pagination-bullet { width: 16px; height: 16px; margin: 0 5px; border: 1px solid #fff; background-color: #aaa; opacity: 1; }
.main_visual_carousel-js .swiper-container .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #555; border: 1px solid #ccc; opacity: 1; }
.main_visual_carousel-js .controller { position: relative; }
.main_visual_carousel-js .controller .prev, .main_visual_carousel-js .controller .next { position: absolute; cursor: pointer; bottom: 0px; z-index: 2; }
.main_visual_carousel-js .controller .prev { left: 0; /*.icon*/ /*.icon*/ }
.main_visual_carousel-js .controller .prev .is-mb { display: none; }
.main_visual_carousel-js .controller .next { right: 0; /*.icon*/ /*.icon*/ }
.main_visual_carousel-js .controller .next .is-mb { display: none; }

.main_visual_carousel_wide-js { background-color: #998E7D; padding: 40px 0; text-align: center; min-height: 300px; }
.main_visual_carousel_wide-js:after { content: ""; clear: both; display: block; }

.main_visual_carousel_wide-js .swiper-container .swiper-wrapper .swiper-slide { max-width: 960px; height: auto; }
.main_visual_carousel_wide-js .swiper-container .swiper-wrapper .swiper-slide a { display: block; }
.main_visual_carousel_wide-js .swiper-container .pagination-wide { margin-top: 20px; }
.main_visual_carousel_wide-js .swiper-container .pagination-wide .swiper-pagination-bullet { width: 16px; height: 16px; margin: 0 5px; border: 1px solid #fff; background-color: #aaa; opacity: 1; }
.main_visual_carousel_wide-js .swiper-container .pagination-wide .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #555; border: 1px solid #ccc; opacity: 1; }
.main_visual_carousel_wide-js .controller { position: relative; }
.main_visual_carousel_wide-js .controller .prev-wide, .main_visual_carousel_wide-js .controller .next-wide { position: absolute; cursor: pointer; bottom: 0px; z-index: 2; }
.main_visual_carousel_wide-js .controller .prev-wide { left: 0; /*.icon*/ /*.icon*/ }
.main_visual_carousel_wide-js .controller .prev-wide .is-mb { display: none; }
.main_visual_carousel_wide-js .controller .next-wide { right: 0; /*.icon*/ /*.icon*/ }
.main_visual_carousel_wide-js .controller .next-wide .is-mb { display: none; }

.panel { position: relative; background-color: #fdfdfd; border: solid 1px #ccc; border-radius: 8px; overflow: hidden; margin-top: 35px; }

.panel-header { padding: 0.8em 1.0em; background-color: #ccc; border-radius: 8px 8px 0 0; }
.panel-header > * { margin: 0; padding: 0; }

.panel-main { padding: 20px; background-color: #fdfdfd; }

.panel-footer { padding: 0px 1.0em 1.0em 1.0em; }
.panel-footer a[class^=link-btn] { width: 100%; }

.panel-title { margin: 0; padding: 0; color: #333; font-size: 20px; font-weight: normal; line-height: 1; text-align: center; }

.demo_section { margin-top: 60px; }

.demo_section-header .heading { margin: 10px 0; }

.demo_section-main .message { margin: 20px 0; }

.demo_section-footer { padding: 1em; border: 1px solid #ddd; }
.demo_section-footer .heading { margin-top: 2em; margin-bottom: 0; padding-left: 8px; border-left: 5px solid; }
.demo_section-footer textarea { width: 99%; height: 20em; margin-top: 15px; }

.access-train_info { margin-top: 59px; }
.access-train_info .left { width: 49%; }
.access-train_info .right { width: 38%; }
.access-train_info .left img, .access-train_info .right img { max-width: 100%; }

@media (max-width: 767px) { .access-train_info .left, .access-train_info .right { float: none; width: 100%; text-align: center; }
  .access-train_info .right { margin-top: 30px; } }
@media (max-width: 479px) { .access-train_info { margin-top: 20px; } }
.access-bus_info { padding: 20px 0 20px 110px; border-bottom: 1px solid #ccc; }
.access-bus_info:first-child { border-top: 1px solid #ccc; }
.access-bus_info .left, .access-bus_info .right { width: 50%; }
.access-bus_info .left { font-size: 24px; }
.access-bus_info .right table { width: 100%; table-layout: fixed; }
.access-bus_info .right table th, .access-bus_info .right table td { padding: 15px; border: 1px solid #ccc; }
.access-bus_info .right table th { width: 34%; background: #f3fcf9; font-weight: normal; }

@media (max-width: 767px) { .access-bus_info { padding: 20px 0; }
  .access-bus_info .left, .access-bus_info .right { float: none; width: 100%; } }
@media (max-width: 479px) { .access-bus_info { padding: 10px 0; }
  .access-bus_info .left { font-size: 18px; }
  .access-bus_info .right table th, .access-bus_info .right table td { padding: 8px; }
  .access-bus_info .right table th { width: 5em; } }
.concept:after { content: ""; clear: both; display: block; }

.concept-body:after { content: ""; clear: both; display: block; }

.page_heading { background: #FFF; text-align: center; border: none; }
.page_heading .page_heading-header { margin-bottom: 50px; }
.page_heading .page_heading-body h2 { font-size: 25px; line-height: 1.5; font-weight: bold; margin-bottom: 30px; text-align: center; }
.page_heading .page_heading-body .catch_add { margin-bottom: 50px; }

.concept .concept_article { margin-bottom: 100px; }
.concept .concept_article .catch_area .catch_copy { margin-top: 40px; font-size: 30px; margin-bottom: 30px; }
.concept .concept_article .catch_area .image { margin-top: 40px; text-align: center; }
.concept .concept_section { margin-top: 40px; }
.concept .concept_section-header .heading { margin-bottom: 0; color: #00aba7; font-size: 30px; }
.concept .concept_section-header p { font-size: 12px; }
.concept .concept_section-body { margin-top: 35px; }
.concept .concept_section-city_planning .clearfix { display: flex; margin: 0 -11px; flex-wrap: wrap; }
.concept .concept_section-city_planning [class^=col-] { float: left; width: 320px; margin: 0 10px; }
.concept .concept_section-city_planning .inner_section { padding-bottom: 38px; }
.concept .concept_section-city_planning .inner_section-header .heading { color: #f06601; font-size: 18px; }
.concept .concept_section-city_planning .inner_section-body .text_area { margin-top: 13px; }
.concept .concept_section-city_planning .inner_section-body .text_area p { font-size: 14px; line-height: 1.6; }
.concept .concept_section-sign_a_memorandum .inner_section { padding-top: 40px; }
.concept .concept_section-sign_a_memorandum .inner_section-header .heading { color: #f06601; font-size: 20px; }
.concept .concept_section-sign_a_memorandum .inner_section-body .image { text-align: center; }
.concept .concept_section-basic_principle .inner_section { padding-top: 40px; }
.concept .concept_section-basic_principle .inner_section-header .heading { margin-bottom: 0; color: #f06601; font-size: 20px; }
.concept .concept_section-basic_principle .inner_section-body { margin-top: 25px; }
.concept .concept_section-basic_principle .inner_section-body .image { text-align: center; }
.concept .concept_section-basic_principle .inner_section-body .clearfix:after { content: ''; display: block; clear: both; }
.concept .concept_section-basic_principle .inner_section-body .col-1 { float: left; width: 720px; }
.concept .concept_section-basic_principle .inner_section-body .col-2 { float: right; width: 255px; margin-top: -85px; }
.concept .concept_section-osaka_gas_security_partner .concept_section-header { position: relative; }
.concept .concept_section-osaka_gas_security_partner .concept_section-header .image { position: absolute; top: 0; right: 0; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .clearfix { display: flex; flex-wrap: wrap; overflow: hidden; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .col-1 { float: left; width: 44%; margin-right: 2%; padding: 30px 20px; border: 1px solid #000; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .col-2 { float: right; width: 44%; padding: 30px 20px; border: 1px solid #000; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner { display: block; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .heading { width: 320px; margin: 0 auto; padding: 12px; border: 1px solid #000; font-size: 24px; text-align: center; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .catch_area { text-align: center; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .catch_area .image { margin-top: 27px; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .catch_copy { margin-top: 20px; margin-bottom: 10px; font-size: 18px; line-height: 1.4; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .annotation { display: inline-block; margin: 10px auto 0; }
.concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .annotation p { font-size: 12px; line-height: 1.4; text-align: left; }
.concept .concept_section-osaka_gas_security_partner .inner_section { padding-top: 30px; }
.concept .concept_section-osaka_gas_security_partner .inner_section-header .heading { color: #f06601; font-size: 20px; }
.concept .concept_section-osaka_gas_security_partner .inner_section-body .image { margin-top: 40px; text-align: center; }
.concept .concept_section-osaka_gas_security_partner .inner_section-body p { font-size: 16px; line-height: 1.6; }
.concept .concept_section-osaka_gas_security_partner .inner_section-body dt { margin-top: 20px; font-weight: bold; line-height: 1.4; }
.concept .concept_section-osaka_gas_security_partner .inner_section-body dd { margin-top: 5px; margin-left: 0; font-size: 14px; line-height: 1.6; }
.concept .concept_section-community_program .clearfix:after { content: ''; display: block; clear: both; }
.concept .concept_section-community_program .col-1 { float: left; width: 490px; }
.concept .concept_section-community_program .col-2 { float: left; }
.concept .concept_section-community_program .col-2 p { margin-top: -0.5em; margin-left: 25px; color: #f06601; font-size: 20px; line-height: 2; }
.concept .concept_section-community_program .inner_section { position: relative; margin-top: 50px; padding-right: 180px; }
.concept .concept_section-community_program .inner_section-header .heading { color: #f06601; font-size: 20px; }
.concept .concept_section-community_program .inner_section-header .image { position: absolute; top: 0; right: 0; }

@media screen and (max-width: 480px) { .concept .concept_article .catch_area .catch_copy { margin-top: 20px; font-size: 20px; }
  .concept .concept_article .catch_area .image { margin-top: 20px; }
  .concept .concept_section-city_planning .clearfix { display: block; margin: 0; }
  .concept .concept_section-city_planning [class^=col-] { float: none; width: 100%; margin: 0; }
  .concept .concept_section-city_planning .image img { width: 100%; }
  .concept .concept_section-basic_principle .inner_section { padding-top: 20px; }
  .concept .concept_section-basic_principle .inner_section-body { margin-top: 12px; }
  .concept .concept_section-basic_principle .inner_section-body .col-1 { float: none; width: 100%; }
  .concept .concept_section-basic_principle .inner_section-body .col-2 { float: none; width: 100%; margin-top: 20px; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-header { position: relative; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-header .image { margin-top: 15px; position: static; text-align: center; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-body .clearfix { display: block; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-body .col-1 { float: none; width: 100%; margin-right: 0; padding: 17px 10px; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-body .col-2 { float: none; width: 100%; margin-top: 15px; padding: 17px 10px; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .heading { width: 100%; }
  .concept .concept_section-osaka_gas_security_partner .concept_section-body .osaka_gas_security_partner-inner-header .catch_copy { font-size: 16px; }
  .concept .concept_section-community_program .col-1 { float: none; width: 100%; }
  .concept .concept_section-community_program .col-2 { float: none; width: 100%; margin-top: 15px; }
  .concept .concept_section-community_program .col-2 p { margin-top: 0; margin-left: 0; color: #f06601; font-size: 14px; line-height: 2; }
  .concept .concept_section-community_program .inner_section { position: relative; margin-top: 50px; padding-right: 0; }
  .concept .concept_section-community_program .inner_section-header .heading { color: #f06601; font-size: 20px; }
  .concept .concept_section-community_program .inner_section-header .image { position: static; margin: 10px 0; text-align: center; } }
.location:after { content: ""; clear: both; display: block; }

.location-body:after { content: ""; clear: both; display: block; }

.location .location_article { margin-top: -20px; }
.location .location_article-header .heading { margin-bottom: 0; color: #00aba7; font-size: 40px; }
.location .location_article-header p { font-size: 12px; }
.location .location_article-body { margin-top: 35px; }
.location .location_article-body figure { margin: 0; }
.location .location_article-body figcaption span { display: block; line-height: 1.4; text-align: center; }
.location .location_article-body figcaption span span { font-size: 12px; }
.location .location_article-body figcaption .name { margin-top: 0.4em; font-size: 22px; }
.location .location_article-body figcaption .distance { font-size: 18px; }
.location .location_article-footer { margin: 50px 0 80px 0; }
.location .location_article-footer ul { margin: 0; padding: 0; list-style: none; }
.location .location_article-footer li { margin: 0; padding: 0; font-size: 14px; line-height: 1.3; }
.location .location_article-educational_environment .clearfix-over { overflow: hidden; }
.location .location_article-educational_environment .clearfix-over .col-1 { float: left; width: 478px; }
.location .location_article-educational_environment .clearfix-over .col-2 { float: right; width: 50%; padding-left: 12px; box-sizing: border-box; text-align: right; }
.location .location_article-educational_environment .inner_section { padding-top: 30px; }
.location .location_article-educational_environment .inner_section:first-child { padding-top: 0; }
.location .location_article-educational_environment .inner_section-header .heading { color: #f06601; font-size: 20px; }
.location .location_article-educational_environment .inner_section-body p { font-size: 16px; line-height: 1.8; }
.location .location_article-educational_environment .clearfix-under { display: flex; margin: 50px -11px 0; flex-wrap: wrap; overflow: hidden; }
.location .location_article-educational_environment .clearfix-under [class^=col-] { float: left; width: 326px; margin: 0 7px; text-align: center; }
.location .location_article-educational_environment .clearfix-under [class^=col-] img { width: 100%; }
.location .location_article-shopping_and_gourmet { margin-top: 80px; }
.location .location_article-shopping_and_gourmet .clearfix-over { overflow: hidden; }
.location .location_article-shopping_and_gourmet .clearfix-over .col-1 { float: left; width: 478px; }
.location .location_article-shopping_and_gourmet .clearfix-over .col-2 { float: right; width: 50%; padding-left: 12px; box-sizing: border-box; text-align: right; }
.location .location_article-shopping_and_gourmet .inner_section { padding-top: 30px; }
.location .location_article-shopping_and_gourmet .inner_section:first-child { padding-top: 0; }
.location .location_article-shopping_and_gourmet .inner_section-header .heading { color: #f06601; font-size: 20px; }
.location .location_article-shopping_and_gourmet .inner_section-body p { font-size: 16px; line-height: 1.8; }
.location .location_article-shopping_and_gourmet .clearfix-under { display: flex; margin: 50px -11px 0; flex-wrap: wrap; overflow: hidden; }
.location .location_article-shopping_and_gourmet .clearfix-under [class^=col-] { float: left; width: 326px; margin: 0 7px; text-align: center; }
.location .location_article-shopping_and_gourmet .clearfix-under [class^=col-] img { width: 100%; }
.location .location_article-living_city { margin-top: 80px; }
.location .location_article-living_city .clearfix { display: flex; margin: 50px -11px 0; flex-wrap: wrap; overflow: hidden; }
.location .location_article-living_city .clearfix [class^=col-] { float: left; width: 242px; margin: 0 6px; padding-bottom: 40px; text-align: center; }
.location .location_article-living_city .clearfix [class^=col-] img { width: 100%; }
.location .location_article-living_city .clearfix figcaption .name { font-size: 18px; }
.location .location_article-living_city .clearfix figcaption .distance { font-size: 14px; }
.location .location_article-store_and_park { margin-top: 60px; }
.location .location_article-store_and_park .clearfix { display: flex; margin: 50px -11px 0; flex-wrap: wrap; overflow: hidden; }
.location .location_article-store_and_park .clearfix [class^=col-] { float: left; width: 242px; margin: 0 6px; padding-bottom: 40px; text-align: center; }
.location .location_article-store_and_park .clearfix [class^=col-] img { width: 100%; }
.location .location_article-store_and_park .clearfix figcaption .name { font-size: 18px; }
.location .location_article-store_and_park .clearfix figcaption .distance { font-size: 14px; }
.location .facility_list-header .heading { font-size: 22px; }
.location .facility_list-body .clearfix { margin-top: 0; }
.location .facility_list-body .clearfix .col-1 { float: left; width: 489px; margin: 0 11px; }
.location .facility_list-body .clearfix .col-2 { float: right; width: 489px; margin: 0 11px; }
.location .facility_list-body table { width: 100%; border-collapse: separate; border-spacing: 1px; table-layout: fixed; }
.location .facility_list-body table th, .location .facility_list-body table td { padding: 8px 0 3px; border-bottom: 1px dashed #333; }
.location .facility_list-body .name { width: 290px; font-weight: normal; text-align: left; }
.location .facility_list-body .name span { font-size: 12px; }
.location .facility_list-body .time { width: 73px; }
.location .facility_list-body .distance { width: 81px; }

@media screen and (max-width: 480px) { .location .location_article-header .heading { font-size: 30px; }
  .location .location_article-educational_environment .clearfix-over { overflow: hidden; }
  .location .location_article-educational_environment .clearfix-over .col-1 { float: none; width: 100%; }
  .location .location_article-educational_environment .clearfix-over .col-2 { float: none; width: 100%; margin-top: 15px; padding-left: 0; box-sizing: border-box; text-align: center; }
  .location .location_article-educational_environment .clearfix-under { display: block; margin: 50px 0 0; }
  .location .location_article-educational_environment .clearfix-under [class^=col-] { float: none; width: 100%; margin: 10px 0; }
  .location .location_article-shopping_and_gourmet .clearfix-over { overflow: hidden; }
  .location .location_article-shopping_and_gourmet .clearfix-over .col-1 { float: none; width: 100%; }
  .location .location_article-shopping_and_gourmet .clearfix-over .col-2 { float: none; width: 100%; margin-top: 15px; padding-left: 0; box-sizing: border-box; text-align: center; }
  .location .location_article-shopping_and_gourmet .clearfix-under { display: block; margin: 50px 0 0; }
  .location .location_article-shopping_and_gourmet .clearfix-under [class^=col-] { float: none; width: 100%; margin: 10px 0; }
  .location .location_article-living_city .clearfix { display: block; margin: 50px 0; }
  .location .location_article-living_city .clearfix [class^=col-] { float: none; width: 100%; margin: 0; padding-bottom: 20px; }
  .location .location_article-store_and_park .clearfix { display: block; margin: 50px 0; }
  .location .location_article-store_and_park .clearfix [class^=col-] { float: none; width: 100%; margin: 0; padding-bottom: 20px; }
  .location .facility_list-body .clearfix { margin-top: 0; }
  .location .facility_list-body .clearfix .col-1 { float: none; width: 100%; padding: 0; }
  .location .facility_list-body .clearfix .col-2 { float: none; width: 100%; padding: 0; }
  .location .facility_list-body table, .location .facility_list-body tbody, .location .facility_list-body tr, .location .facility_list-body th, .location .facility_list-body td { display: block; }
  .location .facility_list-body table th, .location .facility_list-body table td { padding: 0; border-bottom: none; font-size: 12px; text-align: left; }
  .location .facility_list-body table tr { padding: 10px 0; border-bottom: 1px dashed #333; }
  .location .facility_list-body table .name { width: 100%; font-weight: bold; }
  .location .facility_list-body table .name span { font-size: 10px; }
  .location .facility_list-body table .time { width: 100%; }
  .location .facility_list-body table .distance { width: 100%; } }
/*
[option]box
==========================================================================*/
.box:after { content: ""; clear: both; display: block; }

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

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

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

.article { margin-top: 100px; }

.article-body { margin-top: 50px; }

@media (max-width: 479px) { .article { margin-top: 50px; }
  .article-body { margin-top: 25px; } }
.section { margin-top: 50px; }
.section .section-body { margin-top: 30px; }

@media (max-width: 479px) { .section { margin-top: 25px; }
  .section .section-body { margin-top: 15px; } }
/*
[option]property
==========================================================================*/
/*
text-align
--------------------------------------------------
*/
.al-c { text-align: center; }

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

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

/*
vertical-align
--------------------------------------------------
*/
.al-t { vertical-align: top; }

.al-m { text-align: middle; }

.al-b { text-align: bottom; }

/*
float
--------------------------------------------------
*/
.fl-l { float: left; }

.fl-r { float: right; }

/*
clear
--------------------------------------------------
*/
.cl-l { clear: left; }

.cl-r { clear: right; }

.cl-b { clear: both; }

/*
margin
--------------------------------------------------
*/
.m-0 { margin: 0; }

.m-xxs { margin: 0.5em; }

.m-xs { margin: 1em; }

.m-sm { margin: 1.5em; }

.m-ms { margin: 2em; }

.m-md { margin: 3em; }

.m-ml { margin: 4em; }

.m-lg { margin: 6em; }

.m-xl { margin: 8em; }

.m-xxl { margin: 10em; }

/*
margin-top
--------------------------------------------------
*/
.mt-0 { margin-top: 0; }

.mt-xxs { margin-top: 0.5em; }

.mt-xs { margin-top: 1em; }

.mt-sm { margin-top: 1.5em; }

.mt-ms { margin-top: 2em; }

.mt-md { margin-top: 3em; }

.mt-ml { margin-top: 4em; }

.mt-lg { margin-top: 6em; }

.mt-xl { margin-top: 8em; }

.mt-xxl { margin-top: 10em; }

/*
margin-right
--------------------------------------------------
*/
.mr-0 { margin-right: 0; }

.mr-xxs { margin-right: 0.5em; }

.mr-xs { margin-right: 1em; }

.mr-sm { margin-right: 1.5em; }

.mr-ms { margin-right: 2em; }

.mr-md { margin-right: 3em; }

.mr-ml { margin-right: 4em; }

.mr-lg { margin-right: 6em; }

.mr-xl { margin-right: 8em; }

.mr-xxl { margin-right: 10em; }

/*
margin-bottom
--------------------------------------------------
*/
.mb-0 { margin-bottom: 0; }

.mb-xxs { margin-bottom: 0.5em; }

.mb-xs { margin-bottom: 1em; }

.mb-sm { margin-bottom: 1.5em; }

.mb-ms { margin-bottom: 2em; }

.mb-md { margin-bottom: 3em; }

.mb-ml { margin-bottom: 4em; }

.mb-lg { margin-bottom: 6em; }

.mb-xl { margin-bottom: 8em; }

.mb-xxl { margin-bottom: 10em; }

/*
margin-left
--------------------------------------------------
*/
.ml-0 { margin-left: 0; }

.ml-xxs { margin-left: 0.5em; }

.ml-xs { margin-left: 1em; }

.ml-sm { margin-left: 1.5em; }

.ml-ms { margin-left: 2em; }

.ml-md { margin-left: 3em; }

.ml-ml { margin-left: 4em; }

.ml-lg { margin-left: 6em; }

.ml-xl { margin-left: 8em; }

.ml-xxl { margin-left: 10em; }

/*
padding
--------------------------------------------------
*/
.p-0 { padding: 0; }

.p-xxs { padding: 0.5em; }

.p-xs { padding: 1em; }

.p-sm { padding: 1.5em; }

.p-ms { padding: 2em; }

.p-md { padding: 3em; }

.p-ml { padding: 4em; }

.p-lg { padding: 6em; }

.p-xl { padding: 8em; }

.p-xxl { padding: 10em; }

/*
padding-top
--------------------------------------------------
*/
.pt-0 { padding-top: 0; }

.pt-xxs { padding-top: 0.5em; }

.pt-xs { padding-top: 1em; }

.pt-sm { padding-top: 1.5em; }

.pt-ms { padding-top: 2em; }

.pt-md { padding-top: 3em; }

.pt-ml { padding-top: 4em; }

.pt-lg { padding-top: 6em; }

.pt-xl { padding-top: 8em; }

.pt-xxl { padding-top: 10em; }

/*
padding-right
--------------------------------------------------
*/
.pr-0 { padding-right: 0; }

.pr-xxs { padding-right: 0.5em; }

.pr-xs { padding-right: 1em; }

.pr-sm { padding-right: 1.5em; }

.pr-ms { padding-right: 2em; }

.pr-md { padding-right: 3em; }

.pr-ml { padding-right: 4em; }

.pr-lg { padding-right: 6em; }

.pr-xl { padding-right: 8em; }

.pr-xxl { padding-right: 10em; }

/*
padding-bottom
--------------------------------------------------
*/
.pb-0 { padding-bottom: 0; }

.pb-xxs { padding-bottom: 0.5em; }

.pb-xs { padding-bottom: 1em; }

.pb-sm { padding-bottom: 1.5em; }

.pb-ms { padding-bottom: 2em; }

.pb-md { padding-bottom: 3em; }

.pb-ml { padding-bottom: 4em; }

.pb-lg { padding-bottom: 6em; }

.pb-xl { padding-bottom: 8em; }

.pb-xxl { padding-bottom: 10em; }

/*
padding-left
--------------------------------------------------
*/
.pl-0 { padding-left: 0; }

.pl-xxs { padding-left: 0.5em; }

.pl-xs { padding-left: 1em; }

.pl-sm { padding-left: 1.5em; }

.pl-ms { padding-left: 2em; }

.pl-md { padding-left: 3em; }

.pl-ml { padding-left: 4em; }

.pl-lg { padding-left: 6em; }

.pl-xl { padding-left: 8em; }

.pl-xxl { padding-left: 10em; }

/*
position
--------------------------------------------------
*/
.absolute { position: absolute; }

.relative { position: relative; }

.fixed { position: fixed; }

.left { left: 0; }

.right { right: 0; }

.top { top: 0; }

.bottom { bottom: 0; }

.center { text-align: center; margin: 0 auto; }

/*
width
--------------------------------------------------
*/
.w1 { width: 1px; }

.w2 { width: 2px; }

.w3 { width: 3px; }

.w4 { width: 4px; }

.w5 { width: 5px; }

.w6 { width: 6px; }

.w7 { width: 7px; }

.w8 { width: 8px; }

.w9 { width: 9px; }

.w10 { width: 10px; }

.w11 { width: 11px; }

.w12 { width: 12px; }

.w13 { width: 13px; }

.w14 { width: 14px; }

.w15 { width: 15px; }

.w16 { width: 16px; }

.w17 { width: 17px; }

.w18 { width: 18px; }

.w19 { width: 19px; }

.w20 { width: 20px; }

.w21 { width: 21px; }

.w22 { width: 22px; }

.w23 { width: 23px; }

.w24 { width: 24px; }

.w25 { width: 25px; }

.w26 { width: 26px; }

.w27 { width: 27px; }

.w28 { width: 28px; }

.w29 { width: 29px; }

.w30 { width: 30px; }

.w31 { width: 31px; }

.w32 { width: 32px; }

.w33 { width: 33px; }

.w34 { width: 34px; }

.w35 { width: 35px; }

.w36 { width: 36px; }

.w37 { width: 37px; }

.w38 { width: 38px; }

.w39 { width: 39px; }

.w40 { width: 40px; }

.w41 { width: 41px; }

.w42 { width: 42px; }

.w43 { width: 43px; }

.w44 { width: 44px; }

.w45 { width: 45px; }

.w46 { width: 46px; }

.w47 { width: 47px; }

.w48 { width: 48px; }

.w49 { width: 49px; }

.w50 { width: 50px; }

.w51 { width: 51px; }

.w52 { width: 52px; }

.w53 { width: 53px; }

.w54 { width: 54px; }

.w55 { width: 55px; }

.w56 { width: 56px; }

.w57 { width: 57px; }

.w58 { width: 58px; }

.w59 { width: 59px; }

.w60 { width: 60px; }

.w61 { width: 61px; }

.w62 { width: 62px; }

.w63 { width: 63px; }

.w64 { width: 64px; }

.w65 { width: 65px; }

.w66 { width: 66px; }

.w67 { width: 67px; }

.w68 { width: 68px; }

.w69 { width: 69px; }

.w70 { width: 70px; }

.w71 { width: 71px; }

.w72 { width: 72px; }

.w73 { width: 73px; }

.w74 { width: 74px; }

.w75 { width: 75px; }

.w76 { width: 76px; }

.w77 { width: 77px; }

.w78 { width: 78px; }

.w79 { width: 79px; }

.w80 { width: 80px; }

.w81 { width: 81px; }

.w82 { width: 82px; }

.w83 { width: 83px; }

.w84 { width: 84px; }

.w85 { width: 85px; }

.w86 { width: 86px; }

.w87 { width: 87px; }

.w88 { width: 88px; }

.w89 { width: 89px; }

.w90 { width: 90px; }

.w91 { width: 91px; }

.w92 { width: 92px; }

.w93 { width: 93px; }

.w94 { width: 94px; }

.w95 { width: 95px; }

.w96 { width: 96px; }

.w97 { width: 97px; }

.w98 { width: 98px; }

.w99 { width: 99px; }

.w100 { width: 100px; }

.w120 { width: 120px; }

.w140 { width: 140px; }

.w160 { width: 160px; }

.w180 { width: 180px; }

.w200 { width: 200px; }

.w220 { width: 220px; }

.w240 { width: 240px; }

.w260 { width: 260px; }

.w280 { width: 280px; }

.w300 { width: 300px; }

.w320 { width: 320px; }

.w340 { width: 340px; }

.w360 { width: 360px; }

.w380 { width: 380px; }

.w400 { width: 400px; }

.w420 { width: 420px; }

.w440 { width: 440px; }

.w460 { width: 460px; }

.w480 { width: 480px; }

.w500 { width: 500px; }

.w520 { width: 520px; }

.w540 { width: 540px; }

.w560 { width: 560px; }

.w580 { width: 580px; }

.w5p { width: 5%; }

.w6p { width: 6%; }

.w7p { width: 7%; }

.w8p { width: 8%; }

.w9p { width: 9%; }

.w10p { width: 10%; }

.w11p { width: 11%; }

.w12p { width: 12%; }

.w13p { width: 13%; }

.w14p { width: 14%; }

.w15p { width: 15%; }

.w16p { width: 16%; }

.w17p { width: 17%; }

.w18p { width: 18%; }

.w19p { width: 19%; }

.w20p { width: 20%; }

.w21p { width: 21%; }

.w22p { width: 22%; }

.w23p { width: 23%; }

.w24p { width: 24%; }

.w25p { width: 25%; }

.w26p { width: 26%; }

.w27p { width: 27%; }

.w28p { width: 28%; }

.w29p { width: 29%; }

.w30p { width: 30%; }

.w31p { width: 31%; }

.w32p { width: 32%; }

.w33p { width: 33%; }

.w34p { width: 34%; }

.w35p { width: 35%; }

.w36p { width: 36%; }

.w37p { width: 37%; }

.w38p { width: 38%; }

.w39p { width: 39%; }

.w40p { width: 40%; }

.w41p { width: 41%; }

.w42p { width: 42%; }

.w43p { width: 43%; }

.w44p { width: 44%; }

.w45p { width: 45%; }

.w46p { width: 46%; }

.w47p { width: 47%; }

.w48p { width: 48%; }

.w49p { width: 49%; }

.w50p { width: 50%; }

.w51p { width: 51%; }

.w52p { width: 52%; }

.w53p { width: 53%; }

.w54p { width: 54%; }

.w55p { width: 55%; }

.w56p { width: 56%; }

.w57p { width: 57%; }

.w58p { width: 58%; }

.w59p { width: 59%; }

.w60p { width: 60%; }

.w61p { width: 61%; }

.w62p { width: 62%; }

.w63p { width: 63%; }

.w64p { width: 64%; }

.w65p { width: 65%; }

.w66p { width: 66%; }

.w67p { width: 67%; }

.w68p { width: 68%; }

.w69p { width: 69%; }

.w70p { width: 70%; }

.w71p { width: 71%; }

.w72p { width: 72%; }

.w73p { width: 73%; }

.w74p { width: 74%; }

.w75p { width: 75%; }

.w76p { width: 76%; }

.w77p { width: 77%; }

.w78p { width: 78%; }

.w79p { width: 79%; }

.w80p { width: 80%; }

.w81p { width: 81%; }

.w82p { width: 82%; }

.w83p { width: 83%; }

.w84p { width: 84%; }

.w85p { width: 85%; }

.w86p { width: 86%; }

.w87p { width: 87%; }

.w88p { width: 88%; }

.w89p { width: 89%; }

.w90p { width: 90%; }

.w91p { width: 91%; }

.w92p { width: 92%; }

.w93p { width: 93%; }

.w94p { width: 94%; }

.w95p { width: 95%; }

.w96p { width: 96%; }

.w97p { width: 97%; }

.w98p { width: 98%; }

.w99p { width: 99%; }

.w100p { width: 100%; }

/*
display
--------------------------------------------------
*/
.inline { display: inline; }

.inline_block { display: inline-block; }

.block { display: block; }

/*
clearfix
--------------------------------------------------
*/
.clearfix:after:after { content: ""; clear: both; display: block; }

/*
[option]state
==========================================================================*/
.is-sidebar-fixed { position: fixed !important; top: 0px; z-index: 999; }

.is-sidebar-absolute { position: absolute !important; bottom: 0px; z-index: 999; }

.is-sidebar-over_window { overflow-x: hidden; overflow-y: scroll; }

.is-topbar-fixed { position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; }

/* 
[option]state
==========================================================================
*/
.is-hide { visibility: hidden; display: none; }

@media screen and (min-width: 961px) { .is-pc_show { display: block; }
  .is-pc_hide { display: none; } }
@media screen and (max-width: 960px) { .is-mb_show { display: block; }
  .is-mb_hide { display: none; } }
@media screen and (min-width: 481px) and (max-width: 960px) { .is-tb_show { display: block; }
  .is-tb_hide { display: none; } }
@media screen and (max-width: 480px) { .is-sp_show { display: block; }
  .is-sp_hide { display: none; } }
@media screen and (max-width: 360px) { .is-sps_show { display: block; }
  .is-sps_hide { display: none; } }
/* 
pages
==========================================================================*/