@charset "UTF-8";
/* メガソフトブルー */
/* PRO9EXテーマカラー */
/* Neo3テーマカラー */
/* 住宅テーマカラー */
/* PRO9テーマカラー */
/* Reset Style */
html {
  overflow-y: scroll;
}

body {
  line-height: 1;
  color: #000;
}

/* html5doctor.com Reset Stylesheet v1.6.1
Last Updated: 2010-09-17 Author: Richard Clark - http://richclarkdesign.com Twitter: @rich_clark */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  background: transparent;
}

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

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

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* YUI 3.4.1 (build 4118) Copyright 2011 Yahoo! Inc. All rights reserved.
Licensed under the BSD License. http://yuilibrary.com/license/ */
body {
  font: 13px/1.231 arial,helvetica,clean,sans-serif;
  *font-size: small;
  *font: x-small;
}

select, input, button, textarea {
  font: 99% arial,helvetica,clean,sans-serif;
}

table {
  font-size: inherit;
  font: 100%;
}

pre, code, kbd, samp, tt {
  font-family: monospace;
  *font-size: 108%;
  line-height: 100%;
}

/* 汎用クラス */
[class^="mark"] {
  padding-left: 15px;
  background: no-repeat left .5em;
}

.mark1 {
  background-image: url(../../img/share/mark_1.gif);
}

.mark2 {
  background-image: url(../../img/share/mark_2.gif);
}

.mark3 {
  background-image: url(../../img/share/mark_3.gif);
}

.mark4 {
  background-image: url(../../img/share/mark_4.gif);
}

.mark5 {
  background-image: url(../../img/share/mark_5.gif);
}

.opacity {
  opacity: 0.7;
  -moz-opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

.font_lig {
  color: #555;
  font-weight: 200;
}

.font_reg {
  color: #333;
  font-weight: 400;
}

.font_bol {
  color: #222;
  font-weight: 700;
}

.fa {
  font-family: FontAwesome;
  font-weight: normal !important;
}

.imgArea {
  overflow: hidden;
}

.inline_block {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

.table_cell {
  display: table-cell;
  *display: inline;
  *zoom: 1;
  vertical-align: middle;
}

.ovfl {
  overflow: hidden;
}

.fr,
.imgR,
img.alignright {
  float: right;
  margin-left: 10px;
}

.fl,
.imgL,
img.alignleft {
  float: left;
  margin-right: 10px;
}

.imgC,
.tC,
.btn,
.aligncenter,
.textcenter {
  text-align: center;
}

img.imgC,
img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.tR,
.sign,
.alignright {
  text-align: right;
}

.tL,
.alignleft {
  text-align: left;
}

.box_size {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

.ts_none {
  -webkit-text-shadow: none !important;
  -moz-text-shadow: none !important;
  -ms-text-shadow: none !important;
  -o-text-shadow: none !important;
  text-shadow: none !important;
}

.bs_none {
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  -ms-box-shadow: none !important;
  -o-box-shadow: none !important;
  box-shadow: none !important;
}

.mt0 {
  margin-top: 0px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}

.pt0 {
  padding-top: 0px !important;
}

.pb0 {
  padding-bottom: 0px !important;
}

.mt5 {
  margin-top: 5px !important;
}

.mb5 {
  margin-bottom: 5px !important;
}

.pt5 {
  padding-top: 5px !important;
}

.pb5 {
  padding-bottom: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.mt35 {
  margin-top: 35px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.pt35 {
  padding-top: 35px !important;
}

.pb35 {
  padding-bottom: 35px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.pt40 {
  padding-top: 40px !important;
}

.pb40 {
  padding-bottom: 40px !important;
}

.mt45 {
  margin-top: 45px !important;
}

.mb45 {
  margin-bottom: 45px !important;
}

.pt45 {
  padding-top: 45px !important;
}

.pb45 {
  padding-bottom: 45px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.pt50 {
  padding-top: 50px !important;
}

.pb50 {
  padding-bottom: 50px !important;
}

.mt55 {
  margin-top: 55px !important;
}

.mb55 {
  margin-bottom: 55px !important;
}

.pt55 {
  padding-top: 55px !important;
}

.pb55 {
  padding-bottom: 55px !important;
}

.mt60 {
  margin-top: 60px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.pt60 {
  padding-top: 60px !important;
}

.pb60 {
  padding-bottom: 60px !important;
}

.mt65 {
  margin-top: 65px !important;
}

.mb65 {
  margin-bottom: 65px !important;
}

.pt65 {
  padding-top: 65px !important;
}

.pb65 {
  padding-bottom: 65px !important;
}

.mt70 {
  margin-top: 70px !important;
}

.mb70 {
  margin-bottom: 70px !important;
}

.pt70 {
  padding-top: 70px !important;
}

.pb70 {
  padding-bottom: 70px !important;
}

.mt75 {
  margin-top: 75px !important;
}

.mb75 {
  margin-bottom: 75px !important;
}

.pt75 {
  padding-top: 75px !important;
}

.pb75 {
  padding-bottom: 75px !important;
}

.mt80 {
  margin-top: 80px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

.pt80 {
  padding-top: 80px !important;
}

.pb80 {
  padding-bottom: 80px !important;
}

.mt85 {
  margin-top: 85px !important;
}

.mb85 {
  margin-bottom: 85px !important;
}

.pt85 {
  padding-top: 85px !important;
}

.pb85 {
  padding-bottom: 85px !important;
}

.mt90 {
  margin-top: 90px !important;
}

.mb90 {
  margin-bottom: 90px !important;
}

.pt90 {
  padding-top: 90px !important;
}

.pb90 {
  padding-bottom: 90px !important;
}

.mt95 {
  margin-top: 95px !important;
}

.mb95 {
  margin-bottom: 95px !important;
}

.pt95 {
  padding-top: 95px !important;
}

.pb95 {
  padding-bottom: 95px !important;
}

.mt100 {
  margin-top: 100px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.pt100 {
  padding-top: 100px !important;
}

.pb100 {
  padding-bottom: 100px !important;
}

.btn {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

/* clearfix */
.clearfix, #contents, #header .inner, #gNavi ul, #footer .inner {
  *zoom: 1;
}
.clearfix:after, #contents:after, #header .inner:after, #gNavi ul:after, #footer .inner:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

/*	12 COLUMN : RESPONSIVE GRID SYSTEM
	DEVELOPER : DENIS LEBLANC
	URL : http://responsive.gs
	VERSION : 3.0
	LICENSE : GPL & MIT */
/* 	SET ALL ELEMENTS TO BOX-SIZING : BORDER-BOX */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  *behavior: url(/scripts/boxsizing.htc);
  /*	If you need support for IE7 and lower make 
  	sure the boxsizing.htc file is linked properly.
  	More info here:  https://github.com/Schepp/box-sizing-polyfill */
}

/*	MAIN CONTAINER 
	Set the width to whatever you want the width of your site to be. */
.container {
  margin: 0 auto;
}
@media only screen and (min-width: 980px) {
.learn2{
	display:none;
}
  .container {
    max-width: 980px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
.learn2{
	display:none;
}
 .container {
    max-width: 768px;
    padding: 0 15px;
  }
}
@media only screen and (max-width: 767px) {
.learn{
	display:none;
}
  .container {
    max-width: 640px;
    padding: 0 15px;
  }
}

/*	SELF CLEARING FLOATS - CLEARFIX METHOD */
.container:after,
.row:after,
.function_list_general .function ul:after,
.function_list_general .function ol:after,
.single.interview .ba:after,
.col:after,
.function_list_general .function ul li:after,
.function_list_general .function ol li:after,
.clr:after,
.group:after {
  content: "";
  display: table;
  clear: both;
}

/* 	DEFAULT ROW STYLES 
	Set bottom padding according to preference */
.row, .function_list_general .function ul,
.function_list_general .function ol, .single.interview .ba {
  padding-bottom: 0em;
  overflow: hidden;
}

/* DEFAULT COLUMN STYLES */
.col, .function_list_general .function ul li,
.function_list_general .function ol li {
  float: left;
  display: block;
  width: 100%;
}

.col img, .function_list_general .function ul li img,
.function_list_general .function ol li img {
  max-width: 100%;
  height: auto;
}

@media only screen and (min-width: 980px) {
  .col, .function_list_general .function ul li,
  .function_list_general .function ol li {
    float: left;
  }
  .col:first-child, .function_list_general .function ul li:first-child,
  .function_list_general .function ol li:first-child {
    margin-left: 0;
  }

  /*	COLUMN WIDTH ON DISPLAYS +768px 
  	You might need to play with media queries here to suite your design. */
  .span1 {
    width: 5.52721%;
    margin-left: 3.06122%;
  }

  .span2 {
    width: 14.11565%;
    margin-left: 3.06122%;
  }

  .span3, .product_spec th, .function_list_general .function ul li,
  .function_list_general .function ol li {
    width: 22.70408%;
    margin-left: 3.06122%;
  }

  .span4 {
    width: 31.29252%;
    margin-left: 3.06122%;
  }

  .span5 {
    width: 39.88095%;
    margin-left: 3.06122%;
  }

  .span6 {
    width: 48.46939%;
    margin-left: 3.06122%;
  }

  .span7 {
    width: 57.05782%;
    margin-left: 3.06122%;
  }

  .span8 {
    width: 65.64626%;
    margin-left: 3.06122%;
  }

  .span9 {
    width: 74.23469%;
    margin-left: 3.06122%;
  }

  .span10 {
    width: 82.82313%;
    margin-left: 3.06122%;
  }

  .span11 {
    width: 91.41156%;
    margin-left: 3.06122%;
  }

  .span6:nth-child(odd) {
    margin-left: 0;
  }

  .span4:nth-child(3n+1) {
    margin-left: 0;
  }

  .span3:nth-child(4n+1), .product_spec th:nth-child(4n+1), .function_list_general .function ul li:nth-child(4n+1),
  .function_list_general .function ol li:nth-child(4n+1) {
    margin-left: 0;
  }

  .span2:nth-child(6n+1) {
    margin-left: 0;
  }

  .span12 {
    float: none;
    margin-left: 0;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .tablet-span1 {
    float: left;
    width: 5.52721%;
    margin-left: 3.06122%;
  }
  .tablet-span1:first-child {
    margin-left: 0;
  }

  .tablet-span2 {
    float: left;
    width: 14.11565%;
    margin-left: 3.06122%;
  }
  .tablet-span2:first-child {
    margin-left: 0;
  }

  .tablet-span3 {
    float: left;
    width: 22.70408%;
    margin-left: 3.06122%;
  }
  .tablet-span3:first-child {
    margin-left: 0;
  }

  .tablet-span4 {
    float: left;
    width: 31.29252%;
    margin-left: 3.06122%;
  }
  .tablet-span4:first-child {
    margin-left: 0;
  }

  .tablet-span5 {
    float: left;
    width: 39.88095%;
    margin-left: 3.06122%;
  }
  .tablet-span5:first-child {
    margin-left: 0;
  }

  .tablet-span6 {
    float: left;
    width: 48.46939%;
    margin-left: 3.06122%;
  }
  .tablet-span6:first-child {
    margin-left: 0;
  }

  .tablet-span7 {
    float: left;
    width: 57.05782%;
    margin-left: 3.06122%;
  }
  .tablet-span7:first-child {
    margin-left: 0;
  }

  .tablet-span8 {
    float: left;
    width: 65.64626%;
    margin-left: 3.06122%;
  }
  .tablet-span8:first-child {
    margin-left: 0;
  }

  .tablet-span9 {
    float: left;
    width: 74.23469%;
    margin-left: 3.06122%;
  }
  .tablet-span9:first-child {
    margin-left: 0;
  }

  .tablet-span10 {
    float: left;
    width: 82.82313%;
    margin-left: 3.06122%;
  }
  .tablet-span10:first-child {
    margin-left: 0;
  }

  .tablet-span11 {
    float: left;
    width: 91.41156%;
    margin-left: 3.06122%;
  }
  .tablet-span11:first-child {
    margin-left: 0;
  }

  .tablet-span6:nth-child(odd) {
    margin-left: 0;
  }

  .tablet-span4:nth-child(3n+1) {
    margin-left: 0;
  }

  .tablet-span3:nth-child(4n+1) {
    margin-left: 0;
  }

  .tablet-span2:nth-child(6n+1) {
    margin-left: 0;
  }

  .tablet-span12 {
    float: none;
    margin-left: 0;
    width: 100%;
  }

  .col:not([class^="tablet"]), .function_list_general .function ul li:not([class^="tablet"]),
  .function_list_general .function ol li:not([class^="tablet"]) {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .sp-span1 {
    float: left;
    width: 5.52721%;
    margin-left: 3.06122%;
  }
  .sp-span1:first-child {
    margin-left: 0;
  }

  .sp-span2 {
    float: left;
    width: 14.11565%;
    margin-left: 3.06122%;
  }
  .sp-span2:first-child {
    margin-left: 0;
  }

  .sp-span3 {
    float: left;
    width: 22.70408%;
    margin-left: 3.06122%;
  }
  .sp-span3:first-child {
    margin-left: 0;
  }

  .sp-span4 {
    float: left;
    width: 31.29252%;
    margin-left: 3.06122%;
  }
  .sp-span4:first-child {
    margin-left: 0;
  }

  .sp-span5 {
    float: left;
    width: 39.88095%;
    margin-left: 3.06122%;
  }
  .sp-span5:first-child {
    margin-left: 0;
  }

  .sp-span6 {
    float: left;
    width: 48.46939%;
    margin-left: 3.06122%;
  }
  .sp-span6:first-child {
    margin-left: 0;
  }

  .sp-span7 {
    float: left;
    width: 57.05782%;
    margin-left: 3.06122%;
  }
  .sp-span7:first-child {
    margin-left: 0;
  }

  .sp-span8 {
    float: left;
    width: 65.64626%;
    margin-left: 3.06122%;
  }
  .sp-span8:first-child {
    margin-left: 0;
  }

  .sp-span9 {
    float: left;
    width: 74.23469%;
    margin-left: 3.06122%;
  }
  .sp-span9:first-child {
    margin-left: 0;
  }

  .sp-span10 {
    float: left;
    width: 82.82313%;
    margin-left: 3.06122%;
  }
  .sp-span10:first-child {
    margin-left: 0;
  }

  .sp-span11 {
    float: left;
    width: 91.41156%;
    margin-left: 3.06122%;
  }
  .sp-span11:first-child {
    margin-left: 0;
  }

  .sp-span6:nth-child(odd) {
    margin-left: 0;
  }

  .sp-span4:nth-child(3n+1) {
    margin-left: 0;
  }

  .sp-span3:nth-child(4n+1) {
    margin-left: 0;
  }

  .sp-span2:nth-child(6n+1) {
    margin-left: 0;
  }

  .sp-span12 {
    float: none;
    margin-left: 0;
    width: 100%;
  }

  .col:not([class^="sp"]), .function_list_general .function ul li:not([class^="sp"]),
  .function_list_general .function ol li:not([class^="sp"]) {
    margin-top: 15px;
  }
}
/*----------------------------------------------------
	element style
----------------------------------------------------*/
html {
  font-size: 62.5%;
}

body {
  background: #fff;
  color: #222;
  font-family: "Noto Sans Japanese", "Noto Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, verdana, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
  font-weight: 200;
  letter-spacing: 0.3px;
  min-width: 320px;
}

* {
  vertical-align: baseline;
}

* html body, * html input, * html textarea {
  font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}

a:link {
  color: #011287;
}
a:visited {
  color: #011287;
}
a:hover {
  text-decoration: none;
  color: #011287;
}
a:active {
  color: #011287;
}

img {
  line-height: 1;
  font-size: 0;
  vertical-align: top;
  height: auto;
  max-width: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
}

em {
  font-style: normal;
}

/*----------------------------------------------------
	テーブル共通指定
--------------------------------------------------- */
table {
  width: 100%;
  margin: 0 auto 20px;
  border-collapse: collapse;
}

th, td {
  padding: 10px;
  border: 1px solid #bbb;
  vertical-align: top;
  text-align: left;
}

th {
  font-weight: 400;
}

._uni_tbl_style01 th {
  background-color: #eee;
}

._uni_tbl_style02 th {
  background-color: #000;
  color: #fff;
}

/*----------------------------------------------------
	#page
----------------------------------------------------*/
#page {
  width: 100%;
  margin: 0 auto;
  font-size: 14px;
  font-size: 1.4rem;
  position: relative;
}

.inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 0;
  position: relative;
}

/*----------------------------------------------------
	#contents
----------------------------------------------------*/
#contents {
  _zoom: 1;
  word-break: normal;
  word-wrap: break-word;
}

/*----------------------------------------------------
	ヘッダー
----------------------------------------------------*/
#header {
  width: 100%;
  min-height: 40px;
  line-height: 40px;
  color: #aaa;
  background: #222;
  position: relative;
  z-index: 10005;
}
#header .inner {
  position: static;
}

#logo {
  float: left;
  width: 125px;
  margin: 0 0 0 20px;
}
@media only screen and (max-width: 767px) {
  #logo {
    width: 100px;
    margin: 0 0 0 10px;
  }
}
#logo a {
  display: block;
  height: 0;
  padding: 40px 0 0;
  overflow: hidden;
  background: url(../img/header/logo.png) no-repeat left center;
  background-size: 100% auto;
}

#hNav {
  float: right;
}
#hNav > ul {
  border-right: 1px solid #333;
  height: 40px;
}
#hNav > ul > li {
  float: left;
  border-left: 1px solid #333;
}
#hNav > ul > li > a {
  color: #fff;
  display: block;
  text-align: center;
  text-decoration: none;
  padding: 0 20px;
}
#hNav > ul > li > a:hover {
  background: #000;
}
#hNav > ul > li > a:before {
  font-family: FontAwesome;
  font-weight: normal !important;
  margin-right: 10px;
  position: relative;
  top: 1px;
}
@media only screen and (max-width: 767px) {
  #hNav > ul > li > a {
    font-size: 7px;
    font-size: 0.7rem;
    padding: 0;
    width: 60px;
    text-align: center;
    line-height: 20px;
  }
  #hNav > ul > li > a:before {
    margin: 3px 0 -3px;
    display: block;
    position: relative;
  }
}
@media screen and (max-width: 320px) {
  #hNav > ul > li > a {
    width: 50px;
  }
}
#hNav > ul > li.product > a:before {
  content: "\f0c9";
  font-size: 17px;
}
#hNav > ul > li.learning a:before {
  content: "\f108";
  font-size: 15px;
}
#hNav > ul > li.onlineshop a:before {
  content: "\f07a";
  font-size: 19px;
}
@media only screen and (max-width: 767px) {
  #hNav > ul > li.onlineshop a span {
    display: none;
  }
}

#product_menu {
  position: absolute;
  left: 0;
  top: 40px;
  width: 100%;
  background: #000;
  color: #fff;
  border-bottom: 1px solid #333;
  line-height: 1;
  box-shadow: 0 6px 6px 0 rgba(0, 0, 0, 0.7);
  display: none;
}
#product_menu a {
  color: #fff;
  text-decoration: none;
}
#product_menu ul {
  width: 100%;
  overflow: hidden;
}
#product_menu ul li {
  float: left;
  display: table;
}
#product_menu ul li a {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -ms-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
#product_menu ul li a:hover {
  background-color: #111;
}
#product_menu .item {
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
}
@media only screen and (max-width: 767px) {
  #product_menu .item {
    border-bottom-style: none;
  }
}
#product_menu .item > li {
  width: 25%;
  height: 225px;
}
@media only screen and (max-width: 767px) {
  #product_menu .item > li {
    width: 100%;
    height: auto;
  }
}
#product_menu .item a {
  font-size: 12px;
  font-size: 1.2rem;
  background-repeat: no-repeat;
  background-position: center 75px;
  background-size: 45px auto;
  border-left: 1px solid #333;
}
@media only screen and (max-width: 767px) {
  #product_menu .item a {
    padding: 10px 0 10px 40px;
    background-position: 15px center;
    background-size: 30px;
    border-left-style: none;
    border-top: 1px solid #333;
    vertical-align: middle;
    line-height: 20px;
  }
}
#product_menu .item a:hover {
  background-position: center 80px;
}
@media only screen and (max-width: 767px) {
  #product_menu .item a:hover {
    background-position: 17px center;
  }
}
#product_menu .item a.archi10pro {
  background-image: url(../img/ico/ico_archi10pro.png);
}
#product_menu .item a.pro9ex {
  background-image: url(../img/ico/ico_mdex.png);
}
#product_menu .item a.pro9 {
  background-image: url(../img/ico/ico_md.png);
}
#product_menu .item a.neo3 {
  background-image: url(../img/ico/ico_id.png);
}
#product_menu .item a.rd2 {
  background-image: url(../img/ico/ico_rd.png);
}
#product_menu .item a .lead {
  display: block;
  padding-bottom: 90px;
}
@media only screen and (max-width: 767px) {
  #product_menu .item a .lead {
    padding-bottom: 0;
    margin-bottom: 5px;
  }
}
#product_menu .item a strong {
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 400;
  margin-top: 10px;
}
@media only screen and (max-width: 767px) {
  #product_menu .item a strong {
    vertical-align: text-bottom;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    font-size: 16px;
    font-size: 1.6rem;
    margin: 0;
  }
}
#product_menu .search,
#product_menu .pages {
  border-right: 1px solid #333;
}
#product_menu .search > li,
#product_menu .pages > li {
  width: 100%;
  height: 90px;
}
@media only screen and (max-width: 767px) {
  #product_menu .search > li,
  #product_menu .pages > li {
    width: 100%;
    height: auto;
  }
}
#product_menu .search a,
#product_menu .pages a {
  font-size: 15px;
  font-size: 1.5rem;
  border-left: 1px solid #333;
}
@media only screen and (max-width: 767px) {
  #product_menu .search a,
  #product_menu .pages a {
    padding: 15px 0;
    border-left-style: none;
    border-top: 1px solid #333;
  }
}
#product_menu .search a::before,
#product_menu .pages a::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  margin-right: 15px;
}
#product_menu .search a.compare::before,
#product_menu .pages a.compare::before {
  content: "\f0c5";
}
#product_menu .search a.function::before,
#product_menu .pages a.function::before {
  content: "\f002";
}
#product_menu .search a.perspective::before,
#product_menu .pages a.perspective::before {
  content: "\f002";
}
#product_menu .search a.school::before,
#product_menu .pages a.school::before {
  content: "\f19d";
}
#product_menu .search a.guide::before,
#product_menu .pages a.guide::before {
  content: "\f0f6";
}
#product_menu .pages {
  border-top: 1px solid #333;
}
#product_menu .pages > li {
  width: 33.333333%;
}

/* ---------------------------------------------------- 
	Gナビ
---------------------------------------------------- */
#gNavi {
  width: 100%;
}
#gNavi ul {
  width: 980px;
  margin: 0 auto;
  _zoom: 1;
}
#gNavi ul li {
  float: left;
  word-wrap: normal;
}

/*-----------------------------------------------------
	パンくず
-----------------------------------------------------*/
#crumbs {
  width: 100%;
  color: #222;
  font-size: 12px;
  font-size: 1.2rem;
  margin: 0 auto 20px;
}
@media only screen and (max-width: 979px) {
  #crumbs {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}
@media only screen and (max-width: 767px) {
  #crumbs {
    margin: 0 10px 5px;
    font-size: 10px;
    font-size: 1rem;
  }
}
.page-template-default #crumbs, .page-guide #crumbs, .page-compare #crumbs, .post-type-archive #crumbs, .archive #crumbs, .single #crumbs {
  margin: 40px auto;
  padding: 10px 0;
  background: #f3f3f3;
  border-top: 1px solid #bbb;
  border-bottom: 1px solid #bbb;
}
@media only screen and (max-width: 767px) {
  .page-template-default #crumbs, .page-guide #crumbs, .page-compare #crumbs, .post-type-archive #crumbs, .archive #crumbs, .single #crumbs {
    margin: 0 0 15px;
  }
}
.post-type-archive-practical #crumbs, .tax-practical-category #crumbs, .single-practical #crumbs, .post-type-archive-tutorial #crumbs, .single-tutorial #crumbs, .post-type-archive-interview #crumbs, .single-interview #crumbs, .post-type-archive-users #crumbs, .single-users #crumbs {
  max-width: 980px;
  border-bottom-style: none;
  padding: 15px;
}
.page-pro9ex-child #crumbs {
  /* PRO9EX */
  color: #fff;
}
.page-pro9ex-child #crumbs, .page-neo3-child #crumbs, .page-reform-designer2-child #crumbs, .page-pro9-child #crumbs {
  background: transparent !important;
  padding: 0;
  margin: 0 auto 20px;
  border-style: none !important;
}
#crumbs ul {
  max-width: 980px;
  margin: 0 auto;
}
#crumbs li {
  display: inline;
}
#crumbs a {
  color: #222;
  text-decoration: none;
}
.page-pro9ex-child #crumbs a {
  /* PRO9EX */
  color: #fff;
}
.page-neo3-child #crumbs a {
  /* Neo3 */
}
.page-reform-designer2-child #crumbs a {
  /* リフォームデザイナー */
}
.page-pro9-child #crumbs a {
  /* PRO9 */
}

/*-----------------------------------------------------
	ページトップ
-----------------------------------------------------*/
#pagetop {
  max-width: 980px;
  margin: 0 auto;
  text-align: right;
  position: relative;
  z-index: 9999;
  clear: both;
  text-align: center;
  display: none;
}
@media only screen and (max-width: 767px) {
  #pagetop {
    display: block;
  }
}
#pagetop a {
  display: block;
  color: #222;
  font-size: 36px;
  padding: 20px 0;
}

/*-----------------------------------------------------
	フッター
-----------------------------------------------------*/
#footer {
  width: 100%;
  margin-top: 60px;
}
@media only screen and (max-width: 767px) {
  #footer {
    margin-top: 0;
  }
}
#footer #copyright {
  text-align: center;
  min-height: 40px;
  line-height: 40px;
  color: #aaa;
  background: #222;
}

#fNav {
  border-top: 1px solid #999;
  padding: 30px 0;
font-size: 130%;
}
@media only screen and (max-width: 767px) {
  #fNav {
    border-top: 2px solid #222;
    padding: 0;
  }
}
@media only screen and (max-width: 767px) {
  #fNav .product {
    display: none;
  }
}
#fNav .product h3:before {
  content: "\f1b2";
}
@media only screen and (max-width: 767px) {
  #fNav .purpose {
    display: none;
  }
}
#fNav .purpose h3:before {
  content: "\f002";
}
#fNav .learn {
  margin-top: 25px;
}
@media only screen and (max-width: 767px) {
  #fNav .knowledge {
    display: none;
  }
  #fNav .learn {
    display: none;
  }
}
#fNav .knowledge h3:before {
  font-size: 18px;
  content: "\f15c";
}
#fNav .learn h3:before {
  font-size: 18px;
}
#fNav .learning h3:before {
  content: "\f0f4";
}
#fNav h3 {
  color: #333;
  margin: 0 0 12px;
  font-weight: 400;
}
@media only screen and (max-width: 767px) {
  #fNav h3 {
    margin: 10px;
  }
}
#fNav h3:before {
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 19px;
  margin-right: 10px;
}
#fNav ul {
  margin-left: 30px;
  line-height: 170%;
}
@media only screen and (max-width: 767px) {
  #fNav ul {
    border-bottom: 1px solid #aaa;
    overflow: hidden;
    margin: 0 -1px;
  }
  #fNav ul li {
    width: 50%;
    float: left;
    border-top: 1px solid #aaa;
  }
  #fNav ul li a {
    display: block;
    border-left: 1px solid #aaa;
    text-align: center;
    line-height: 200%;
    padding: 7px 0;
  }
}
#fNav a {
  color: #555;
  text-decoration: none;
}
#fNav a:hover {
  text-decoration: underline;
}

/*----------------------------------------------------
	#main
----------------------------------------------------*/
#main {
  margin: 0 auto;
  line-height: 180%;
  position: relative;
  font-size: 15px;
  font-size: 1.5rem;
  overflow: hidden;
}
body.single #main {
  max-width: 980px;
}

section {
  margin-bottom: 40px;
}

/*----------------------------------------------------
	共通要素
----------------------------------------------------*/
.noposts {
  text-align: center;
  padding: 15px 0;
  margin: 0 auto;
  text-align: center;
  background: #eee;
  border: 1px solid #ddd;
  border-radius: 4px;
  max-width: 24em;
}

.popup_wrapper {
  display: none;
}

a.btn {
  position: relative;
  display: inline-block;
  padding: 10px 45px;
  text-align: center;
  text-decoration: none;
  outline: none;
  overflow: hidden;
  transition: all .5s;
  border-radius: 2px;
  font-weight: 400;
}
a.btn::before, a.btn::after {
  position: absolute;
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  transition: all .5s;
}
a.btn::before {
  top: 0;
  left: 0;
}
a.btn::after {
  right: 0;
  bottom: 0;
}
a.btn:hover {
  transition: all .7s;
}
a.btn:hover::before, a.btn:hover::after {
  width: 0;
  height: 0;
  opacity: 0;
  transition: all .7s;
}
a.btn .fa-angle-right {
  font-size: 21px;
  font-size: 2.1rem;
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -10px;
  display: block;
}
a.btn.btn01 {
  color: #fff !important;
}
a.btn.btn01::before {
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
}
a.btn.btn01::after {
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
a.btn.btn01:hover {
  background-color: #fff;
  color: #222 !important;
}
a.btn.btn02 {
  color: #333 !important;
  background: #fff;
}
a.btn.btn02::before {
  border-top: 1px solid #555;
  border-left: 1px solid #555;
}
a.btn.btn02::after {
  border-right: 1px solid #555;
  border-bottom: 1px solid #555;
}
a.btn.btn02:hover {
  background-color: #555;
  color: #fff !important;
}


/*追加分*/

a.btn.btn03 {
  background-color: #cf7118 ;
  color: #fff !important;
  border: 1px solid #cf7118;
  margin-top:10px;
}
a.btn.btn03:hover {
  background-color: #fff ;
  color: #cf7118 !important;
  border: 1px solid #cf7118;
}

a.btn.btn04 {
  background-color: #307bd1 ;
  color: #fff !important;
  border: 1px solid #307bd1;
  margin-top:10px;
}
a.btn.btn04:hover {
  background-color: #fff ;
  color: #307bd1 !important;
  border: 1px solid #307bd1;
}

a.btn.btn05 {
  background-color: #830009 ;
  color: #fff !important;
  border: 1px solid #830009;
  margin-top:10px;
}
a.btn.btn05:hover {
  background-color: #fff ;
  color: #830009 !important;
  border: 1px solid #830009;
}

a.btn.btn_cart {
  color: #111 !important;
  background-color: #ffa200;
  border: 1px solid #111;
  font-size:2rem;
}

a.btn.btn_cart:hover {
  background-color: #111 ;
  color: #ffa200 !important;
  border: 1px solid #ffa200;
  font-size:2rem;
}


/*追加分終わり*/



/*----------------------------------------------------
	Anyway Feedback
----------------------------------------------------*/
.feedback {
  position: relative;
  margin: 90px auto 60px;
  padding: 0.5em 40px;
  text-align: center;
  max-width: 720px;
}
.feedback:before, .feedback:after {
  position: absolute;
  top: 0;
  display: block;
  content: "";
  width: 4px;
  height: 100%;
  border: 1px solid #bbb;
}
@media only screen and (max-width: 767px) {
  .feedback:before, .feedback:after {
    display: none;
  }
}
.feedback:before {
  border-right-style: none;
  left: 0;
}
.feedback:after {
  border-left-style: none;
  right: 0;
}
.feedback .feedback_title {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 400;
  margin: 0 auto 6px;
  position: relative;
  line-height: 140%;
}
.feedback .message,
.feedback .status {
  display: block;
}
.feedback .status {
  margin-top: 1px;
  font-size: 14px;
  font-size: 1.4rem;
}
.feedback a {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  margin: 0.5em 0.25em;
  padding: 0.5em 2em;
  border: 1px solid #ccc;
  border-radius: 2px;
  color: #222;
  text-decoration: none;
  font-size: 14px;
  font-size: 1.4rem;
}
.feedback a:hover {
  background: #222;
  color: #fff;
}

/*----------------------------------------------------
	1つ前のページに戻る
----------------------------------------------------*/
#history_back {
  text-decoration: none;
  font-family: "Noto Sans Japanese", "Noto Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, verdana, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
  border-style: none;
  background: #222;
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  padding: 10px 30px;
  position: fixed;
  left: 15px;
  bottom: 15px;
  z-index: 99999;
  line-height: 1em;
  cursor: pointer;
}
#history_back::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "\f104";
  margin: 0 5px 0 -10px;
  font-size: 24px;
  vertical-align: middle;
}

/*----------------------------------------------------
	アニメーション
----------------------------------------------------*/
/*タブレットでは意味がない*/
.hover_effect01 .effect {
  display: block;
  position: relative;
  overflow: hidden;
  line-height: 1;
}
.hover_effect01 .effect .mask {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  opacity: 0;
  overflow: visible;
  box-sizing: border-box;
  transition: all 0.4s ease-in-out;
  background: rgba(0, 0, 0, 0.7);
}
.hover_effect01 .effect .ico {
  color: #fff;
  font-size: 24px;
  position: absolute;
  display: block;
  left: 50%;
  top: 50%;
  margin: -12px 0 0 -12px;
  opacity: 0;
  transform: scale(0, 0);
  transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}
.hover_effect01 .effect:hover .mask {
  opacity: 1;
}
.hover_effect01 .effect:hover .ico {
  opacity: 1;
  transform: scale(1, 1);
}

.hover_effect02 .effect {
  display: block;
  position: relative;
  overflow: hidden;
  line-height: 1;
}
.hover_effect02 .effect .mask {
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  margin: auto;
  width: 0px;
  height: 0px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  opacity: 0;
  -webkit-transition: .3s ease;
  transition: .3s ease;
}
.page-pro9ex .hover_effect02 .effect .mask {
  /* PRO9EX */
  background: rgba(48, 123, 209, 0.7);
}
.page-neo3 .hover_effect02 .effect .mask {
  /* Neo3 */
  background: rgba(136, 136, 136, 0.7);
}
.page-reform-designer2 .hover_effect02 .effect .mask {
  /* リフォームデザイナー */
  background: rgba(207, 113, 25, 0.7);
}
.page-pro9 .hover_effect02 .effect .mask {
  /* PRO9 */
  background: rgba(131, 0, 8, 0.7);
}
.hover_effect02 .effect .ico {
  text-align: center;
  width: 24px;
  height: 24px;
  color: #fff;
  font-size: 24px;
  position: absolute;
  display: block;
  left: 50%;
  top: 50%;
  margin: -12px 0 0 -12px;
  opacity: 0;
  transform: scale(0, 0);
  transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}
.page-pro9ex .hover_effect02 .effect .ico {
  /* PRO9EX */
}
.page-neo3 .hover_effect02 .effect .ico {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .hover_effect02 .effect .ico {
  /* リフォームデザイナー */
}
.page-pro9 .hover_effect02 .effect .ico {
  /* PRO9 */
}
.hover_effect02 .effect:hover .mask {
  opacity: 1;
  width: 100%;
  height: 100%;
}
.hover_effect02 .effect:hover .ico {
  opacity: 1;
  transform: scale(1, 1);
  transition-delay: 0.1s;
}

/*----------------------------------------------------
	共通タイトルスタイル
----------------------------------------------------*/
._uni_ttl_style01 {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 auto 30px;
  padding: 25px 15px;
  font-weight: 700;
  border: 1px solid #aaa;
  border-top: 1px solid #011287;
}
@media only screen and (max-width: 767px) {
  ._uni_ttl_style01 {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 10px 15px;
    margin-bottom: 20px;
  }
}

._uni_ttl_style02 {
  color: #011287;
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 auto 40px;
  padding: 0 30px;
  font-weight: 700;
  border: 1px solid #bbb;
  line-height: 58px;
  min-height: 60px;
  position: relative;
}
._uni_ttl_style02::after {
  content: "";
  width: 5px;
  height: 100%;
  position: absolute;
  left: -1px;
  top: -1px;
  display: block;
  background: #011287;
  border: 1px solid #011287;
}
@media only screen and (max-width: 767px) {
  ._uni_ttl_style02 {
    font-size: 20px;
    font-size: 2rem;
    line-height: 38px;
    min-height: 40px;
    padding: 0 15px;
    margin-bottom: 30px;
  }
}

._uni_ttl_style03 {
  color: #89612b;
  font-size: 20px;
  font-size: 2rem;
  margin: 0 auto 15px;
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  ._uni_ttl_style03 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}

._uni_ttl_style04 {
  color: #011287;
  font-size: 18px;
  font-size: 1.8rem;
  margin: 0 auto 15px;
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  ._uni_ttl_style04 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

._uni_ttl_style05, ._uni_ttl_style06 {
  font-size: 27px;
  font-size: 2.7rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin: 20px auto 30px;
}

._uni_ttl_style06 {
  text-align: center;
}

._uni_ttl_style08 {
  font-size: 19px;
  font-size: 1.9rem;
  position: relative;
  background: url(../img/bg/slash03.png);
  margin: 0 auto 15px;
  padding: 25px;
  font-weight: 500;
}
._uni_ttl_style08::before {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  content: "";
  height: 0;
  width: 0;
  border: 8px solid transparent;
  border-top-color: #011287;
  border-left-color: #011287;
}

._uni_numttl_style {
  color: #de8238;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 400;
  position: relative;
  margin: 50px auto 30px;
  padding: 3px 0 0 45px;
  line-height: 30px;
  min-height: 36px;
}
._uni_numttl_style:first-child {
  margin-top: 0;
}
._uni_numttl_style.num1::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "1";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num2::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "2";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num3::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "3";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num4::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "4";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num5::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "5";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num6::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "6";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num7::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "7";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num8::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "8";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num9::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "9";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num10::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "10";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num11::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "11";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num12::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "12";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num13::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "13";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num14::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "14";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num15::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "15";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num16::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "16";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num17::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "17";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num18::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "18";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num19::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "19";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
._uni_numttl_style.num20::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "20";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}

/*----------------------------------------------------
	各ページのスタイル
----------------------------------------------------*/
/* 住空間シリーズトップページ */
/* 住空間シリーズトップページ */
#series_slider {
  /* Control Nav */
  /* Direction Nav */
}
#series_slider .flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: -40px;
  text-align: center;
}
#series_slider .flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}
#series_slider .flex-control-paging li a {
  width: 14px;
  height: 14px;
  display: block;
  background: #aaa;
  cursor: pointer;
  text-indent: -9999px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}
#series_slider .flex-control-paging li a:hover {
  background: #e88f42;
}
#series_slider .flex-control-paging li a.flex-active {
  background: #e88f42;
  cursor: default;
}
#series_slider .flex-direction-nav {
  *height: 0;
}
#series_slider .flex-direction-nav a {
  text-decoration: none;
  text-indent: -9999px;
  display: block;
  width: 30px;
  height: 100%;
  margin: 0;
  position: absolute;
  top: 0;
  z-index: 10;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  transition: all .3s ease;
}
#series_slider .flex-direction-nav .flex-prev {
  left: -40px;
  background: url(../img/ico/fa-angle-left.png) no-repeat center center;
}
#series_slider .flex-direction-nav .flex-next {
  right: -40px;
  background: url(../img/ico/fa-angle-right.png) no-repeat center center;
}
#series_slider .flex-direction-nav .flex-disabled {
  cursor: default;
}
@media only screen and (max-width: 767px) {
  #series_slider {
    margin-top: 0 !important;
  }
  #series_slider .flex-direction-nav .flex-prev {
    left: 0;
  }
  #series_slider .flex-direction-nav .flex-next {
    right: 0;
  }
}

#series .inner > nav, #series .inner > div {
  margin: 50px auto;
}
@media only screen and (max-width: 767px) {
  #series .inner > nav, #series .inner > div {
    margin: 20px auto;
  }
}
#series .seriesNav h2 {
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  background: url(../../img/index/bg_ttl01.png) no-repeat center 80%;
}
@media only screen and (max-width: 767px) {
  #series .seriesNav h2 {
    background-position: center center;
    background-size: contain;
  }
}
#series .seriesNav h2 strong {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 700;
  display: block;
}
@media only screen and (max-width: 767px) {
  #series .seriesNav h2 strong {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
#series .seriesNav ul li {
  margin-top: 30px;
  min-height: 240px;
  background-color: #f3f4f6;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 100%;
  position: relative;
}
@media only screen and (max-width: 979px) {
  #series .seriesNav ul li {
    float: none;
    width: 100%;
    margin: 20px 0 0;
    background-size: 50% auto;
    min-height: 0;
  }
}
#series .seriesNav ul li.archipro {
  background-image: url(../../img/index/series_p05.jpg);
}
#series .seriesNav ul li.pro9ex {
  background-image: url(../../img/index/series_p01.jpg);
}
#series .seriesNav ul li.pro9 {
  background-image: url(../../img/index/series_p02.jpg);
}
#series .seriesNav ul li.neo3 {
  background-image: url(../../img/index/series_p03.jpg);
}
#series .seriesNav ul li.reform {
  background-image: url(../../img/index/series_p04.jpg);
}
#series .seriesNav ul li .package {
  width: 45%;
  text-align: center;
  padding: 50px 0 15px;
}
@media only screen and (max-width: 979px) {
  #series .seriesNav ul li .package {
    padding-top: 30px;
  }
}
#series .seriesNav ul li .package img {
  width: auto;
  height: auto;
  max-height: 175px;
}
@media only screen and (max-width: 767px) {
  #series .seriesNav ul li .package img {
    max-height: 130px;
    min-height: 0;
  }
}
#series .seriesNav ul li .lead {
  font-size: 16px;
  font-size: 1.6rem;
  width: 45%;
  text-align: center;
  position: absolute;
  left: 0;
  top: 15px;
}
@media only screen and (max-width: 979px) {
  #series .seriesNav ul li .lead {
    top: 5px;
  }
}
#series .seriesNav ul li .more {
  margin: 0;
  position: absolute;
  right: 15px;
  bottom: 15px;
}
#series .seriesNav ul li .more a {
  display: block;
  background: #222;
  border: 1px solid #555;
  color: #fff;
  text-decoration: none;
  text-align: center;
  padding: 5px 25px 5px 15px;
  border-radius: 2px;
}
#series .seriesNav ul li .more a:before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f0da";
  margin-right: 10px;
}
#series .forHomeUse .heading,#series .forProUse .heading,#series .forMedicalUse .heading {
  width: 275px;
  padding: 0 0 0 40px;
  position: relative;
  float: left;
}
@media only screen and (max-width: 767px) {
  #series .forHomeUse .heading,  #series .forProUse .heading,  #series .forMedicalUse .heading {
    width: auto;
    float: none;
  }
}
#series .forHomeUse .heading h3,#series .forProUse .heading h3,#series .forMedicalUse .heading h3 {
  margin: 0 0 10px;
}
#series .forHomeUse .heading h3:before {
  font-size: 23px;
  font-family: FontAwesome;
  font-weight: normal !important;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  content: "\f015";
  font-size: 25px;
}
#series .forProUse .heading h3:before {
  font-size: 23px;
  font-family: FontAwesome;
  font-weight: normal !important;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  content: "\f1ad";
  font-size: 25px;
}
#series .forMedicalUse .heading h3:before {
  font-size: 23px;
  font-family: FontAwesome;
  font-weight: normal !important;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  content: "\f0f8";
  font-size: 25px;
}
#series .useFor {
  background: #f3f4f6;
  padding: 30px;
  overflow: hidden;
  border: 1px solid #ddd;
  border-top: 1px solid #011287;
}
@media only screen and (max-width: 767px) {
  #series .useFor {
    padding: 15px;
    margin: 30px 0 !important;
  }
}
#series .useFor .row + .row, #series .useFor .function_list_general .function ul + .row, .function_list_general .function #series .useFor ul + .row,
#series .useFor .function_list_general .function ol + .row,
.function_list_general .function #series .useFor ol + .row, #series .useFor .single.interview .ba + .row, .single.interview #series .useFor .ba + .row, #series .useFor .function_list_general .function .row + ul, .function_list_general .function #series .useFor .row + ul, #series .useFor .function_list_general .function ul + ul, .function_list_general .function #series .useFor ul + ul,
#series .useFor .function_list_general .function ol + ul,
.function_list_general .function #series .useFor ol + ul, #series .useFor .single.interview .function_list_general .function .ba + ul, .function_list_general .function #series .useFor .single.interview .ba + ul, .single.interview #series .useFor .function_list_general .function .ba + ul, .function_list_general .function .single.interview #series .useFor .ba + ul,
#series .useFor .function_list_general .function .row + ol,
.function_list_general .function #series .useFor .row + ol,
#series .useFor .function_list_general .function ul + ol,
.function_list_general .function #series .useFor ul + ol,
#series .useFor .function_list_general .function ol + ol,
.function_list_general .function #series .useFor ol + ol,
#series .useFor .single.interview .function_list_general .function .ba + ol,
.function_list_general .function #series .useFor .single.interview .ba + ol,
.single.interview #series .useFor .function_list_general .function .ba + ol,
.function_list_general .function .single.interview #series .useFor .ba + ol, #series .useFor .single.interview .row + .ba, .single.interview #series .useFor .row + .ba, #series .useFor .function_list_general .function .single.interview ul + .ba, .single.interview #series .useFor .function_list_general .function ul + .ba, .function_list_general .function #series .useFor .single.interview ul + .ba, .single.interview .function_list_general .function #series .useFor ul + .ba,
#series .useFor .function_list_general .function .single.interview ol + .ba,
.single.interview #series .useFor .function_list_general .function ol + .ba,
.function_list_general .function #series .useFor .single.interview ol + .ba,
.single.interview .function_list_general .function #series .useFor ol + .ba, #series .useFor .single.interview .ba + .ba, .single.interview #series .useFor .ba + .ba {
  margin-top: 30px;
}
#series .useFor .heading {
  width: 275px;
  padding: 0 0 0 40px;
  position: relative;
  float: left;
}
@media only screen and (max-width: 767px) {
  #series .useFor .heading {
    width: auto;
    float: none;
  }
}
#series .useFor .heading h3 {
  color: #011287;
  margin: 0 0 10px;
}
#series .useFor .heading h3:before {
  font-size: 23px;
  font-family: FontAwesome;
  font-weight: normal !important;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}
#series .useFor .forHome .heading h3:before {
  content: "\f015";
  font-size: 25px;
}
#series .useFor .forSchool .heading h3:before {
  content: "\f0f3";
}
#series .useFor .forCorp .heading h3:before {
  content: "\f0f7";
}

#series .useFor .nav {
  width: 625px;
  float: right;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  #series .useFor .nav {
    width: auto;
    float: none;
  }
}
#series .useFor .nav li {
  width: 305px;
  float: left;
  margin-left: 15px;
}
@media only screen and (max-width: 767px) {
  #series .useFor .nav li {
    width: 48% !important;
    float: left;
    width: auto;
    margin-left: 0;
    margin-top: 10px;
  }
  #series .useFor .nav li:nth-child(even) {
    float: right;
  }
}
#series .useFor .nav li:first-child {
  margin-left: 0;
}
@media only screen and (max-width: 767px) {
  #series .purposeNav .col, #series .purposeNav .function_list_general .function ul li, .function_list_general .function ul #series .purposeNav li,
  #series .purposeNav .function_list_general .function ol li,
  .function_list_general .function ol #series .purposeNav li {
    text-align: center;
    width: 90%;
    max-width: 306px;
    margin: 0 auto;
    float: none;
  }
  #series .purposeNav .col + .col, #series .purposeNav .function_list_general .function ul li + .col, .function_list_general .function ul #series .purposeNav li + .col,
  #series .purposeNav .function_list_general .function ol li + .col,
  .function_list_general .function ol #series .purposeNav li + .col, #series .purposeNav .function_list_general .function ul .col + li, .function_list_general .function ul #series .purposeNav .col + li, #series .purposeNav .function_list_general .function ul li + li, .function_list_general .function ul #series .purposeNav li + li,
  .function_list_general .function ol #series .purposeNav ul li + li,
  #series .purposeNav .function_list_general .function ol .col + li,
  .function_list_general .function ol #series .purposeNav .col + li,
  .function_list_general .function ul #series .purposeNav ol li + li,
  #series .purposeNav .function_list_general .function ol li + li,
  .function_list_general .function ol #series .purposeNav li + li {
    margin-top: 15px;
  }
  #series .purposeNav .caption {
    text-align: left;
  }
}
#series .campaignAndSupport {
  overflow: hidden;
}
#series .campaignAndSupport .campaign li + li {
  margin-top: -1px;
}
@media only screen and (max-width: 979px) {
  #series .campaignAndSupport .support {
    margin-top: 20px;
  }
}
#series .campaignAndSupport .support li + li {
  margin-top: -1px;
}
#series .campaignAndSupport .support li a {
  display: block;
  overflow: hidden;
  text-decoration: none;
  color: #222;
  position: relative;
  border: 1px solid #ddd;
  position: relative;
  padding: 10px 30px 10px 65px;
  line-height: 160%;
}
#series .campaignAndSupport .support li a:after {
  font-family: FontAwesome;
  font-weight: normal !important;
  color: #999;
  content: "\f105";
  font-size: 25px;
  position: absolute;
  top: 50%;
  left: 96%;
  margin-top: -13px;
}
@media only screen and (min-width: 980px) {
  #series .campaignAndSupport .support li a:after {
    left: 93%;
  }
}
#series .campaignAndSupport .support li a strong {
  display: block;
  font-weight: 700;
  font-size: 18px;
  font-size: 1.8rem;
}
#series .campaignAndSupport .support li.learning a {
  background: url(../../img/index/support_ico01.png) no-repeat 15px center;
}
#series .campaignAndSupport .support li.download a {
  background: url(../../img/index/support_ico02.png) no-repeat 15px center;
}
#series .campaignAndSupport .support li.supportInfo a {
  background: url(../../img/index/support_ico03.png) no-repeat 18px center;
}
#series .campaignAndSupport .support li.user a {
  background: url(../../img/index/support_ico04.png) no-repeat 18px center;
}
#series .seriesLearning .caption {
  margin-top: 10px;
}
@media only screen and (max-width: 979px) {
  #series .seriesLearning .caption {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  #series .seriesLearning .col, #series .seriesLearning .function_list_general .function ul li, .function_list_general .function ul #series .seriesLearning li,
  #series .seriesLearning .function_list_general .function ol li,
  .function_list_general .function ol #series .seriesLearning li {
    text-align: center;
    width: 90%;
    max-width: 306px;
    margin: 0 auto;
    float: none;
  }
  #series .seriesLearning .col + .col, #series .seriesLearning .function_list_general .function ul li + .col, .function_list_general .function ul #series .seriesLearning li + .col,
  #series .seriesLearning .function_list_general .function ol li + .col,
  .function_list_general .function ol #series .seriesLearning li + .col, #series .seriesLearning .function_list_general .function ul .col + li, .function_list_general .function ul #series .seriesLearning .col + li, #series .seriesLearning .function_list_general .function ul li + li, .function_list_general .function ul #series .seriesLearning li + li,
  .function_list_general .function ol #series .seriesLearning ul li + li,
  #series .seriesLearning .function_list_general .function ol .col + li,
  .function_list_general .function ol #series .seriesLearning .col + li,
  .function_list_general .function ul #series .seriesLearning ol li + li,
  #series .seriesLearning .function_list_general .function ol li + li,
  .function_list_general .function ol #series .seriesLearning li + li {
    margin-top: 15px;
  }
  #series .seriesLearning .caption {
    text-align: left;
  }
}
#series .seriesOption {
  background: #f3f4f6 url(../../img/index/series_bg01.png) no-repeat center bottom;
  padding: 30px 30px 110px;
}
@media only screen and (max-width: 767px) {
  #series .seriesOption {
    margin-top: 40px !important;
    padding: 15px 15px 60px;
    background-size: 100% auto;
  }
}
#series .seriesOption .heading01 {
  font-size: 22px;
  font-size: 2.2rem;
  border-bottom: 1px solid #aaa;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
#series .seriesOption .option {
  margin: -10px 0 40px;
}
@media only screen and (max-width: 767px) {
  #series .seriesOption .option {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 980px) {
  #series .seriesOption .option li {
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  #series .seriesOption .option li {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 767px) {
  #series .seriesOption .option li {
    width: 100%;
    margin: 15px 0 0;
  }
  #series .seriesOption .option li img {
    max-width: 35%;
    margin-right: 5%;
    float: left;
  }
}
#series .seriesOption .option li .heading02 {
  font-size: 16px;
  font-size: 1.6rem;
  color: #1e64b3;
  margin: 10px 0;
}
@media only screen and (max-width: 767px) {
  #series .seriesOption .option li .heading02 {
    overflow: hidden;
    margin: 0 0 5px;
  }
}
@media only screen and (max-width: 767px) {
  #series .seriesOption .option li p {
    overflow: hidden;
    line-height: 1.4;
    margin: 0;
  }
}
#series .seriesOption .nav li {
  margin-top: 25px;
}
@media only screen and (max-width: 767px) {
  #series .seriesOption .nav li {
    margin-top: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  #series .seriesFB > .col, #series .function_list_general .function ul .seriesFB > li, .function_list_general .function ul #series .seriesFB > li,
  #series .function_list_general .function ol .seriesFB > li,
  .function_list_general .function ol #series .seriesFB > li {
    float: none;
    max-width: 475px;
    margin: auto;
  }
}
@media only screen and (max-width: 767px) {
  #series .seriesFB .plugin .embed {
    display: none;
  }
}
#series .seriesFB .plugin .body {
  display: none;
}
#series .seriesFB .friend {
  background: #3b5998 url(../../img/index/series_fb.jpg) no-repeat left center;
  background-size: 30% auto;
}
#series .seriesFB .friend > a {
  display: block;
  color: #222;
  text-decoration: none;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  #series .seriesFB .friend {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px) {
  #series .seriesFB .friend {
    background: transparent !important;
  }
}
#series .seriesFB .friend .body {
  margin-left: 30%;
  padding: 110px 0 15px;
  background: #fff url(../../img/index/series_bg02.jpg) no-repeat center top;
  background-size: auto 110px;
}
@media only screen and (max-width: 767px) {
  #series .seriesFB .friend .body {
    display: none;
  }
}
#series .seriesFB .friend .body .heading {
  font-weight: 700;
  color: #1e64b3;
  margin: 15px 0 10px 20px;
}
@media only screen and (min-width: 980px) {
  #series .seriesFB .friend .body .heading {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
#series .seriesFB .friend .body .heading a {
  color: #1e64b3;
  text-decoration: none;
}
#series .seriesFB .friend .body .heading + p {
  margin-left: 20px;
}
#series .seriesFB .link {
  display: none;
}
@media only screen and (max-width: 767px) {
  #series .seriesFB .link {
    line-height: 120%;
    display: block !important;
    margin: 0 0 10px !important;
    color: #fff !important;
  }
  #series .seriesFB .link a {
    color: #fff !important;
    border-radius: 2px;
    border-top: 1px solid #4c6bab;
    border-bottom: 1px solid #2f4677;
    position: relative;
    padding: 10px 15px 10px 60px !important;
    background: #3b5998 url(../img/ico/FB-f-Logo__blue_144_03.png) no-repeat 13px center !important;
    background-size: auto 40px !important;
    text-decoration: none;
    display: block;
  }
  #series .seriesFB .link a::before {
    display: block;
    content: "";
    width: 0;
    height: 80%;
    position: absolute;
    left: 45px;
    top: 10%;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
  }
  #series .seriesFB .link .heading {
    font-weight: 700;
    color: #fff;
    margin: 0 0 5px !important;
    font-size: 14px;
    font-size: 1.4rem;
  }
  #series .seriesFB .link .heading + p {
    margin-left: 0 !important;
    font-size: 12px;
    font-size: 1.2rem;
  }
}
#series .subTtl01 {
  font-size: 22px;
  font-size: 2.2rem;
  border-left: 5px solid #011287;
  line-height: 100%;
  margin: 0 0 20px;
  padding: 0 15px;
}
@media only screen and (max-width: 767px) {
  #series .subTtl01 {
    margin-top: 40px;
  }
}

/* 製品ページ共通パーツ */
/* 製品ページ共通サブナビゲーション */
.product_sub_nav {
  position: absolute;
  left: 0;
  top: 50px;
  z-index: 10000;
  width: 100%;
  height: 50px;
  line-height: 75px;
}
.product_sub_nav .inner {
  position: static;
}
@media only screen and (max-width: 767px) {
  .product_sub_nav {
    left: 0;
    top: 0;
    line-height: 40px;
    height: auto;
  }
  body[class*="child"] .product_sub_nav {
    position: static;
  }
}
.product_sub_nav .product_logo {
  float: left;
  vertical-align: bottom;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_sub_nav .product_logo {
    margin-left: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .product_sub_nav .product_logo {
    float: none;
    position: absolute;
    left: 20px;
    top: 60px;
    z-index: 10000;
  }
  body[class*="child"] .product_sub_nav .product_logo {
    top: 20px;
  }
}
.product_sub_nav .product_logo a {
  display: block;
  height: 0;
  overflow: hidden;
  padding: 50px 0 0;
}
@media only screen and (max-width: 767px) {
  .product_sub_nav .product_logo a {
    width: 160px !important;
    background-size: 100% auto !important;
  }
}
.page-pro9ex .product_sub_nav .product_logo a, .page-pro9ex-child .product_sub_nav .product_logo a {
  /* PRO9EX */
  background: url(../../img/pro9ex/logo_mdex.png) no-repeat;
  width: 245px;
}
.page-neo3 .product_sub_nav .product_logo a, .page-neo3-child .product_sub_nav .product_logo a {
  /* Neo3 */
  background: url(../../img/neo3/logo_neo3.png) no-repeat;
  width: 232px;
}
.page-reform-designer2 .product_sub_nav .product_logo a, .page-reform-designer2-child .product_sub_nav .product_logo a {
  /* リフォームデザイナー */
  background: url(../../img/rd2/logo_rd2.png) no-repeat;
  width: 268px;
}
.page-pro9 .product_sub_nav .product_logo a, .page-pro9-child .product_sub_nav .product_logo a {
  /* PRO9 */
  background: url(../../img/pro9/logo_pro9.png) no-repeat;
  width: 274px;
}
.product_sub_nav .sub_nav {
  overflow: hidden;
  float: right;
  vertical-align: bottom;
  letter-spacing: -0.05em;
}
@media only screen and (max-width: 979px) {
  .product_sub_nav .sub_nav {
    display: none;
  }
}
.product_sub_nav .sub_nav ul {
  width: 100%;
  vertical-align: bottom;
}
@media only screen and (max-width: 767px) {
  .product_sub_nav .sub_nav ul {
    display: none;
  }
}
.product_sub_nav .sub_nav ul li {
  text-align: center;
  display: inline-block;
}
@media only screen and (max-width: 767px) {
  .product_sub_nav .sub_nav ul li {
    display: block;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }
}
.product_sub_nav .sub_nav ul li + li {
  margin-left: 20px;
}
.product_sub_nav .sub_nav ul li a {
  color: #222;
  text-decoration: none;
  display: inline-block;
}
.page-pro9ex .product_sub_nav .sub_nav ul li a, .page-pro9ex-child .product_sub_nav .sub_nav ul li a {
  /* PRO9EX */
  color: #fff;
}
.page-neo3 .product_sub_nav .sub_nav ul li a {
  /* Neo3 */
}
.page-neo3-child .product_sub_nav .sub_nav ul li a {
  /* Neo3 */
}
.page-reform-designer2 .product_sub_nav .sub_nav ul li a {
  /* リフォームデザイナー */
}
.page-reform-designer2-child .product_sub_nav .sub_nav ul li a {
  /* リフォームデザイナー */
}
.page-pro9 .product_sub_nav .sub_nav ul li a {
  /* PRO9 */
}
.page-pro9-child .product_sub_nav .sub_nav ul li a {
  /* PRO9 */
}
.product_sub_nav.fixed {
  background: #fff;
  position: fixed !important;
  left: 0;
  top: -51px;
  height: 51px;
  border-bottom: 1px solid #ccc;
  z-index: 10000;
  line-height: 50px;
}
@media only screen and (max-width: 979px) {
  .product_sub_nav.fixed {
    display: none;
  }
}
@media only screen and (max-width: 979px) {
  .product_sub_nav.fixed .product_logo {
    display: none;
  }
}
.product_sub_nav.fixed .product_logo a {
  color: #222;
  display: block;
  height: 0;
  padding: 51px 0 0;
  overflow: hidden;
}
.page-pro9ex .product_sub_nav.fixed .product_logo a, .page-pro9ex-child .product_sub_nav.fixed .product_logo a {
  /* PRO9EX */
  background: url(../../img/pro9ex/ico_mdex.png) no-repeat;
  background-size: auto 51px !important;
  width: 51px;
}
.page-neo3 .product_sub_nav.fixed .product_logo a, .page-neo3-child .product_sub_nav.fixed .product_logo a {
  /* Neo3 */
  background: url(../../img/neo3/ico_neo3.png) no-repeat;
  background-size: auto 51px !important;
  width: 51px;
}
.page-reform-designer2 .product_sub_nav.fixed .product_logo a, .page-reform-designer2-child .product_sub_nav.fixed .product_logo a {
  /* リフォームデザイナー */
  background: url(../../img/rd2/ico_rd2.png) no-repeat;
  background-size: auto 51px !important;
  width: 51px;
}
.page-pro9 .product_sub_nav.fixed .product_logo a, .page-pro9-child .product_sub_nav.fixed .product_logo a {
  /* PRO9 */
  background: url(../../img/pro9/ico_pro9.png) no-repeat;
  background-size: auto 51px !important;
  width: 51px;
}
.product_sub_nav.fixed li a {
  color: #222 !important;
  padding: 0 7px;
}
@media only screen and (max-width: 767px) {
  .product_sub_nav.fixed li a {
    color: #fff !important;
  }
}
.product_sub_nav.fixed li.buy {
  position: relative;
}
@media only screen and (min-width: 980px) {
  .product_sub_nav.fixed li.buy {
    line-height: 25px;
    padding: 12px 0;
  }
  .product_sub_nav.fixed li.buy a {
    padding: 0 30px;
    border: 1px solid;
    border-radius: 2px;
  }
  .page-pro9ex .product_sub_nav.fixed li.buy a, .page-pro9ex-child .product_sub_nav.fixed li.buy a {
    /* PRO9EX */
    color: #307bd1 !important;
    border-color: #307bd1;
  }
  .page-neo3 .product_sub_nav.fixed li.buy a, .page-neo3-child .product_sub_nav.fixed li.buy a {
    /* Neo3 */
    color: #830008 !important;
    border-color: #830008;
  }
  .page-reform-designer2 .product_sub_nav.fixed li.buy a, .page-reform-designer2-child .product_sub_nav.fixed li.buy a {
    /* リフォームデザイナー */
    color: #CF7119 !important;
    border-color: #CF7119;
  }
  .page-pro9 .product_sub_nav.fixed li.buy a, .page-pro9-child .product_sub_nav.fixed li.buy a {
    /* PRO9 */
    color: #830008 !important;
    border-color: #830008;
  }
  .product_sub_nav.fixed li.buy a::after {
    font-family: FontAwesome;
    font-weight: normal !important;
    content: "\f105";
    position: absolute;
    right: 10px;
    top: 13px;
  }
}

.sub_nav_drop {
  display: none;
  float: none;
  width: 100%;
  color: #fff;
  text-align: center;
  z-index: 99999;
  line-height: 180%;
}
body[class*="child"] .sub_nav_drop {
  position: static;
}
.page-pro9ex .sub_nav_drop, .page-pro9ex-child .sub_nav_drop {
  /* PRO9EX */
  background: #307bd1;
}
.page-neo3 .sub_nav_drop, .page-neo3-child .sub_nav_drop {
  /* Neo3 */
  background: #830008;
}
.page-reform-designer2 .sub_nav_drop, .page-reform-designer2-child .sub_nav_drop {
  /* リフォームデザイナー */
  background: #CF7119;
}
.page-pro9 .sub_nav_drop, .page-pro9-child .sub_nav_drop {
  /* PRO9 */
  background: #830008;
}
.sub_nav_drop a {
  display: block;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  position: relative;
  color: #fff;
  padding: 10px 0;
  text-decoration: none;
}
.sub_nav_drop a::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 18px;
  content: "\f105";
  position: absolute;
  right: 10px;
  top: 5px;
}
.sub_nav_drop.fixed {
  position: fixed;
  left: 0;
}
@media only screen and (min-width: 980px) {
  .sub_nav_drop.fixed {
    display: none;
  }
}

.sub_nav_heading {
  display: none;
  position: relative;
  padding: 10px 0;
}
.sub_nav_heading::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f0c9";
  font-size: 24px;
  position: absolute;
  right: 0;
  top: 10px;
  padding: 0 8px;
}
.sub_nav_heading.ui-accordion-header-active::after {
  content: "\f00d";
}
@media only screen and (max-width: 767px) {
  .sub_nav_heading {
    display: block;
  }
}

/* 製品ページ下層共通 */
.product_lower {
  background-color: #000;
  background-repeat: no-repeat;
  background-position: center top;
  background-attachment: fixed;
  background-size: cover;
  padding: 0 0 60px;
}
@media only screen and (max-width: 767px) {
  .product_lower {
    background-size: 120% auto !important;
  }
}
.page-pro9ex-child .product_lower {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/lower_mdex.jpg);
}
.page-neo3-child .product_lower {
  /* Neo3 */
  background-image: url(../../img/neo3/lower_mdex.jpg);
  background-color: #e8ded5;
}
.page-reform-designer2-child .product_lower {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/lower_mdex.jpg);
  background-color: #e8ded5;
}
.page-pro9-child .product_lower {
  /* PRO9 */
  background-image: url(../../img/pro9/lower_mdex.jpg);
  background-color: #f3f3f3;
}

.product_lower_heading {
  padding: 220px 0 40px;
  text-align: center;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_lower_heading {
    padding-top: 120px;
  }
}
@media only screen and (max-width: 767px) {
  .product_lower_heading {
    padding: 70px 0 0;
    min-height: 110px;
  }
}
.product_lower_heading h2 {
  font-size: 34px;
  font-size: 3.4rem;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .product_lower_heading h2 {
    font-size: 20px;
    font-size: 2rem;
    text-align: right;
    padding-right: 20px;
  }
}
.page-pro9ex-child .product_lower_heading {
  /* PRO9EX */
  color: #fff;
}
.page-neo3-child .product_lower_heading {
  /* Neo3 */
}
.page-reform-designer2-child .product_lower_heading {
  /* リフォームデザイナー */
}
.page-pro9-child .product_lower_heading {
  /* PRO9 */
}

.product_lower_area {
  background: rgba(0, 0, 0, 0.5);
  padding: 10px;
  margin: 0 auto;
  max-width: 980px;
  border-radius: 4px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_lower_area {
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 15px;
  }
}
.product_lower_area .inner {
  max-width: 960px;
  min-height: 200px;
  background-color: #fff;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 0 6px 0 rgba(255, 255, 255, 0.7);
}

.product_lower_header01 {
  background: url(../img/bg/bg_graph01.png);
  padding: 26px 20px;
}
@media only screen and (max-width: 767px) {
  .product_lower_header01 {
    padding: 15px;
  }
}
.page-pro9ex-child .product_lower_header01 {
  /* PRO9EX */
  border-top: 1px solid #307bd1;
}
.page-neo3-child .product_lower_header01 {
  /* Neo3 */
}
.page-reform-designer2-child .product_lower_header01 {
  /* リフォームデザイナー */
}
.page-pro9-child .product_lower_header01 {
  /* PRO9 */
}
.page-pro9ex-child .product_lower_header01:first-child, .page-neo3-child .product_lower_header01:first-child, .page-reform-designer2-child .product_lower_header01:first-child, .page-pro9-child .product_lower_header01:first-child {
  border-top-style: none;
}
.product_lower_header01:first-child {
  border-top-style: none;
}
.product_lower_header01 .title {
  font-size: 32px;
  font-size: 3.2rem;
  padding: 30px 0 0 30px;
  background-repeat: no-repeat;
  background-position: left top;
}
@media only screen and (max-width: 767px) {
  .product_lower_header01 .title {
    font-size: 24px;
    font-size: 2.4rem;
    padding: 20px 0;
    background-image: none !important;
  }
}
.page-pro9ex-child .product_lower_header01 .title {
  /* PRO9EX */
  color: #307bd1;
  background-image: url(../img/bg/cross01.png);
}
.page-neo3-child .product_lower_header01 .title {
  /* Neo3 */
  color: #830008;
  background-image: url(../img/bg/cross03.png);
}
.page-reform-designer2-child .product_lower_header01 .title {
  /* リフォームデザイナー */
  color: #CF7119;
  background-image: url(../img/bg/cross04.png);
}
.page-pro9-child .product_lower_header01 .title {
  /* PRO9 */
  color: #830008;
  background-image: url(../img/bg/cross02.png);
}
.product_lower_header01 .content {
  padding: 15px 0 0 30px;
}
@media only screen and (max-width: 767px) {
  .product_lower_header01 .content {
    padding: 5px 0 0;
  }
}

/* 製品ページ共通購入リンク */
.product_common_purchase {
  color: #fff;
  padding: 75px 0;
  background-color: #000;
  background-position: center center;
  background-size: cover;
}
@media only screen and (max-width: 767px) {
  .product_common_purchase {
    padding: 30px 0;
  }
}
.page-pro9ex .product_common_purchase, .page-pro9ex-child .product_common_purchase {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/bg_purchase01.jpg);
}
.page-neo3 .product_common_purchase, .page-neo3-child .product_common_purchase {
  /* Neo3 */
  background-image: url(../../img/neo3/bg_purchase01.jpg);
}
.page-reform-designer2 .product_common_purchase, .page-reform-designer2-child .product_common_purchase {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/bg_purchase01.jpg);
}
.page-pro9 .product_common_purchase, .page-pro9-child .product_common_purchase {
  /* PRO9 */
  background-image: url(../../img/pro9/bg_purchase01.jpg);
}
.product_common_purchase .buy {
  position: relative;
  background-position: top center;
  background-repeat: no-repeat;
  padding-top: 80px;
}
@media only screen and (max-width: 979px) {
  .product_common_purchase .buy {
    overflow: hidden;
  }
}
.page-pro9ex .product_common_purchase .buy, .page-pro9ex-child .product_common_purchase .buy {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/ico_mdex.png);
}
.page-neo3 .product_common_purchase .buy, .page-neo3-child .product_common_purchase .buy {
  /* Neo3 */
  background-image: url(../../img/neo3/ico_neo3.png);
}
.page-reform-designer2 .product_common_purchase .buy, .page-reform-designer2-child .product_common_purchase .buy {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/ico_rd2.png);
}
.page-pro9 .product_common_purchase .buy, .page-pro9-child .product_common_purchase .buy {
  /* PRO9 */
  background-image: url(../../img/pro9/ico_pro9.png);
}
.product_common_purchase .buy .thumbnail {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -95px;
  max-width: 200px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_common_purchase .buy .thumbnail {
    position: static;
    float: left;
    max-width: 30%;
    margin: -20px 20px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .product_common_purchase .buy .thumbnail {
    display: none;
  }
}
.product_common_purchase .buy .textArea {
  text-align: center;
  overflow: hidden;
}
.product_common_purchase .buy .name {
  font-size: 30px;
  font-size: 3rem;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .product_common_purchase .buy .name {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.product_common_purchase .buy .content {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .product_common_purchase .buy .content {
    font-size: 12px;
    font-size: 1.2rem;
  }
}
.product_common_purchase .buy .link {
  margin-top: 30px;
}
.product_common_purchase .buy .btn01 {
  padding: 15px 80px;
}
.product_common_purchase .sp_thumbnail {
  display: none;
}
@media only screen and (max-width: 767px) {
  .product_common_purchase .sp_thumbnail {
    width: 20%;
    display: block;
    margin: 15px auto;
  }
}

/* 製品ページ共通活用コンテンツ */
.product_common_learning {
  padding: 60px 0;
}
@media only screen and (max-width: 767px) {
  .product_common_learning {
    display: none;
  }
}
.product_common_learning .row, .product_common_learning .function_list_general .function ul, .function_list_general .function .product_common_learning ul,
.product_common_learning .function_list_general .function ol,
.function_list_general .function .product_common_learning ol, .product_common_learning .single.interview .ba, .single.interview .product_common_learning .ba {
  margin-top: -30px;
}
.product_common_learning .col, .product_common_learning .function_list_general .function ul li, .function_list_general .function ul .product_common_learning li,
.product_common_learning .function_list_general .function ol li,
.function_list_general .function ol .product_common_learning li {
  margin-top: 30px;
}
.product_common_learning .thumbnail {
  display: block;
  margin-bottom: 5px;
}

.product_common_learning_heading {
  text-align: center;
  margin-bottom: 40px;
  font-size: 30px;
  font-size: 3rem;
  font-weight: 200;
}

/* Tips */
.tips_list > ul {
  margin-top: -20px;
}
.tips_list li {
  margin-top: 20px;
}
.tips_list li > a {
  display: block;
  text-decoration: none;
  color: #222;
}
.tips_list li .thumbnail {
  display: block;
}
.tips_list li .title,
.tips_list li .type {
  display: block;
  line-height: 1.4;
}
.tips_list li .title {
  margin-right: -0.5em;
  color: #866c43;
}
.tips_list li .type {
  padding-top: 5px;
  font-size: 13px;
  font-size: 1.3rem;
}

/* ライトボックスコンテンツ */
.popup {
  padding: 20px;
  max-width: 640px;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.popup .title {
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 200;
  margin-bottom: 15px;
}
.page-pro9ex .popup .title, .page-pro9ex-child .popup .title {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3 .popup .title, .page-neo3-child .popup .title {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .popup .title, .page-reform-designer2-child .popup .title {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9 .popup .title, .page-pro9-child .popup .title {
  /* PRO9 */
  color: #830008;
}
.popup .eyecatch {
  display: block;
  text-align: center;
}
.popup .excerpt {
  font-size: 15px;
  font-size: 1.5rem;
  padding: 30px 40px;
  margin: 30px -40px -40px;
  background: #eee;
  line-height: 1.6;
}
.popup .more {
  margin-top: 20px;
}
.popup .more a {
  position: relative;
}
.popup .more a .fa {
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -0.5em;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f105";
}

/*動作環境*/
.product_spec {
  margin: 40px;
}
@media only screen and (max-width: 767px) {
  .product_spec {
    margin: 15px;
  }
}
.product_spec th,
.product_spec td {
  text-align: left;
}
.product_spec th {
  background: #eee;
}

.product_spec_heading {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 60px 0 15px;
}
@media only screen and (max-width: 767px) {
  .product_spec_heading {
    font-size: 18px;
    font-size: 1.8rem;
    margin: 15px 0 5px;
  }
}

/* 製品トップページ */
/* 製品TOP | メインイメージエリア */
.product_top_main {
  background-color: #ddd;
  width: 100%;
  position: relative;
}
@media only screen and (min-width: 1920px) {
  .product_top_main {
    background-size: cover !important;
  }
}
@media only screen and (max-width: 767px) {
  .product_top_main {
    background-size: auto 130% !important;
  }
}
.page-pro9ex .product_top_main {
  /* PRO9EX */
  background: url(../../img/pro9ex/main_mdex.jpg) no-repeat center top;
  background-size: auto 130%;
}
.page-neo3 .product_top_main {
  /* Neo3 */
  background: url(../../img/neo3/main_neo3.jpg) no-repeat center center;
}
.page-reform-designer2 .product_top_main {
  /* リフォームデザイナー */
  background: url(../../img/rd2/main_rd2.jpg) no-repeat center center;
}
.page-reform-designer2 .product_top_main .flexslider {
  width: 660px;
  position: absolute;
  left: 53%;
  bottom: 0;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .page-reform-designer2 .product_top_main .flexslider {
    left: 45%;
  }
}
@media only screen and (max-width: 767px) {
  .page-reform-designer2 .product_top_main .flexslider {
    width: 400px;
    left: 45%;
  }
}
.page-pro9 .product_top_main {
  /* PRO9 */
  background: url(../../img/pro9/main_pro9.jpg) no-repeat center center;
}
.product_top_main .inner {
  min-height: 546px;
  position: relative;
  z-index: 2;
}
@media only screen and (max-width: 767px) {
  .product_top_main .inner {
    min-height: 240px;
  }
}

.product_top_main_heading {
  float:left;
  position: absolute;
  left: 55px;
  top: 190px;
}
.product_top_main_heading_right {
  position: absolute;
  float:right;
  top: 430px;
  right: 0px;
}
.reflection-img{
    width       350px;
    height      :85px;
    position    :relative;
    overflow    :hidden;
}
.reflection {
    height      :100%;
    width       :30px;
    position    :absolute;
    top         :-180px;
    left        :0;
    background-color: #fff;
    opacity     :0.5;
    transform: rotate(45deg);
    animation: reflection 2s ease-in-out 1;
    -webkit-transform: rotate(45deg);
    -webkit-animation: reflection 2s ease-in-out 1;
    -moz-transform: rotate(45deg);
    -moz-animation: reflection 2s ease-in-out 1;
    -ms-transform: rotate(45deg);
    -ms-animation: reflection 2s ease-in-out 1;
    -o-transform: rotate(45deg);
    -o-animation: reflection 2s ease-in-out 1;
}
 
@keyframes reflection {
    0% { transform: scale(0) rotate(45deg); opacity: 0; }
    80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { transform: scale(4) rotate(45deg); opacity: 1; }
    100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
    0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
    0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
    0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}
@media only screen and (max-width: 767px) {
  .product_top_main_heading {
    left: 20px;
    top: 120px;
  }
.product_top_main_heading_right {
    display:none;
}
}
.page-pro9ex .product_top_main_heading {
  /* PRO9EX */
  color: #fff;
}
.page-reform-designer2 .product_top_main_heading {
  /* リフォームデザイナー */
}
.product_top_main_heading h2 {
  font-size: 39.5px;
  font-size: 3.95rem;
  font-weight: 200;
  line-height: 140%;
  margin: 0 0 20px;
}
@media only screen and (max-width: 767px) {
  .product_top_main_heading h2 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.page-neo3 .product_top_main_heading h2 {
  /* Neo3 */
  color: #830008;
}
.page-pro9 .product_top_main_heading h2 {
  /* PRO9 */
  color: #830008;
}
.product_top_main_heading h2 small {
  font-size: 16px;
  font-size: 1.6rem;
  color: #999;
  display: block;
  line-height: 160%;
  letter-spacing: 0.25em;
  margin-left: 0.5em;
  margin-bottom: 13px;
}
@media only screen and (max-width: 767px) {
  .product_top_main_heading h2 small {
    font-size: 12px;
    font-size: 1.2rem;
  }
}
.product_top_main_heading p {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 160%;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .product_top_main_heading p {
    display: none;
  }
}

/* 製品TOP | イントロダクション */
.product_top_intro {
  padding: 60px 0 70px;
  overflow: hidden;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_top_intro {
    padding: 40px 0;
  }
}
@media only screen and (max-width: 767px) {
  .product_top_intro {
    padding: 30px 0 50px;
  }
}

.product_top_intro_heading {
  line-height: 43px;
  text-align: center;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 400;
  margin: 0 auto 50px;
  max-width: 640px;
  position: relative;
  line-height: 140%;
  padding: 0.25em 0;
}
@media only screen and (max-width: 767px) {
  .product_top_intro_heading {
    margin-bottom: 20px;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 160%;
  }
}
.product_top_intro_heading:before, .product_top_intro_heading:after {
  position: absolute;
  top: 0;
  display: block;
  content: "";
  width: 4px;
  height: 100%;
  border: 1px solid #bbb;
}
@media only screen and (max-width: 767px) {
  .product_top_intro_heading:before, .product_top_intro_heading:after {
    display: none;
  }
}
.product_top_intro_heading:before {
  border-right-style: none;
  left: 0;
}
.product_top_intro_heading:after {
  border-left-style: none;
  right: 0;
}
.product_top_intro_heading strong {
  font-weight: 400;
}
.page-pro9ex .product_top_intro_heading strong {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3 .product_top_intro_heading strong {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .product_top_intro_heading strong {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9 .product_top_intro_heading strong {
  /* PRO9 */
  color: #830008;
}

.product_top_intro_list,
.product_top_intro_slider {
  overflow: hidden;
  display: none;
}
.page-pro9ex .product_top_intro_list, .page-pro9ex
.product_top_intro_slider {
  /* PRO9EX */
  background: url(../../img/pro9ex/bg_productintro.png) no-repeat center 45px;
}
.page-neo3 .product_top_intro_list, .page-neo3
.product_top_intro_slider {
  /* Neo3 */
  background: url(../../img/neo3/bg_productintro.png) no-repeat center 45px;
}
.page-reform-designer2 .product_top_intro_list, .page-reform-designer2
.product_top_intro_slider {
  /* リフォームデザイナー */
  background: url(../../img/rd2/bg_productintro.png) no-repeat center 45px;
}
.page-pro9 .product_top_intro_list, .page-pro9
.product_top_intro_slider {
  /* PRO9 */
  background: url(../../img/pro9/bg_productintro.png) no-repeat center 45px;
}
.product_top_intro_list li,
.product_top_intro_slider li {
  text-align: center;
}
.product_top_intro_list li a,
.product_top_intro_slider li a {
  text-decoration: none;
}
.product_top_intro_list .title,
.product_top_intro_slider .title {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 200;
  display: block;
  margin: 5px auto 12px;
}
@media only screen and (max-width: 767px) {
  .product_top_intro_list .title,
  .product_top_intro_slider .title {
    font-size: 12px;
    font-size: 1.2rem;
    margin: 0 auto 10px;
    line-height: 1.4em;
  }
}
.page-pro9ex .product_top_intro_list .title, .page-pro9ex
.product_top_intro_slider .title {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3 .product_top_intro_list .title, .page-neo3
.product_top_intro_slider .title {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .product_top_intro_list .title, .page-reform-designer2
.product_top_intro_slider .title {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9 .product_top_intro_list .title, .page-pro9
.product_top_intro_slider .title {
  /* PRO9 */
  color: #830008;
}
.product_top_intro_list .content,
.product_top_intro_slider .content {
  color: #333;
  line-height: 140%;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_top_intro_list .content,
  .product_top_intro_slider .content {
    font-size: 12px;
    font-size: 1.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .product_top_intro_list .content,
  .product_top_intro_slider .content {
    display: none;
  }
}

.product_top_intro_slider {
  width: 100%;
  padding: 0 !important;
}
.product_top_intro_slider .row > li, .product_top_intro_slider .function_list_general .function ul > li, .function_list_general .function .product_top_intro_slider ul > li,
.product_top_intro_slider .function_list_general .function ol > li,
.function_list_general .function .product_top_intro_slider ol > li, .product_top_intro_slider .single.interview .ba > li, .single.interview .product_top_intro_slider .ba > li {
  width: 100%;
  margin: 0;
}

.product_top_function {
  color: #fff;
  padding: 0 0 60px;
  background-color: #000;
  background-repeat: no-repeat;
  background-position: center top;
}
@media only screen and (max-width: 767px) {
  .product_top_function {
    padding: 0 0 40px;
  }
}
.page-pro9ex .product_top_function {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/bg_function01.jpg);
}
.page-neo3 .product_top_function {
  /* Neo3 */
  background-image: url(../../img/neo3/bg_function01.jpg);
}
.page-reform-designer2 .product_top_function {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/bg_function01.jpg);
}
.page-pro9 .product_top_function {
  /* PRO9 */
  background-image: url(../../img/pro9/bg_function01.jpg);
  background-position: right top;
}
.product_top_function .btn01 {
  padding-left: 80px;
  padding-right: 80px;
}

.product_top_function_lead {
  margin: 0 -40px;
  padding: 0 40px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 979px) {
  .product_top_function_lead {
    width: auto;
    padding: 0 20px;
    margin: 0;
  }
}
.product_top_function_lead .imgArea {
  float: left;
  margin: 0;
}
@media only screen and (max-width: 979px) {
  .product_top_function_lead .imgArea {
    float: none;
    text-align: center;
  }
}
.product_top_function_lead .textArea {
  float: right;
  margin: 0;
}
@media only screen and (max-width: 979px) {
  .product_top_function_lead .textArea {
    float: none;
    text-align: center;
  }
}
.page-pro9ex .product_top_function_lead {
  /* PRO9EX */
  margin-bottom: -60px;
  padding-top: 80px;
}
@media only screen and (max-width: 979px) {
  .page-pro9ex .product_top_function_lead {
    padding-top: 30px;
    margin-bottom: 20px;
  }
}
.page-pro9ex .product_top_function_lead .imgArea {
  margin-top: -40px;
  margin-left: -30px;
}
@media only screen and (max-width: 979px) {
  .page-pro9ex .product_top_function_lead .imgArea {
    margin: 20px 0;
  }
}
.page-neo3 .product_top_function_lead {
  /* Neo3 */
  margin-bottom: -30px;
  padding-top: 40px;
}
@media only screen and (max-width: 979px) {
  .page-neo3 .product_top_function_lead {
    padding-top: 30px;
    margin-bottom: 20px;
  }
}
.page-neo3 .product_top_function_lead .imgArea {
  margin-top: -80px;
  margin-left: -60px;
}
@media only screen and (max-width: 979px) {
  .page-neo3 .product_top_function_lead .imgArea {
    margin: 20px 0;
  }
}
.page-reform-designer2 .product_top_function_lead {
  /* リフォームデザイナー */
  margin-bottom: -30px;
  padding-top: 80px;
}
@media only screen and (max-width: 979px) {
  .page-reform-designer2 .product_top_function_lead {
    padding-top: 30px;
    margin-bottom: 20px;
  }
}
.page-reform-designer2 .product_top_function_lead .imgArea {
  margin-top: -40px;
  margin-left: -30px;
}
@media only screen and (max-width: 979px) {
  .page-reform-designer2 .product_top_function_lead .imgArea {
    margin: 20px 0;
  }
}
.page-pro9 .product_top_function_lead {
  /* PRO9 */
  padding: 70px 40px;
}
@media only screen and (max-width: 979px) {
  .page-pro9 .product_top_function_lead {
    padding-top: 30px;
    margin-bottom: 20px;
  }
}
.page-pro9 .product_top_function_lead .imgArea {
  margin-top: -40px;
  margin-left: -30px;
}
@media only screen and (max-width: 979px) {
  .page-pro9 .product_top_function_lead .imgArea {
    margin: 20px 0;
  }
}

.product_top_function_lead_heading {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 200;
  line-height: 140%;
}
@media only screen and (max-width: 767px) {
  .product_top_function_lead_heading {
    font-size: 18px;
    font-size: 1.8rem;
  }
}

.product_top_function_lead_excerpt {
  margin-top: 15px;
  line-height: 160%;
}
@media only screen and (max-width: 767px) {
  .product_top_function_lead_excerpt {
    margin-top: 20px;
  }
}

.product_top_function_area {
  background: rgba(0, 0, 0, 0.5);
  border: 1p solid #000;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  padding: 75px 35px 35px;
  margin: 0 0 40px;
  position: relative;
  z-index: 10;
}
@media only screen and (max-width: 767px) {
  .product_top_function_area {
    margin: 20px auto;
    padding: 20px;
    overflow: hidden;
    background: transparent;
    border-style: none;
  }
}

.product_top_function_slide {
  margin: 0 auto 60px;
  padding: 0;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide {
    margin: 0;
    width: 100%;
    padding: 0 30px;
  }
}
.product_top_function_slide .imgArea {
  float: right;
  width: 31%;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .imgArea {
    float: none;
    width: 100%;
  }
}
.product_top_function_slide .textArea {
  float: left;
  width: 65%;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .textArea {
    margin-bottom: 15px;
    float: none;
    width: 100%;
    margin: 0;
  }
}
.product_top_function_slide .flexslider {
  overflow: hidden;
  padding-bottom: 60px;
}
.product_top_function_slide .flexslider .des_con {
  padding: 1px 50px 0;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flexslider .des_con {
    padding: 0;
  }
}
.product_top_function_slide .flexslider .title {
  padding: 30px 0 0 50px;
  position: relative;
  background: url(../img/bg/slash01.png) no-repeat 15px top;
}
.product_top_function_slide .flexslider .title .label {
  position: absolute;
  left: 60px;
  top: 0;
  display: block;
}
.product_top_function_slide .flexslider .title strong {
  display: block;
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flexslider .title strong {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.product_top_function_slide .flexslider .title:before {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: 700;
  content: "Function";
  position: absolute;
  left: 0;
  top: 0;
}
.page-pro9ex .product_top_function_slide .flexslider .title:before {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3 .product_top_function_slide .flexslider .title:before {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .product_top_function_slide .flexslider .title:before {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9 .product_top_function_slide .flexslider .title:before {
  /* PRO9 */
  color: #830008;
}
.product_top_function_slide .flexslider .content {
  margin-top: 30px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flexslider .content {
    margin-top: 15px;
  }
}
.product_top_function_slide .flex-direction-nav a {
  text-decoration: none;
  display: block;
  width: 30px;
  height: 0;
  padding: 30px 0 0;
  margin: -15px 0 0;
  position: absolute;
  top: auto;
  bottom: 0;
  border: 1px solid #666;
  text-indent: 0;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flex-direction-nav a {
    bottom: auto;
    top: 0;
    border-style: none;
    height: 100%;
    padding: 0;
    text-indent: -9999px;
  }
}
.product_top_function_slide .flex-direction-nav a:before {
  font-family: FontAwesome;
  font-weight: normal !important;
  display: block;
  line-height: 100%;
  position: absolute;
  top: 5px;
  color: #fff;
  font-size: 20px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flex-direction-nav a:before {
    text-indent: 0;
    font-size: 40px;
    position: absolute;
    top: 50%;
    margin-top: -20px;
  }
}
.product_top_function_slide .flex-direction-nav .flex-prev {
  left: 50px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flex-direction-nav .flex-prev {
    left: -40px;
  }
}
.product_top_function_slide .flex-direction-nav .flex-prev:before {
  left: 9px;
  content: "\f104";
}
.product_top_function_slide .flex-direction-nav .flex-next {
  left: 85px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide .flex-direction-nav .flex-next {
    left: auto;
    right: -40px;
  }
}
.product_top_function_slide .flex-direction-nav .flex-next:before {
  right: 9px;
  content: "\f105";
}
.product_top_function_slide:before, .product_top_function_slide:after {
  position: absolute;
  top: 0;
  display: block;
  content: "";
  width: 4px;
  height: 100%;
  border: 1px solid #666;
}
@media only screen and (max-width: 767px) {
  .product_top_function_slide:before, .product_top_function_slide:after {
    display: none;
  }
}
.product_top_function_slide:before {
  border-right-style: none;
  left: 0;
}
.product_top_function_slide:after {
  border-left-style: none;
  right: 0;
}

.product_top_function_list .row, .product_top_function_list .function_list_general .function ul, .function_list_general .function .product_top_function_list ul,
.product_top_function_list .function_list_general .function ol,
.function_list_general .function .product_top_function_list ol, .product_top_function_list .single.interview .ba, .single.interview .product_top_function_list .ba {
  margin: 0 -35px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_list {
    display: none;
  }
}
.product_top_function_list .col, .product_top_function_list .function_list_general .function ul li, .function_list_general .function ul .product_top_function_list li,
.product_top_function_list .function_list_general .function ol li,
.function_list_general .function ol .product_top_function_list li {
  float: left;
  width: 16.666666%;
  position: relative;
  padding: 5px 0 0 5px;
  margin: 0;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_top_function_list .col, .product_top_function_list .function_list_general .function ul li, .function_list_general .function ul .product_top_function_list li,
  .product_top_function_list .function_list_general .function ol li,
  .function_list_general .function ol .product_top_function_list li {
    width: 25%;
  }
}
.product_top_function_list .thumbnail {
  display: block;
  width: 140px;
  height: 140px;
  margin: 0 auto;
  border-radius: 70px;
  border: 2px solid;
  position: relative;
}
.page-pro9ex .product_top_function_list .thumbnail {
  /* PRO9EX */
  border-color: #307bd1;
}
.page-neo3 .product_top_function_list .thumbnail {
  /* Neo3 */
  border-color: #888;
}
.page-reform-designer2 .product_top_function_list .thumbnail {
  /* リフォームデザイナー */
  border-color: #CF7119;
}
.page-pro9 .product_top_function_list .thumbnail {
  /* PRO9 */
  border-color: #830008;
}
.product_top_function_list .thumbnail > span {
  display: block;
  width: 120px;
  height: 120px;
  margin: 0 auto;
  border-radius: 60px;
  overflow: hidden !important;
  position: relative;
  top: 8px;
}
.product_top_function_list .thumbnail > span img {
  width: 200px;
  max-width: none;
  height: auto;
  margin: 0 0 0 -30px;
}
.product_top_function_list .title {
  display: block;
  text-align: center;
  font-weight: 400;
  line-height: 130% !important;
  margin: 10px 0 30px 0;
}
.product_top_function_list .title a {
  color: #fff;
  text-decoration: none;
}
.product_top_function_list .title a:hover {
  text-decoration: underline;
}
.product_top_function_list .label_new {
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -70px;
  z-index: 100;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  color: #fff;
  border-radius: 20px;
  font-weight: 400;
  font-size: 12px;
  font-size: 1.2rem;
}
.page-pro9ex .product_top_function_list .label_new {
  /* PRO9EX */
  background: #307bd1;
}
.page-neo3 .product_top_function_list .label_new {
  /* Neo3 */
  color: #830008;
  background: #fff;
  border: 2px solid #830008;
}
.page-reform-designer2 .product_top_function_list .label_new {
  /* リフォームデザイナー */
  background: #CF7119;
}
.page-pro9 .product_top_function_list .label_new {
  /* PRO9 */
  background: #830008;
}

.product_top_function_link {
  text-align: center;
  padding: 0 15px;
}
@media only screen and (min-width: 980px) {
  .product_top_function_link {
    padding-bottom: 40px;
  }
}
.product_top_function_link li {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
@media only screen and (max-width: 767px) {
  .product_top_function_link li {
    width: 47%;
  }
}
.product_top_function_link li + li {
  margin-left: 30px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_link li + li {
    margin-left: 10px;
  }
}
.product_top_function_link li .btn01 {
  width: 240px;
  padding: 15px 40px;
}
@media only screen and (max-width: 767px) {
  .product_top_function_link li .btn01 {
    width: auto;
    display: block;
  }
}

.perspective_cat {
  overflow: hidden;
  padding: 40px 0;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .perspective_cat {
    padding: 0;
  }
}
@media only screen and (max-width: 767px) {
  .perspective_cat {
    padding: 0;
  }
}
.perspective_cat ul {
  max-width: 980px;
  margin: 0 auto;
  display: table;
  table-layout: auto;
  overflow: hidden;
}
@media only screen and (min-width: 980px) {
  .perspective_cat ul {
    height: 53px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .perspective_cat ul {
    display: block;
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .perspective_cat ul {
    display: block;
    display: none;
    margin: 0 -1px;
    overflow: hidden;
  }
}
.perspective_cat ul li {
  display: table-cell;
  text-align: center;
  width: 11.111111%;
  font-size: 12px;
  font-size: 1.2rem;
}
@media only screen and (min-width: 980px) {
  .perspective_cat ul li {
    width: 109px;
    height: 53px;
    overflow: hidden;
  }
}
.perspective_cat ul li.floor-plan a {
  background-position: 0 0;
}
.perspective_cat ul li.floor-plan a:hover {
  background-position: 0 -53px;
}
.perspective_cat ul li.interior a {
  background-position: -109px 0;
}
.perspective_cat ul li.interior a:hover {
  background-position: -109px -53px;
}
.perspective_cat ul li.outdoor a {
  background-position: -218px 0;
}
.perspective_cat ul li.outdoor a:hover {
  background-position: -218px -53px;
}
.perspective_cat ul li.exterior a {
  background-position: -327px 0;
}
.perspective_cat ul li.exterior a:hover {
  background-position: -327px -53px;
}
.perspective_cat ul li.cross-section a {
  background-position: -436px 0;
}
.perspective_cat ul li.cross-section a:hover {
  background-position: -436px -53px;
}
.perspective_cat ul li.presentation-board a {
  background-position: -545px 0;
}
.perspective_cat ul li.presentation-board a:hover {
  background-position: -545px -53px;
}
.perspective_cat ul li.overlook a {
  background-position: -654px 0;
}
.perspective_cat ul li.overlook a:hover {
  background-position: -654px -53px;
}
.perspective_cat ul li.white-model a {
  background-position: -763px 0;
}
.perspective_cat ul li.white-model a:hover {
  background-position: -763px -53px;
}
.perspective_cat ul li.original-parts a {
  background-position: -872px 0;
}
.perspective_cat ul li.original-parts a:hover {
  background-position: -872px -53px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .perspective_cat ul li {
    display: block;
    width: 33.3333333%;
    float: left;
  }
}
@media only screen and (max-width: 767px) {
  .perspective_cat ul li {
    float: none;
    display: block;
    width: 100%;
  }
}
.perspective_cat ul li a {
  color: #000;
  display: block;
  text-decoration: none;
  overflow: hidden;
  padding: 10px 0;
}
@media only screen and (min-width: 980px) {
  .perspective_cat ul li a {
    background-repeat: no-repeat;
    padding: 53px 0 0;
    height: 0;
  }
  .page-pro9ex .perspective_cat ul li a {
    /* PRO9EX */
    background-image: url(../../img/pro9ex/pro9ex_pers_cat.png);
  }
  .page-neo3 .perspective_cat ul li a {
    /* Neo3 */
    background-image: url(../../img/neo3/neo3_pers_cat.png);
  }
  .page-reform-designer2 .perspective_cat ul li a {
    /* リフォームデザイナー */
    background-image: url(../../img/rd2/rd2_pers_cat.png);
  }
  .page-pro9 .perspective_cat ul li a {
    /* PRO9 */
    background-image: url(../../img/pro9/pro9_pers_cat.png);
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .perspective_cat ul li a {
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
}
@media only screen and (max-width: 767px) {
  .perspective_cat ul li a {
    border-radius: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
}
.perspective_cat ul li a:hover {
  color: #fff;
}
@media only screen and (max-width: 979px) {
  .page-pro9ex .perspective_cat ul li a:hover {
    /* PRO9EX */
    background-color: #307bd1;
  }
  .page-neo3 .perspective_cat ul li a:hover {
    /* Neo3 */
    background-color: #830008;
  }
  .page-reform-designer2 .perspective_cat ul li a:hover {
    /* リフォームデザイナー */
    background-color: #CF7119;
  }
  .page-pro9 .perspective_cat ul li a:hover {
    /* PRO9 */
    background-color: #830008;
  }
}

.perspective_cat_heading {
  display: block;
  position: relative;
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
  padding: 10px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width: 980px) {
  .perspective_cat_heading {
    display: none;
  }
}
.perspective_cat_heading::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 20px;
  font-size: 2rem;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -0.5em;
  display: block;
  line-height: 1;
  content: "\f107";
}
.perspective_cat_heading.ui-accordion-header-active::after {
  content: "\f106";
}

#perspective_area .perspective_list {
  display: none;
}
@media (max-width: 979px) {
  #perspective_area .perspective_list .perspective:last-of-type {
    display: none;
  }
}
@media (min-width: 980px) {
  #perspective_area .perspective_list .perspective:last-of-type {
    display: block;
  }
}
@media (min-width: 1600px) {
  #perspective_area .perspective_list .perspective:last-of-type {
    display: none;
  }
}

.product_top_interview {
  background-color: #000;
  color: #fff;
  padding: 60px 0 120px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}
@media only screen and (max-width: 767px) {
  .product_top_interview {
    background-size: 150% auto;
    padding: 40px 20px 110px;
    position: relative;
  }
}
.product_top_interview .inner {
  position: relative;
}
.page-pro9ex .product_top_interview {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/bg_interview01.jpg);
}
.page-neo3 .product_top_interview {
  /* Neo3 */
  color: #222;
  background-image: url(../../img/neo3/bg_interview01.jpg);
  background-size: auto;
  background-repeat: repeat;
}
.page-reform-designer2 .product_top_interview {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/bg_interview01.jpg);
}
.page-pro9 .product_top_interview {
  /* PRO9 */
  background-image: url(../../img/pro9/bg_interview01.jpg);
}
.product_top_interview .btn01 {
  padding-left: 30px;
}

.product_top_interview_heading,
.product_top_interview_excerpt {
  text-align: center;
}

.product_top_interview_heading {
  font-size: 30px;
  font-size: 3rem;
  font-weight: 200;
  margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
  .product_top_interview_heading {
    font-size: 20px;
    font-size: 2rem;
  }
}

.product_top_interview_excerpt {
  margin-bottom: 40px;
}

.product_top_interview_more {
  position: absolute;
  right: 30px;
  top: 30px;
}
@media only screen and (max-width: 767px) {
  .product_top_interview_more {
    top: auto;
    right: 0;
    bottom: -70px;
    width: 100%;
  }
  .product_top_interview_more .btn {
    display: block;
  }
}

.interview_latest {
  border-bottom: 2px solid #555;
  overflow: hidden;
  position: relative;
  padding: 20px 0 0 0;
}
.interview_latest .thumbnail {
  display: block;
  margin-bottom: 10px;
}
.interview_latest .thumbnail img {
  width: 100%;
  height: auto;
}
.interview_latest .heading {
  border-bottom: 1px dotted #555;
  overflow: hidden;
  padding: 10px 0;
}
.page-pro9ex .interview_latest .number, .page-pro9ex
.interview_latest .title, .page-pro9ex
.interview_latest .date {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3 .interview_latest .number, .page-neo3
.interview_latest .title, .page-neo3
.interview_latest .date {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .interview_latest .number, .page-reform-designer2
.interview_latest .title, .page-reform-designer2
.interview_latest .date {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9 .interview_latest .number, .page-pro9
.interview_latest .title, .page-pro9
.interview_latest .date {
  /* PRO9 */
  color: #830008;
}
.interview_latest .number {
  line-height: 1;
  float: left;
  margin-right: 20px;
}
.interview_latest .number span,
.interview_latest .number strong {
  vertical-align: top;
  display: inline-block;
}
.interview_latest .number span {
  margin-top: 5px;
}
.interview_latest .number strong {
  margin-left: 5px;
  font-size: 36px;
  font-size: 3.6rem;
  font-weight: 200;
}
.interview_latest .title {
  overflow: hidden;
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .interview_latest .title {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.interview_latest .title a {
  color: #fff;
  text-decoration: none;
}
.page-neo3 .interview_latest .title a {
  /* Neo3 */
  color: #222;
}
.page-reform-designer2 .interview_latest .title a {
  /* リフォームデザイナー */
}
.page-pro9 .interview_latest .title a {
  /* PRO9 */
}
.interview_latest .nameArea {
  color: #bbb;
}
.page-neo3 .interview_latest .nameArea {
  /* Neo3 */
  color: #222;
}
.page-reform-designer2 .interview_latest .nameArea {
  /* リフォームデザイナー */
}
.page-pro9 .interview_latest .nameArea {
  /* PRO9 */
}
.interview_latest .date,
.interview_latest .link {
  line-height: 300%;
}
.interview_latest .date {
  float: left;
}
.interview_latest .link {
  float: right;
}
.interview_latest .link a {
  color: #aaa;
  text-decoration: none;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -ms-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
.interview_latest .link a:hover {
  color: #fff;
}
.page-neo3 .interview_latest .link a {
  /* Neo3 */
  color: #222;
}
.page-reform-designer2 .interview_latest .link a {
  /* リフォームデザイナー */
}
.page-pro9 .interview_latest .link a {
  /* PRO9 */
}
.interview_latest .link a:after {
  margin-left: 5px;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f055";
}
.interview_latest .label_new {
  position: absolute;
  left: 10px;
  top: 0;
  z-index: 100;
  width: 60px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  color: #fff;
  border-radius: 30px;
  font-weight: 400;
  font-size: 16px;
  font-size: 1.6rem;
  border: 2px solid;
  background: #fff;
}
.page-pro9ex .interview_latest .label_new {
  /* PRO9EX */
  color: #307bd1;
  border-color: #307bd1;
}
.page-neo3 .interview_latest .label_new {
  /* Neo3 */
  color: #830008;
  border-color: #830008;
}
.page-reform-designer2 .interview_latest .label_new {
  /* リフォームデザイナー */
  color: #CF7119;
  border-color: #CF7119;
}
.page-pro9 .interview_latest .label_new {
  /* PRO9 */
  color: #830008;
  border-color: #830008;
}

.interview_list {
  padding-top: 20px;
  line-height: 100%;
}
@media only screen and (max-width: 767px) {
  .interview_list {
    margin-top: 15px;
  }
}
.interview_list .interview {
  border-bottom: 1px solid #555;
}
.interview_list .interview:first-child {
  margin-top: -15px;
}
.interview_list .interview > a {
  color: #bbb;
  text-decoration: none;
  padding: 0 20px 15px 0;
  display: block;
  overflow: hidden;
  position: relative;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -ms-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
.interview_list .interview > a:hover {
  background: rgba(255, 255, 255, 0.2);
}
.page-neo3 .interview_list .interview > a {
  /* Neo3 */
  color: #222;
}
.page-reform-designer2 .interview_list .interview > a {
  /* リフォームデザイナー */
}
.page-pro9 .interview_list .interview > a {
  /* PRO9 */
}
.interview_list .interview > a:after {
  display: block;
  line-height: 100%;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f055";
  position: absolute;
  right: 1px;
  top: 50%;
  margin-top: -0.5em;
}
.interview_list .thumbnail {
  display: block;
  width: 100px;
  float: left;
  margin-right: 15px;
  margin-top: 15px;
}
.interview_list .textArea {
  overflow: hidden;
}
.interview_list .number {
  display: block;
  padding-top: 15px;
  margin-bottom: 10px;
}
.page-pro9ex .interview_list .number {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3 .interview_list .number {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .interview_list .number {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9 .interview_list .number {
  /* PRO9 */
  color: #830008;
}
.interview_list .title {
  color: #fff;
  overflow: hidden;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 200;
  line-height: 1.4em;
}
.page-neo3 .interview_list .title {
  /* Neo3 */
  color: #222;
}
@media only screen and (max-width: 767px) {
  .interview_list .title {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.interview_list .nameArea {
  color: #aaa;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4em;
}
@media only screen and (max-width: 767px) {
  .interview_list .nameArea {
    font-size: 12px;
    font-size: 1.2rem;
  }
}
.page-neo3 .interview_list .nameArea {
  /* Neo3 */
  color: #222;
}
.interview_list .nameArea .company + .name:before {
  content: " / ";
}

/* 製品下層 特長 */
/* 特長 */
/* 特長テーマカラー */
.product_summary_cover {
  height: 587px;
  padding: 40px;
  position: relative;
  z-index: 1;
  background-repeat: no-repeat;
  background-position: left top;
}
.page-pro9ex-child .product_summary_cover {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/summary/pr9ex_summary_cover01.jpg);
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .page-pro9ex-child .product_summary_cover {
    background-image: url(../../img/pro9ex/summary/pr9ex_summary_cover01_tb.jpg);
  }
}
@media only screen and (max-width: 767px) {
  .page-pro9ex-child .product_summary_cover {
    background-image: url(../../img/pro9ex/summary/pr9ex_summary_cover01_sp.jpg);
  }
}
.page-neo3-child .product_summary_cover {
  /* Neo3 */
  background-image: url(../../img/neo3/summary/neo3_summary_cover01.jpg);
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .page-neo3-child .product_summary_cover {
    background-image: url(../../img/neo3/summary/neo3_summary_cover01_tb.jpg);
  }
}
@media only screen and (max-width: 767px) {
  .page-neo3-child .product_summary_cover {
    background-image: url(../../img/neo3/summary/neo3_summary_cover01_sp.jpg);
  }
}
.page-reform-designer2-child .product_summary_cover {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/summary/rd2_summary_cover01.jpg);
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .page-reform-designer2-child .product_summary_cover {
    background-image: url(../../img/rd2/summary/rd2_summary_cover01_tb.jpg);
  }
}
@media only screen and (max-width: 767px) {
  .page-reform-designer2-child .product_summary_cover {
    background-image: url(../../img/rd2/summary/rd2_summary_cover01_sp.jpg);
  }
}
.page-pro9-child .product_summary_cover {
  /* PRO9 */
  background-image: url(../../img/pro9/summary/pro9_summary_cover01.jpg);
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .page-pro9-child .product_summary_cover {
    background-image: url(../../img/pro9/summary/pro9_summary_cover01_tb.jpg);
  }
}
@media only screen and (max-width: 767px) {
  .page-pro9-child .product_summary_cover {
    background-image: url(../../img/pro9/summary/pro9_summary_cover01_sp.jpg);
  }
}
@media only screen and (max-width: 979px) {
  .product_summary_cover {
    height: auto;
    padding: 20px;
    background-size: 100% auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_summary_cover {
    padding-top: 50%;
  }
}
@media only screen and (max-width: 767px) {
  .product_summary_cover {
    padding-top: 80%;
  }
}

.summary_cover_name {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 0 0 15px;
  margin: 30px 0 25px auto;
  border-bottom: 1px solid #535353;
  line-height: 1em;
}
.page-pro9ex-child .summary_cover_name {
  /* PRO9EX */
  color: #004896;
}
.page-neo3-child .summary_cover_name {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .summary_cover_name {
  /* リフォームデザイナー */
  color: #cf7119;
}
.page-pro9-child .summary_cover_name {
  /* PRO9 */
  color: #830008;
}

.summary_cover_description {
  font-size: 27px;
  font-size: 2.7rem;
  font-weight: 700;
  color: #111111;
  line-height: 1.4em;
  margin: 0 0 30px auto;
  text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
}
.summary_cover_description strong {
  display: block;
  margin-right: -0.5em;
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  .summary_cover_description {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

.summary_cover_front01 {
  position: absolute;
  left: 40px;
  top: 40px;
}
@media only screen and (max-width: 979px) {
  .summary_cover_front01 {
    display: none;
  }
}

.summary_cover_front02 {
  margin: 0 0 0 auto;
}

.product_summary_intro {
  color: #fff;
  padding: 160px 40px 40px;
  margin-top: -80px;
  position: relative;
  z-index: 2;
  height: 568px;
}
.page-pro9ex-child .product_summary_intro {
  /* PRO9EX */
  background: url(../../img/pro9ex/summary/pr9ex_summary_intro01.png) no-repeat center top;
}
@media only screen and (max-width: 979px) {
  .page-pro9ex-child .product_summary_intro {
    background: #004896 url(../../img/pro9ex/summary/pro9ex_summary_bg05.png) no-repeat center top;
  }
}
.page-neo3-child .product_summary_intro {
  /* Neo3 */
  color: #333333;
  background: url(../../img/neo3/summary/neo3_summary_intro01.png) no-repeat center top;
}
@media only screen and (max-width: 979px) {
  .page-neo3-child .product_summary_intro {
    background: #e6cb95 url(../../img/neo3/summary/neo3_summary_bg05.png) no-repeat center top;
  }
}
.page-reform-designer2-child .product_summary_intro {
  /* リフォームデザイナー */
  background: url(../../img/rd2/summary/rd2_summary_intro01.png) no-repeat center top;
}
@media only screen and (max-width: 979px) {
  .page-reform-designer2-child .product_summary_intro {
    background: #cf7119 url(../../img/rd2/summary/rd2_summary_bg05.png) no-repeat center top;
  }
}
.page-pro9-child .product_summary_intro {
  /* PRO9 */
  background: url(../../img/pro9/summary/pro9_summary_intro01.png) no-repeat center top;
}
@media only screen and (max-width: 979px) {
  .page-pro9-child .product_summary_intro {
    background: #830008 url(../../img/pro9/summary/pro9_summary_bg05.png) no-repeat center top;
  }
}
@media only screen and (max-width: 979px) {
  .product_summary_intro {
    padding: 100px 20px 20px;
    height: auto;
  }
}

@media only screen and (max-width: 979px) {
  .summary_intro_img {
    text-align: center;
    margin-bottom: 20px;
  }
}

.summary_intro_header {
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: 400;
  padding: 0 0 20px 20px;
  border-bottom: 1px solid #fff;
  margin: 0 auto 25px;
}
.page-pro9ex-child .summary_intro_header {
  /* PRO9EX */
  color: #fffc00;
  line-height: 2em;
}
@media only screen and (max-width: 979px) {
  .page-pro9ex-child .summary_intro_header {
    line-height: 1.3em;
  }
}
.page-neo3-child .summary_intro_header {
  /* Neo3 */
  color: #830008;
  border-bottom-color: #333;
}
.page-reform-designer2-child .summary_intro_header {
  /* リフォームデザイナー */
  color: #fffc00;
}
.page-pro9-child .summary_intro_header {
  /* PRO9 */
  color: #ffd200;
  text-align: center;
  border-bottom-style: none;
}
@media only screen and (max-width: 979px) {
  .summary_intro_header {
    font-size: 20px;
    font-size: 2rem;
    padding: 0 0 10px;
  }
}

.summary_intro_list {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 200;
}
.summary_intro_list li {
  line-height: 1.5em;
  padding-left: 40px;
  background-image: url(../img/ico/ico_listmark01.png);
  background-repeat: no-repeat;
  background-position: 20px 0.35em;
  color: #fff;
}
.page-pro9ex-child .summary_intro_list li {
  /* PRO9EX */
}
@media only screen and (min-width: 980px) {
  .page-pro9ex-child .summary_intro_list li + li {
    margin-top: 1.5em;
  }
}
.page-neo3-child .summary_intro_list li {
  /* Neo3 */
  color: #333;
  background-image: url(../img/ico/ico_listmark02.png);
}
.page-reform-designer2-child .summary_intro_list li {
  /* リフォームデザイナー */
  background-position: left 0.35em;
  padding-left: 20px;
}
.page-pro9-child .summary_intro_list li {
  /* PRO9 */
  background-position: left 0.35em;
  padding-left: 20px;
}
@media only screen and (max-width: 979px) {
  .summary_intro_list li {
    padding-left: 20px;
    background-position: left 0.35em;
  }
}
@media only screen and (max-width: 767px) {
  .summary_intro_list .col + .col, .summary_intro_list .function_list_general .function ul li + .col, .function_list_general .function ul .summary_intro_list li + .col,
  .summary_intro_list .function_list_general .function ol li + .col,
  .function_list_general .function ol .summary_intro_list li + .col, .summary_intro_list .function_list_general .function ul .col + li, .function_list_general .function ul .summary_intro_list .col + li, .summary_intro_list .function_list_general .function ul li + li, .function_list_general .function ul .summary_intro_list li + li,
  .function_list_general .function ol .summary_intro_list ul li + li,
  .summary_intro_list .function_list_general .function ol .col + li,
  .function_list_general .function ol .summary_intro_list .col + li,
  .function_list_general .function ul .summary_intro_list ol li + li,
  .summary_intro_list .function_list_general .function ol li + li,
  .function_list_general .function ol .summary_intro_list li + li {
    margin-top: 20px;
  }
}

.page-pro9-child .summary_intro_list_ttl {
  /* PRO9 */
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 10px;
}
.page-pro9-child .summary_intro_list_ttl::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f086";
  margin-right: 15px;
  font-weight: normal;
  font-size: 24px;
}

.summary_intro_business .caption {
  display: block;
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 100;
}
.summary_intro_business li {
  margin-top: 15px;
}

.product_summary_nav {
  padding-top: 60px;
}

.summary_nav_header {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 500;
  color: #111111;
  margin-bottom: 20px;
  text-align: center;
}
@media only screen and (max-width: 979px) {
  .summary_nav_header {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 0 15px;
  }
}

.summary_nav_description {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 20px auto 30px;
  text-align: center;
}
@media only screen and (max-width: 979px) {
  .summary_nav_description {
    font-size: 13px;
    font-size: 1.3rem;
    padding: 0 15px;
  }
}

.summary_nav_link {
  counter-reset: summary_nav_list;
}
.summary_nav_link li {
  counter-increment: summary_nav_list;
  float: left;
  width: 25%;
  padding-bottom: 32px;
}
@media only screen and (max-width: 979px) {
  .summary_nav_link li {
    width: auto;
    float: none;
    padding: 0;
  }
  .summary_nav_link li:first-child {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }
}
.page-pro9ex-child .summary_nav_link li {
  /* PRO9EX */
  width: 20%;
}
@media only screen and (max-width: 979px) {
  .page-pro9ex-child .summary_nav_link li {
    width: auto;
  }
}
.summary_nav_link li + li {
  padding-left: 2px;
}
.summary_nav_link li > a {
  display: block;
  text-decoration: none !important;
  padding: 40px 0 200px;
  background-color: #f3f0ed;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: relative;
}
@media only screen and (max-width: 979px) {
  .summary_nav_link li > a {
    padding: 0 0 0 40px;
    background-size: 20%;
    background-position: right center;
    border-top: 1px solid white;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
  .summary_nav_link li > a::before {
    font-family: FontAwesome;
    font-weight: normal !important;
    content: "\f107";
    left: 10px;
    top: 50%;
    position: absolute;
    margin-top: -0.5em;
    font-size: 22px;
  }
  .page-pro9ex-child .summary_nav_link li > a::before {
    /* PRO9EX */
    color: #004896;
  }
  .page-neo3-child .summary_nav_link li > a::before {
    /* Neo3 */
    color: #830008;
  }
  .page-reform-designer2-child .summary_nav_link li > a::before {
    /* リフォームデザイナー */
    color: #cf7119;
  }
  .page-pro9-child .summary_nav_link li > a::before {
    /* PRO9 */
    color: #830008;
  }
}
.summary_nav_link li > a::after {
  text-align: center;
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: -32px;
  content: "";
  margin-left: -4px;
  border: 8px solid transparent;
}
.page-pro9ex-child .summary_nav_link li > a::after {
  /* PRO9EX */
  border-top-color: #004896;
}
.page-neo3-child .summary_nav_link li > a::after {
  /* Neo3 */
  border-top-color: #830008;
}
.page-reform-designer2-child .summary_nav_link li > a::after {
  /* リフォームデザイナー */
  border-top-color: #cf7119;
}
.page-pro9-child .summary_nav_link li > a::after {
  /* PRO9 */
  border-top-color: #830008;
}
@media only screen and (max-width: 979px) {
  .summary_nav_link li > a::after {
    display: none;
  }
}
.summary_nav_link li .summary_nav_ttl {
  text-align: center;
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: 500;
  line-height: 1.2em;
  min-height: 2.4em;
}
.page-pro9ex-child .summary_nav_link li .summary_nav_ttl {
  /* PRO9EX */
  color: #004896;
}
.page-neo3-child .summary_nav_link li .summary_nav_ttl {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .summary_nav_link li .summary_nav_ttl {
  /* リフォームデザイナー */
  color: #cf7119;
}
.page-pro9-child .summary_nav_link li .summary_nav_ttl {
  /* PRO9 */
  color: #830008;
}
@media only screen and (max-width: 979px) {
  .summary_nav_link li .summary_nav_ttl {
    font-size: 18px;
    font-size: 1.8rem;
    text-align: left;
    min-height: 0;
    padding: 10px 0 15px;
  }
  .summary_nav_link li .summary_nav_ttl br {
    display: none;
  }
}
.summary_nav_link li .summary_nav_ttl::before {
  line-height: 1.6;
  font-size: 12px;
  font-size: 1.2rem;
  width: 6em;
  margin-left: -3em;
  color: #111;
  content: "Feature." counter(summary_nav_list);
  display: inline-block;
  *display: inline;
  *zoom: 1;
  position: absolute;
  left: 50%;
  top: 0;
}
@media only screen and (max-width: 979px) {
  .summary_nav_link li .summary_nav_ttl::before {
    text-align: center;
    margin: 0 0 7px;
    display: block;
    position: static;
    left: auto;
    top: auto;
  }
}
.page-pro9ex-child .summary_nav_link li .summary_nav_ttl::before {
  /* PRO9EX */
  background: #fffc00;
}
.page-neo3-child .summary_nav_link li .summary_nav_ttl::before {
  /* Neo3 */
  color: #fff;
  background: #b58c3f;
}
.page-reform-designer2-child .summary_nav_link li .summary_nav_ttl::before {
  /* リフォームデザイナー */
  color: #fff;
  background: #5a961a;
}
.page-pro9-child .summary_nav_link li .summary_nav_ttl::before {
  /* PRO9 */
  background: #ffd200;
}
.summary_nav_link li .summary_nav_content {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 300;
  color: #111111;
  text-align: center;
  margin: 10px auto 0;
}
.summary_nav_link li .summary_nav_content span {
  position: relative;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
.summary_nav_link li .summary_nav_content span::before, .summary_nav_link li .summary_nav_content span::after {
  content: "";
  display: block;
  width: 1em;
  height: 0;
  border-top: 1px solid #111;
  position: absolute;
  top: 50%;
}
.summary_nav_link li .summary_nav_content span::before {
  left: -2em;
}
.summary_nav_link li .summary_nav_content span::after {
  right: -2em;
}
.page-pro9ex-child .summary_nav_link {
  /* PRO9EX */
}
.page-pro9ex-child .summary_nav_link .num01 > a {
  background-image: url(../../img/pro9ex/summary/pro9ex_summary_img01.png);
}
.page-pro9ex-child .summary_nav_link .num02 > a {
  background-image: url(../../img/pro9ex/summary/pro9ex_summary_img02.png);
}
.page-pro9ex-child .summary_nav_link .num03 > a {
  background-image: url(../../img/pro9ex/summary/pro9ex_summary_img03.png);
}
.page-pro9ex-child .summary_nav_link .num04 > a {
  background-image: url(../../img/pro9ex/summary/pro9ex_summary_img04.png);
}
.page-pro9ex-child .summary_nav_link .num05 > a {
  background-image: url(../../img/pro9ex/summary/pro9ex_summary_img20.png);
}
.page-neo3-child .summary_nav_link {
  /* Neo3 */
}
.page-neo3-child .summary_nav_link .num01 > a {
  background-image: url(../../img/neo3/summary/neo3_summary_img02.png);
}
.page-neo3-child .summary_nav_link .num02 > a {
  background-image: url(../../img/neo3/summary/neo3_summary_img03.png);
}
.page-neo3-child .summary_nav_link .num03 > a {
  background-image: url(../../img/neo3/summary/neo3_summary_img04.png);
}
.page-neo3-child .summary_nav_link .num04 > a {
  background-image: url(../../img/neo3/summary/neo3_summary_img05.png);
}
.page-reform-designer2-child .summary_nav_link {
  /* リフォームデザイナー */
}
.page-reform-designer2-child .summary_nav_link .num01 > a {
  background-image: url(../../img/rd2/summary/rd2_summary_img01.png);
}
.page-reform-designer2-child .summary_nav_link .num02 > a {
  background-image: url(../../img/rd2/summary/rd2_summary_img02.png);
}
.page-reform-designer2-child .summary_nav_link .num03 > a {
  background-image: url(../../img/rd2/summary/rd2_summary_img03.png);
}
.page-reform-designer2-child .summary_nav_link .num04 > a {
  background-image: url(../../img/rd2/summary/rd2_summary_img04.png);
}
.page-pro9-child .summary_nav_link {
  /* PRO9 */
}
.page-pro9-child .summary_nav_link .num01 > a {
  background-image: url(../../img/pro9/summary/pro9_summary_img01.png);
}
.page-pro9-child .summary_nav_link .num02 > a {
  background-image: url(../../img/pro9/summary/pro9_summary_img02.png);
}
.page-pro9-child .summary_nav_link .num03 > a {
  background-image: url(../../img/pro9/summary/pro9_summary_img03.png);
}
.page-pro9-child .summary_nav_link .num04 > a {
  background-image: url(../../img/pro9/summary/pro9_summary_img04.png);
}

.product_summary_feature {
  counter-reset: feature_ttl;
}

.summary_feature {
  border-top: 1px solid #d5d5d5;
  padding: 0 40px;
  margin-top: 80px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .summary_feature {
    padding: 0 20px;
    background-size: 50% auto !important;
  }
}
@media only screen and (max-width: 767px) {
  .summary_feature {
    padding: 0 20px;
    background-size: 100% auto !important;
    background-position: center top !important;
  }
}
.page-pro9ex-child .summary_feature {
  /* PRO9EX */
}
.page-pro9ex-child .summary_feature.num01 {
  background: url(../../img/pro9ex/summary/pro9ex_summary_bg01.jpg) no-repeat right 60px;
}
@media only screen and (max-width: 767px) {
  .page-pro9ex-child .summary_feature.num01 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.page-pro9ex-child .summary_feature.num02 {
  background: url(../../img/pro9ex/summary/pro9ex_summary_bg02.jpg) no-repeat left top;
}
@media only screen and (max-width: 767px) {
  .page-pro9ex-child .summary_feature.num02 {
    background-size: 115% auto !important;
    background-position: left top !important;
  }
}
.page-pro9ex-child .summary_feature.num03 {
  background: url(../../img/pro9ex/summary/pro9ex_summary_bg03.jpg) no-repeat right top;
}
.page-pro9ex-child .summary_feature.num04 {
  background: url(../../img/pro9ex/summary/pro9ex_summary_bg04.jpg) no-repeat left top;
}
.page-pro9ex-child .summary_feature.num05 {
  background: url(../../img/pro9ex/summary/pro9ex_summary_bg06.jpg) no-repeat right top;
}
.page-neo3-child .summary_feature {
  /* Neo3 */
}
.page-neo3-child .summary_feature.num01 {
  background: url(../../img/neo3/summary/neo3_summary_bg01.jpg) no-repeat 20px 40px;
}
@media only screen and (max-width: 767px) {
  .page-neo3-child .summary_feature.num01 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.page-neo3-child .summary_feature.num02 {
  background: url(../../img/neo3/summary/neo3_summary_bg02.jpg) no-repeat right 60px;
}
@media only screen and (max-width: 767px) {
  .page-neo3-child .summary_feature.num02 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.page-neo3-child .summary_feature.num03 {
  background: url(../../img/neo3/summary/neo3_summary_bg03.jpg) no-repeat left top;
}
.page-neo3-child .summary_feature.num04 {
  background: url(../../img/neo3/summary/neo3_summary_bg04.jpg) no-repeat right top;
}
@media only screen and (max-width: 767px) {
  .page-neo3-child .summary_feature.num04 {
    background-size: 115% auto !important;
    background-position: right top !important;
  }
}
.page-reform-designer2-child .summary_feature {
  /* リフォームデザイナー */
}
.page-reform-designer2-child .summary_feature.num01 {
  background: url(../../img/rd2/summary/rd2_summary_bg01.jpg) no-repeat right 60px;
}
@media only screen and (max-width: 767px) {
  .page-reform-designer2-child .summary_feature.num01 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.page-reform-designer2-child .summary_feature.num02 {
  background: url(../../img/rd2/summary/rd2_summary_bg02.jpg) no-repeat left top;
}
@media only screen and (max-width: 767px) {
  .page-reform-designer2-child .summary_feature.num02 {
    background-size: 115% auto !important;
    background-position: left top !important;
  }
}
.page-reform-designer2-child .summary_feature.num03 {
  background: url(../../img/rd2/summary/rd2_summary_bg03.jpg) no-repeat right top;
}
.page-reform-designer2-child .summary_feature.num04 {
  background: url(../../img/rd2/summary/rd2_summary_bg04.jpg) no-repeat left 20px;
}
.page-pro9-child .summary_feature {
  /* PRO9 */
}
.page-pro9-child .summary_feature.num01 {
  background: url(../../img/pro9/summary/pro9_summary_bg01.jpg) no-repeat right 60px;
}
@media only screen and (max-width: 767px) {
  .page-pro9-child .summary_feature.num01 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.page-pro9-child .summary_feature.num02 {
  background: url(../../img/pro9/summary/pro9_summary_bg02.jpg) no-repeat left top;
}
@media only screen and (max-width: 767px) {
  .page-pro9-child .summary_feature.num02 {
    background-size: 115% auto !important;
    background-position: left top !important;
  }
}
.page-pro9-child .summary_feature.num03 {
  background: url(../../img/pro9/summary/pro9_summary_bg03.jpg) no-repeat right top;
}
.page-pro9-child .summary_feature.num04 {
  background: url(../../img/pro9/summary/pro9_summary_bg04.jpg) no-repeat left top;
}

.summary_feature_txt {
  margin-top: 80px;
  min-height: 340px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .summary_feature_txt {
    min-height: 280px;
    margin: 20px 0;
  }
}
@media only screen and (max-width: 767px) {
  .summary_feature_txt {
    min-height: 0;
    margin: 100% 0 20px;
  }
}
.bg_left .summary_feature_txt {
  margin-left: 58%;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .bg_left .summary_feature_txt {
    margin-left: 52%;
  }
}
@media only screen and (max-width: 767px) {
  .bg_left .summary_feature_txt {
    margin-left: 0;
  }
}
.bg_right .summary_feature_txt {
  margin-right: 52%;
}
@media only screen and (max-width: 767px) {
  .bg_right .summary_feature_txt {
    margin-right: 0;
  }
}

.summary_feature_ttl01 {
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
  position: relative;
  counter-increment: feature_ttl;
  line-height: 1;
}
.summary_feature_ttl01::before {
  content: "0" counter(feature_ttl);
  display: block;
  color: #333;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 100;
  background: url(../img/bg/bg_feature_num.png) no-repeat;
  width: 57px;
  height: 57px;
  line-height: 57px;
  text-align: center;
  margin: -29px auto -12px;
}
.page-pro9ex-child .summary_feature_ttl01 {
  /* PRO9EX */
  color: #004896;
}
.page-neo3-child .summary_feature_ttl01 {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .summary_feature_ttl01 {
  /* リフォームデザイナー */
  color: #cf7119;
}
.page-pro9-child .summary_feature_ttl01 {
  /* PRO9 */
  color: #830008;
}

.summary_feature_ttl02 {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 500;
  margin-bottom: 10px;
}
.page-pro9ex-child .summary_feature_ttl02 {
  /* PRO9EX */
  color: #004896;
}
.page-neo3-child .summary_feature_ttl02 {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .summary_feature_ttl02 {
  /* リフォームデザイナー */
  color: #cf7119;
}
.page-pro9-child .summary_feature_ttl02 {
  /* PRO9 */
  color: #830008;
}

.summary_feature_lead {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 500;
  margin: 10px -1em 20px 0;
  line-height: 1.2;
}
@media only screen and (max-width: 979px) {
  .summary_feature_lead {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.summary_feature_lead strong {
  font-weight: 500;
}

.summery_feature_content {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 300;
}

.summary_feature_img .caption {
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
  padding-top: 5px;
  font-weight: 400;
  text-align: center;
}
.summary_feature_img .caption.smaller {
  font-size: 13px;
  font-size: 1.3rem;
  letter-spacing: 0;
  padding-top: 6px;
}
@media only screen and (max-width: 767px) {
  .summary_feature_img li {
    overflow: hidden;
  }
  .summary_feature_img li + li {
    margin-top: 15px;
  }
  .summary_feature_img img {
    float: left;
    width: 37%;
    margin-right: 3%;
  }
  .summary_feature_img .caption {
    padding: 0;
    overflow: hidden;
    text-align: left;
  }
}
@media only screen and (max-width: 979px) {
  .summary_feature_img .pc_vid {
    display: none;
  }
}
@media only screen and (min-width: 980px) {
  .summary_feature_img .sp_vid {
    display: none;
  }
}
.summary_feature_img .movie_area {
  width: 100%;
  padding-top: 71.18%;
  position: relative;
  background: #000;
}
@media only screen and (max-width: 767px) {
  .summary_feature_img .movie_area {
    width: 37%;
    padding-top: 26.33%;
    float: left;
    margin-right: 3%;
  }
}
.summary_feature_img .movie_area iframe {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.product_summary_buy {
  color: #ffffff;
  position: relative;
  padding: 120px 40px 0;
  border: 1px solid #fff;
  border-top-style: none;
}
@media only screen and (max-width: 979px) {
  .product_summary_buy {
    padding: 100px 20px 0;
  }
}
.page-pro9ex-child .product_summary_buy {
  /* PRO9EX */
  background: #004896 url(../../img/pro9ex/summary/pro9ex_summary_bg05.png) no-repeat center top;
}
.page-neo3-child .product_summary_buy {
  /* Neo3 */
  background: #e6cb95 url(../../img/neo3/summary/neo3_summary_bg05.png) no-repeat center top;
}
.page-reform-designer2-child .product_summary_buy {
  /* リフォームデザイナー */
  background: #cf7119 url(../../img/rd2/summary/rd2_summary_bg05.png) no-repeat center top;
}
.page-pro9-child .product_summary_buy {
  /* PRO9 */
  background: #830008 url(../../img/pro9/summary/pro9_summary_bg05.png) no-repeat center top;
}
.product_summary_buy > .row, .function_list_general .function .product_summary_buy > ul,
.function_list_general .function .product_summary_buy > ol, .single.interview .product_summary_buy > .ba {
  display: table;
  width: 100%;
}
@media only screen and (max-width: 979px) {
  .product_summary_buy > .row, .function_list_general .function .product_summary_buy > ul,
  .function_list_general .function .product_summary_buy > ol, .single.interview .product_summary_buy > .ba {
    display: block;
  }
}
.product_summary_buy > .row > .col, .function_list_general .function .product_summary_buy > ul > .col,
.function_list_general .function .product_summary_buy > ol > .col, .single.interview .product_summary_buy > .ba > .col, .function_list_general .function ul .product_summary_buy > .row > li, .function_list_general .function .product_summary_buy > ul > li, .single.interview .function_list_general .function ul .product_summary_buy > .ba > li, .function_list_general .function ul .single.interview .product_summary_buy > .ba > li,
.function_list_general .function ol .product_summary_buy > .row > li,
.function_list_general .function .product_summary_buy > ol > li,
.single.interview .function_list_general .function ol .product_summary_buy > .ba > li,
.function_list_general .function ol .single.interview .product_summary_buy > .ba > li {
  display: table-cell;
  vertical-align: middle;
  width: 25%;
  float: none;
}
@media only screen and (max-width: 979px) {
  .product_summary_buy > .row > .col, .function_list_general .function .product_summary_buy > ul > .col,
  .function_list_general .function .product_summary_buy > ol > .col, .single.interview .product_summary_buy > .ba > .col, .function_list_general .function ul .product_summary_buy > .row > li, .function_list_general .function .product_summary_buy > ul > li, .single.interview .function_list_general .function ul .product_summary_buy > .ba > li, .function_list_general .function ul .single.interview .product_summary_buy > .ba > li,
  .function_list_general .function ol .product_summary_buy > .row > li,
  .function_list_general .function .product_summary_buy > ol > li,
  .single.interview .function_list_general .function ol .product_summary_buy > .ba > li,
  .function_list_general .function ol .single.interview .product_summary_buy > .ba > li {
    display: block;
    width: auto;
    text-align: center;
  }
  .product_summary_buy > .row > .col + .col, .function_list_general .function .product_summary_buy > ul > .col + .col,
  .function_list_general .function .product_summary_buy > ol > .col + .col, .single.interview .product_summary_buy > .ba > .col + .col, .function_list_general .function ul .product_summary_buy > .row > li + .col, .function_list_general .function .product_summary_buy > ul > li + .col, .single.interview .function_list_general .function ul .product_summary_buy > .ba > li + .col, .function_list_general .function ul .single.interview .product_summary_buy > .ba > li + .col,
  .function_list_general .function ol .product_summary_buy > .row > li + .col,
  .function_list_general .function .product_summary_buy > ol > li + .col,
  .single.interview .function_list_general .function ol .product_summary_buy > .ba > li + .col,
  .function_list_general .function ol .single.interview .product_summary_buy > .ba > li + .col, .function_list_general .function ul .product_summary_buy > .row > .col + li, .function_list_general .function .product_summary_buy > ul > .col + li, .single.interview .function_list_general .function ul .product_summary_buy > .ba > .col + li, .function_list_general .function ul .single.interview .product_summary_buy > .ba > .col + li, .function_list_general .function ul .product_summary_buy > .row > li + li, .function_list_general .function .product_summary_buy > ul > li + li,
  .function_list_general .function ul .product_summary_buy > ol > li + li, .single.interview .function_list_general .function ul .product_summary_buy > .ba > li + li, .function_list_general .function ul .single.interview .product_summary_buy > .ba > li + li,
  .function_list_general .function ol .product_summary_buy > ul > li + li,
  .function_list_general .function ul .product_summary_buy > ol > li + li,
  .function_list_general .function ol .product_summary_buy > .row > .col + li,
  .function_list_general .function .product_summary_buy > ol > .col + li,
  .single.interview .function_list_general .function ol .product_summary_buy > .ba > .col + li,
  .function_list_general .function ol .single.interview .product_summary_buy > .ba > .col + li,
  .function_list_general .function ol .product_summary_buy > ul > li + li,
  .function_list_general .function ul .product_summary_buy > ol > li + li,
  .function_list_general .function ol .product_summary_buy > .row > li + li,
  .function_list_general .function ol .product_summary_buy > ul > li + li,
  .function_list_general .function .product_summary_buy > ol > li + li,
  .single.interview .function_list_general .function ol .product_summary_buy > .ba > li + li,
  .function_list_general .function ol .single.interview .product_summary_buy > .ba > li + li {
    margin-top: 20px;
    margin-left: 0;
  }
}

.summary_buy_img {
  text-align: center;
  padding-right: 15px;
}

.summary_buy_txt {
  padding: 0 15px;
  width: 50% !important;
}
@media only screen and (max-width: 979px) {
  .summary_buy_txt {
    width: auto !important;
  }
}

.summary_buy_ttl {
  @incldue fotn-size(1.6);
  font-weight: 200;
  margin-bottom: 15px;
}
.page-pro9ex-child .summary_buy_ttl {
  /* PRO9EX */
  color: #fffc00;
}
.page-neo3-child .summary_buy_ttl {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .summary_buy_ttl {
  /* リフォームデザイナー */
  color: #fffc00;
}
.page-pro9-child .summary_buy_ttl {
  /* PRO9 */
  color: #ffd200;
}

.summary_buy_content {
  font-size: 24px;
  font-size: 2.4rem;
}
.page-neo3-child .summary_buy_content {
  /* Neo3 */
  color: #222;
}
@media only screen and (max-width: 767px) {
  .summary_buy_content {
    font-size: 20px;
    font-size: 2rem;
  }
}

.summary_buy_link {
  position: relative;
  padding-left: 15px;
}
@media only screen and (max-width: 979px) {
  .summary_buy_link {
    padding-left: 0;
  }
}
.summary_buy_link a {
  font-size: 18px;
  font-size: 1.8rem;
  display: block;
  background: #fff;
  text-align: center;
  line-height: 70px;
  height: 70px;
  border-radius: 3px;
  text-decoration: none !important;
}
.page-pro9ex-child .summary_buy_link a {
  /* PRO9EX */
  color: #004896;
}
.page-neo3-child .summary_buy_link a {
  /* Neo3 */
  color: #b58c3f;
}
.page-reform-designer2-child .summary_buy_link a {
  /* リフォームデザイナー */
  color: #cf7119;
}
.page-pro9-child .summary_buy_link a {
  /* PRO9 */
  color: #830008;
}
.summary_buy_link a::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 24px;
  content: "\f07a";
  margin-right: 15px;
}

.summary_pagenav {
  margin: 40px -40px 0;
}
@media only screen and (max-width: 979px) {
  .summary_pagenav {
    margin: 20px -20px 0;
  }
}
.summary_pagenav ul {
  overflow: hidden;
}
.summary_pagenav li {
  float: left;
  width: 50%;
}
.summary_pagenav li:first-child {
  padding-right: 2px;
}
.summary_pagenav li + li {
  padding-left: 1px;
}
.summary_pagenav li a {
  color: #fff;
  text-decoration: none;
  display: block;
  line-height: 80px;
  height: 80px;
  text-align: center;
  font-size: 16px;
  font-size: 1.6rem;
  position: relative;
}
.page-pro9ex-child .summary_pagenav li a {
  /* PRO9EX */
  background-color: #003874;
}
.page-neo3-child .summary_pagenav li a {
  /* Neo3 */
  background: #b58c3f;
}
.page-reform-designer2-child .summary_pagenav li a {
  /* リフォームデザイナー */
  background: #b9610f;
}
.page-pro9-child .summary_pagenav li a {
  /* PRO9 */
  background: #6a0007;
}
.summary_pagenav li a::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 22px;
  content: "\f105";
  position: absolute;
  right: 20px;
}
@media only screen and (max-width: 767px) {
  .summary_pagenav li a::after {
    right: 0;
  }
}

/* 製品下層 新機能 */
/* 新機能 */
.function_new_heading {
  text-align: center;
  padding: 80px 0 60px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
  color: #fff;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .function_new_heading {
    padding: 40px 10px 20px;
  }
}
@media only screen and (max-width: 767px) {
  .function_new_heading {
    padding: 20px 10px 10px;
  }
}
.page-pro9ex-child .function_new_heading {
  /* PRO9EX */
  background-image: url(../../img/pro9ex/new-function/function_new_heading01.jpg);
}
.page-neo3-child .function_new_heading {
  /* Neo3 */
  background-image: url(../../img/neo3/new-function/function_new_heading01.jpg);
}
.page-reform-designer2-child .function_new_heading {
  /* リフォームデザイナー */
  background-image: url(../../img/rd2/new-function/function_new_heading01.jpg);
}
.page-pro9-child .function_new_heading {
  /* PRO9 */
  background-image: url(../../img/pro9/new-function/function_new_heading01.jpg);
}
.function_new_heading .title {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .function_new_heading .title {
    font-size: 20px;
    font-size: 2rem;
  }
}
.function_new_heading .content {
  margin-top: 20px;
  padding-top: 40px;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 200;
}
@media only screen and (max-width: 767px) {
  .function_new_heading .content {
    margin-top: 10px;
    padding-top: 30px;
    font-size: 12px;
    font-size: 1.2rem;
    text-align: left;
    line-height: 1.4em;
  }
}
.page-pro9ex-child .function_new_heading .content {
  /* PRO9EX */
  background: url(../img/ico/ico_add01.png) no-repeat center top;
}
.page-neo3-child .function_new_heading .content {
  /* Neo3 */
}
.page-reform-designer2-child .function_new_heading .content {
  /* リフォームデザイナー */
}
.page-pro9-child .function_new_heading .content {
  /* PRO9 */
}

.function_list_new {
  overflow: hidden;
}
.function_list_new .function {
  padding: 40px;
  border-bottom: 1px solid #eee;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .function_list_new .function {
    padding: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .function_list_new .function {
    padding: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .function_list_new .function .imgArea {
    margin-bottom: 10px;
  }
}
.function_list_new .function .label {
  font-size: 10px;
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
  position: relative;
  display: block;
  margin: 0 30px 20px 0;
  padding-top: 64px;
  float: left;
}
@media only screen and (max-width: 767px) {
  .function_list_new .function .label {
    float: none;
    font-weight: 400;
    margin: 0 0 5px;
    padding: 0;
  }
}
.page-pro9ex-child .function_list_new .function .label {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3-child .function_list_new .function .label {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .function_list_new .function .label {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9-child .function_list_new .function .label {
  /* PRO9 */
  color: #830008;
}
.function_list_new .function .label strong {
  font-size: 64px;
  font-size: 6.4rem;
  font-weight: 100;
  position: absolute;
  left: 0;
  top: -6px;
}
@media only screen and (max-width: 767px) {
  .function_list_new .function .label strong {
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    position: static;
  }
}
.function_list_new .function .title {
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: 200;
  overflow: hidden;
  margin-bottom: 20px;
  line-height: 1.4em;
}
@media only screen and (max-width: 767px) {
  .function_list_new .function .title {
    font-size: 18px;
    font-size: 1.8rem;
    margin-bottom: 10px;
  }
}
.function_list_new .function .content {
  clear: both;
}
.function_list_new .function .more {
  margin-top: 15px;
}
@media only screen and (max-width: 767px) {
  .function_list_new .function .more a {
    width: 100%;
  }
}

/* 製品下層 基本機能 */
/* 基本機能 */
.product_function_list {
  margin: 0 auto 60px;
}
@media only screen and (max-width: 767px) {
  .product_function_list {
    margin-bottom: 30px;
  }
}
.product_function_list + .product_function_list {
  border-top: 1px solid;
}
.page-pro9ex-child .product_function_list + .product_function_list {
  /* PRO9EX */
  border-top-color: #307bd1;
}
.page-neo3-child .product_function_list + .product_function_list {
  /* Neo3 */
  border-top-color: #830008;
}
.page-reform-designer2-child .product_function_list + .product_function_list {
  /* リフォームデザイナー */
  border-top-color: #CF7119;
}
.page-pro9-child .product_function_list + .product_function_list {
  /* PRO9 */
  border-top-color: #830008;
}

.product_function_list .function_list {
  padding: 0 40px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .product_function_list .function_list {
    padding: 0 15px;
  }
}
@media only screen and (max-width: 767px) {
  .product_function_list .function_list {
    padding: 0 10px;
  }
}
.function_list .function {
  margin-top: 30px;
  border: 1px solid #bbb;
  border-top-style: none;
  background: #FFF url(../img/bg/slash02x.png) repeat-x left bottom;
  padding: 10px 20px 50px;
  line-height: 140%;
}
@media only screen and (max-width: 767px) {
  .function_list .function {
    margin-top: 25px;
  }
}
.page-pro9ex-child .function_list .function {
  /* PRO9EX */
  box-shadow: 0 -4px 0 0 #307bd1;
}
.page-neo3-child .function_list .function {
  /* Neo3 */
  box-shadow: 0 -4px 0 0 #830008;
}
.page-reform-designer2-child .function_list .function {
  /* リフォームデザイナー */
  box-shadow: 0 -4px 0 0 #CF7119;
}
.page-pro9-child .function_list .function {
  /* PRO9 */
  box-shadow: 0 -4px 0 0 #830008;
}
.function_list .function a {
  text-decoration: none;
}
.function_list .function .thumbnail {
  display: block;
  margin: 0 -10px 10px;
}
.function_list .function .title {
  font-size: 15px;
  font-size: 1.5rem;
  display: block;
  margin-bottom: 10px;
}
.page-pro9ex-child .function_list .function .title {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3-child .function_list .function .title {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .function_list .function .title {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9-child .function_list .function .title {
  /* PRO9 */
  color: #830008;
}
.function_list .function .content {
  font-size: 13px;
  font-size: 1.3rem;
  color: #333;
}
.function_list.small .function {
  background: #FFF url(../img/bg/slash02y.png) repeat-y right top;
  padding: 10px 20px 10px 0;
  box-shadow: none;
  border: 1px solid #bbb;
}
.function_list.small .function .thumbnail {
  width: 58%;
  float: left;
  margin: -10px 15px 10px 0;
}
.function_list.small .function .title {
  overflow: hidden;
}

.function_list_general {
  margin: 0 auto 60px;
  padding: 1px 40px 0;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .function_list_general {
    padding: 1px 10px 0;
    margin-bottom: 30px;
  }
}
.function_list_general .function {
  background-color: #eee;
  margin-top: -1px;
  padding: 30px;
  border: 1px solid #bbb;
}
@media only screen and (max-width: 767px) {
  .function_list_general .function {
    padding: 15px;
  }
}
.function_list_general .function:nth-child(2n) {
  background-color: #fff;
}
.function_list_general .function .title {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 10px;
}
.function_list_general .function ul,
.function_list_general .function ol {
  line-height: 140%;
}
.function_list_general .function ul li,
.function_list_general .function ol li {
  margin-top: 15px;
  padding-left: 20px;
  position: relative;
}
.function_list_general .function ul li:before,
.function_list_general .function ol li:before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f046";
  position: absolute;
  left: 0;
  top: 0.1em;
}
.function_list_general .function ul li:nth-child(4n+1),
.function_list_general .function ol li:nth-child(4n+1) {
  margin-left: 0;
}

/* 製品下層 出力サンプル */
/* 出力サンプルサムネイル表示 */
.perspective_list {
  overflow: hidden;
}
.perspective_list ul {
  overflow: hidden;
  width: auto;
  margin-left: -1px;
  margin-right: -1px;
  padding-bottom: 1px;
}
@media (min-width: 980px) {
  .product_top_perspective .perspective_list ul {
    margin-left: -10%;
    margin-right: -10%;
  }
}
@media (min-width: 1600px) {
  .product_top_perspective .perspective_list ul {
    margin-left: -7.1%;
    margin-right: -7.1%;
  }
}
.perspective_list li {
  float: left;
  overflow: hidden;
  width: 33.3%;
  position: relative;
}
@media (max-width: 979px) {
  .perspective_list li {
    width: 50%;
  }
}
@media (max-width: 979px) {
  .product_top_perspective .perspective_list li {
    width: 50%;
  }
}
@media (min-width: 980px) {
  .product_top_perspective .perspective_list li {
    width: 20%;
  }
}
@media (min-width: 1600px) {
  .product_top_perspective .perspective_list li {
    width: 14.285%;
  }
}
.perspective_list li a {
  display: block;
  padding: 1px 0 0 1px;
}
.perspective_list li .mask {
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  margin: auto;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  -webkit-transition: .3s ease;
  transition: .3s ease;
}
.page-pro9ex .perspective_list li .mask, .page-pro9ex-child .perspective_list li .mask {
  /* PRO9EX */
  background: rgba(48, 123, 209, 0.7);
}
.page-neo3 .perspective_list li .mask, .page-neo3-child .perspective_list li .mask {
  /* Neo3 */
  background: rgba(136, 136, 136, 0.7);
}
.page-reform-designer2 .perspective_list li .mask, .page-reform-designer2-child .perspective_list li .mask {
  /* リフォームデザイナー */
  background: rgba(207, 113, 25, 0.7);
}
.page-pro9 .perspective_list li .mask, .page-pro9-child .perspective_list li .mask {
  /* PRO9 */
  background: rgba(131, 0, 8, 0.7);
}
.perspective_list li .title {
  display: table;
  width: 90%;
  height: 86%;
  color: #fff;
  position: absolute;
  left: 5%;
  top: 7%;
  border: 2px solid rgba(255, 255, 255, 0.3);
  opacity: 0;
  transform: scale(0.9, 0.9);
  transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}
.page-pro9ex .perspective_list li .title {
  /* PRO9EX */
}
.page-neo3 .perspective_list li .title {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2 .perspective_list li .title {
  /* リフォームデザイナー */
}
.page-pro9 .perspective_list li .title {
  /* PRO9 */
}
.perspective_list li .title .text {
  font-size: 16px;
  font-size: 1.6rem;
  width: 100%;
  height: 100%;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
}
@media only screen and (max-width: 767px) {
  .perspective_list li .title .text {
    font-size: 13px;
    font-size: 1.3rem;
  }
}
.perspective_list li .title .text .cat {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
}
@media only screen and (max-width: 767px) {
  .perspective_list li .title .text .cat {
    font-size: 10px;
    font-size: 1rem;
  }
}
.perspective_list li:hover .mask {
  opacity: 1;
}
.perspective_list li:hover .title {
  opacity: 1;
  transform: scale(1, 1);
  transition-delay: 0.1s;
}

/* 製品下層 よくあるご質問 */
/*よくあるご質問*/
.faq_list {
  margin: 40px 40px 60px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .faq_list {
    margin: 20px 20px 40px;
  }
}
@media only screen and (max-width: 767px) {
  .faq_list {
    margin: 15px 15px 30px;
  }
}
.faq_list .faq {
  background: #eee;
  border: 1px solid #bbb;
  padding: 20px;
  margin: -1px 0 0;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -ms-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
@media only screen and (max-width: 767px) {
  .faq_list .faq {
    padding: 10px;
  }
}
.faq_list .faq .title {
  cursor: pointer;
  font-size: 16px;
  font-size: 1.6rem;
  margin: -20px;
  padding: 20px 40px 20px 20px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .faq_list .faq .title {
    font-size: 14px;
    font-size: 1.4rem;
    margin: -10px;
    padding: 10px 25px 10px 10px;
  }
}
.faq_list .faq .title:after {
  font-size: 24px;
  font-size: 2.4rem;
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -0.5em;
  display: block;
  line-height: 1;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f105";
}
@media only screen and (max-width: 767px) {
  .faq_list .faq .title:after {
    font-size: 20px;
    font-size: 2rem;
    right: 10px;
  }
}
.faq_list .faq .content {
  margin-top: 20px;
}
.faq_list .faq .feedback {
  margin-top: 20px;
}
.faq_list .faq .feedback .feedback_title {
  font-size: 15px;
  font-size: 1.5rem;
}
.faq_list .faq:hover, .faq_list .faq.is_active {
  background: #fff;
}
.faq_list .faq:hover .title:after, .faq_list .faq.is_active .title:after {
  content: "\f107";
}

.faq_list_heading {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
  .faq_list_heading {
    font-size: 16px;
    font-size: 1.6rem;
    margin-bottom: 10px;
  }
}
.faq_list_heading:before {
  margin-right: 10px;
  display: inline-block;
  font-size: 32px;
  font-size: 3.2rem;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f0e6";
}
@media only screen and (max-width: 767px) {
  .faq_list_heading:before {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.page-pro9ex-child .faq_list_heading:before {
  /* PRO9EX */
  color: #307bd1;
}
.page-neo3-child .faq_list_heading:before {
  /* Neo3 */
  color: #830008;
}
.page-reform-designer2-child .faq_list_heading:before {
  /* リフォームデザイナー */
  color: #CF7119;
}
.page-pro9-child .faq_list_heading:before {
  /* PRO9 */
  color: #830008;
}

/* 製品下層 PRO9EX素材パック */
/*PRO9EX素材パック*/
.sozaipac_nav_header {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 500;
  color: #111111;
  margin-bottom: 20px;
  text-align: center;
}
@media only screen and (max-width: 979px) {
  .sozaipac_nav_header {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 0 15px;
  }
}
.sozaipac_nav_description {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 20px auto 30px;
  text-align: center;
}
@media only screen and (max-width: 979px) {
  .sozaipac_nav_description {
    font-size: 13px;
    font-size: 1.3rem;
    padding: 0 15px;
  }
}
.sozaipac_feature {
  border-top: 1px solid #d5d5d5;
  padding: 0 40px;
  margin-top: 80px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .sozaipac_feature {
    padding: 0 20px;
    background-size: 50% auto !important;
  }
}
@media only screen and (max-width: 767px) {
  .sozaipac_feature {
    padding: 0 20px;
    background-size: 100% auto !important;
    background-position: center top !important;
  }
}
.page-pro9ex-child .sozaipac_feature {
  /* PRO9EX */
}
.page-pro9ex-child .sozaipac_feature.num01 {
  background: url(../../img/pro9ex/pro9exsozaipac_img01.jpg) no-repeat right 60px;
}
@media only screen and (max-width: 767px) {
  .page-pro9ex-child .sozaipac_feature.num01 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.page-pro9ex-child .sozaipac_feature.num02 {
  background: url(../../img/pro9ex/pro9exsozaipac_img02.gif) no-repeat left 60px;
}
@media only screen and (max-width: 767px) {
  .page-pro9ex-child .sozaipac_feature.num02 {
    background-size: 90% auto !important;
    background-position: center 60px !important;
  }
}
.sozaipac_feature_txt {
  margin-top: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .sozaipac_feature_txt {
    min-height: 280px;
    margin: 20px 0;
  }
}
@media only screen and (max-width: 767px) {
  .sozaipac_feature_txt {
    min-height: 0;
    margin: 100% 0 20px;
  }
}
.bg_left .sozaipac_feature_txt {
  margin-left: 58%;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .bg_left .sozaipac_feature_txt {
    margin-left: 52%;
  }
}
@media only screen and (max-width: 767px) {
  .bg_left .sozaipac_feature_txt {
    margin-left: 0;
  }
}
.bg_right .sozaipac_feature_txt {
  margin-right: 52%;
}
@media only screen and (max-width: 767px) {
  .bg_right .sozaipac_feature_txt {
    margin-right: 0;
  }
}
.sozaipac_feature_lead {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 500;
  margin: 10px -1em 20px 0;
  line-height: 1.2;
}
@media only screen and (max-width: 979px) {
  .sozaipac_feature_lead {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.sozaipac_feature_lead strong {
  font-weight: 500;
}
.sozaipac_feature_content {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 300;
}
.sozaipac_feature_img .caption {
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
  padding-top: 5px;
  font-weight: 400;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .sozaipac_feature_img .caption {
    padding: 0;
    overflow: hidden;
    text-align: left;
  }
}
/*Neo3 ガイドブック付き*/
#neo3_gbpac{
}
#neo3_gbpac p{
	margin:1% 3%;
}
#neo3_gbpac h4{
	font-size:140%;
	padding:1%;
	margin:4% 0;
	background:#e12431;
	color:#FFF;
}
#neo3_gbpac h5{
	font-size:130%;
	margin:2% 0;
}
#neo3_gbpac div.LeftBox{
	float:left;
	width:37%;
	margin-left:3%;
}
#neo3_gbpac div.RightBox{
	float:right;
	width:60%;
}
#neo3_gbpac div.btn{
	font-size:110%;
	background:#492b0e;
	color:#FFF;
	padding:1%;
	border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
}
@media only screen and (max-width: 767px) {
#neo3_gbpac div.LeftBox,#neo3_gbpac div.RightBox{
	width:90%;
	clear:both;
	display:block;
	margin:5%;
}
}

/* 活用しよう */
#learning_header {
  margin: 45px auto 30px;
}
@media only screen and (max-width: 979px) {
  #learning_header {
    margin: 20px auto 10px;
  }
}
#learning_header .inner {
  overflow: hidden;
}
@media only screen and (max-width: 979px) {
  #learning_header .inner {
    padding: 0 15px;
  }
}
#learning_header .logo {
  width: 260px;
  float: left;
}
@media only screen and (max-width: 767px) {
  #learning_header .logo {
    width: 160px;
  }
}
#learning_header .logo a {
  display: block;
  height: 0;
  padding: 79px 0 0;
  overflow: hidden;
  background: url(../../img/learning/logo_learning.jpg) no-repeat;
  font-size: 0;
}
@media only screen and (max-width: 767px) {
  #learning_header .logo a {
    background-size: 100% auto;
    background-position: center center;
  }
}
#learning_header .local_nav {
  float: right;
  font-size: 13px;
  font-size: 1.3rem;
  padding-top: 5px;
  position: relative;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav {
    clear: both;
    float: none;
    padding: 0;
  }
}
#learning_header .local_nav .ico {
  font-size: 24px;
  position: absolute;
  right: 0;
  top: -32px;
  padding: 0 8px;
  display: none;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav .ico {
    display: block;
  }
}
#learning_header .local_nav ul {
  text-align: right;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav ul {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    display: none;
    padding-top: 10px;
  }
}
#learning_header .local_nav li {
  display: inline-block;
  width: 160px;
  margin-left: 5px;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav li {
    display: block;
    width: 100%;
    margin: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }
}
#learning_header .local_nav li a {
  line-height: 100%;
  text-decoration: none;
  color: #444;
  display: block;
  border-bottom: 2px solid #ddd;
  padding: 10px 0;
  text-align: center;
  position: relative;
}
#learning_header .local_nav li a::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f105";
  font-size: 20px;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -10px;
  display: none;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav li a::after {
    display: block;
  }
}
#learning_header .local_nav li a:hover {
  border-bottom-color: #DC7F3A;
}
#learning_header .local_nav li a:hover .fa {
  color: #DC7F3A;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav li a {
    border-bottom-style: none;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 10px 0;
    line-height: 20px;
  }
}
#learning_header .local_nav li a .fa {
  display: block;
  font-size: 24px;
  font-size: 2.4rem;
  padding-bottom: 10px;
}
@media only screen and (max-width: 979px) {
  #learning_header .local_nav li a .fa {
    display: inline-block;
    font-size: 20px;
    font-size: 2rem;
    padding: 0 10px 0 0;
  }
}

#learning_slider {
  max-width: 980px;
  margin: 0 auto 60px;
  /* Control Nav */
  /* Direction Nav */
}
#learning_slider .flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: -40px;
  text-align: center;
}
#learning_slider .flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}
#learning_slider .flex-control-paging li a {
  width: 14px;
  height: 14px;
  display: block;
  background: #aaa;
  cursor: pointer;
  text-indent: -9999px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}
#learning_slider .flex-control-paging li a:hover {
  background: #e88f42;
}
#learning_slider .flex-control-paging li a.flex-active {
  background: #e88f42;
  cursor: default;
}
#learning_slider .flex-direction-nav {
  *height: 0;
}
#learning_slider .flex-direction-nav a {
  text-decoration: none;
  text-indent: -9999px;
  display: block;
  width: 30px;
  height: 100%;
  margin: 0;
  position: absolute;
  top: 0;
  z-index: 10;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  transition: all .3s ease;
}
#learning_slider .flex-direction-nav .flex-prev {
  left: -40px;
  background: url(../img/ico/fa-angle-left.png) no-repeat center center;
}
#learning_slider .flex-direction-nav .flex-next {
  right: -40px;
  background: url(../img/ico/fa-angle-right.png) no-repeat center center;
}
#learning_slider .flex-direction-nav .flex-disabled {
  cursor: default;
}
@media only screen and (max-width: 979px) {
  #learning_slider .flex-direction-nav .flex-prev {
    left: 0;
  }
  #learning_slider .flex-direction-nav .flex-next {
    right: 0;
  }
}

.learning_contents {
  padding-top: 10px;
}
@media only screen and (max-width: 979px) {
  .learning_contents > .col, .function_list_general .function ul .learning_contents > li,
  .function_list_general .function ol .learning_contents > li {
    float: none !important;
    width: auto !important;
  }
}

.learning_title01 {
  color: #111;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 700;
  margin: 0 auto 35px;
}
@media only screen and (max-width: 767px) {
  .learning_title01 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.learning_title01 strong {
  font-weight: 700;
}
.learning_title01 small {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: 400;
  margin-left: 20px;
}
@media only screen and (max-width: 767px) {
  .learning_title01 small {
    margin-left: 0;
    display: block;
  }
}

.learning_title02 {
  color: #444;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 30px;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .learning_title02 {
    margin-bottom: 15px;
  }
}
.learning_title02 small {
  float: right;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: 400;
}

.learning_users,
.learning_interview {
  margin-top: 30px;
  padding-top: 30px;
  background: url(../img/bg/line01.png) no-repeat left top;
}
@media only screen and (max-width: 767px) {
  .learning_users,
  .learning_interview {
    margin-top: 15px;
    padding-top: 15px;
  }
}

.learning_users_list > ul,
.post_type_users_list > ul {
  margin-top: -20px;
}
.learning_users_list .users,
.post_type_users_list .users {
  margin-top: 20px;
}
.learning_users_list .users > a,
.post_type_users_list .users > a {
  display: block;
  text-decoration: none;
  color: #222;
}
.learning_users_list .users .thumbnail,
.post_type_users_list .users .thumbnail {
  display: block;
}
.learning_users_list .users .title,
.learning_users_list .users .name,
.post_type_users_list .users .title,
.post_type_users_list .users .name {
  display: block;
  line-height: 1.5;
}
.learning_users_list .users .title,
.post_type_users_list .users .title {
  padding-top: 5px;
  margin-right: -0.5em;
  color: #866c43;
}
.learning_users_list .users .name,
.post_type_users_list .users .name {
  font-size: 13px;
  font-size: 1.3rem;
}

.learning_interview {
  margin-top: 60px;
}
@media only screen and (max-width: 767px) {
  .learning_interview {
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 979px) {
  .learning_ranking {
    margin-top: 60px;
    width: 47.5%;
    float: left;
  }
}
@media only screen and (max-width: 767px) {
  .learning_ranking {
    margin-top: 30px;
  }
}

.learning_news {
  margin-top: 60px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .learning_news {
    width: 47.5%;
    float: right;
  }
}
@media only screen and (max-width: 767px) {
  .learning_news {
    margin-top: 30px;
  }
}

.learning_ranking_list,
.learning_news_list {
  border-top: 1px solid #aaa;
  margin-top: 30px;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 140%;
}
@media only screen and (max-width: 767px) {
  .learning_ranking_list,
  .learning_news_list {
    margin-top: 15px;
  }
}
.learning_ranking_list li,
.learning_news_list li {
  margin-top: 20px;
}
@media only screen and (max-width: 767px) {
  .learning_ranking_list li,
  .learning_news_list li {
    margin-top: 10px;
  }
}
.learning_ranking_list li strong,
.learning_news_list li strong {
  font-weight: 400;
}
.learning_ranking_list li > a,
.learning_news_list li > a {
  display: block;
  overflow: hidden;
  text-decoration: none;
  color: #866c43;
}
.learning_ranking_list li .thumbnail,
.learning_news_list li .thumbnail {
  width: 35%;
  float: left;
  margin: 0 10px 0 0;
}
.learning_ranking_list li .post_type,
.learning_news_list li .post_type {
  color: #222;
  text-decoration: none;
}
.learning_ranking_list li .post_type::before,
.learning_news_list li .post_type::before {
  content: "|";
  margin: 0 0.25em;
}

.learning_tutorial {
  background: #f4f4f4;
  padding: 30px;
  margin-top: 60px;
  border-top: 2px solid #000;
}
@media only screen and (max-width: 767px) {
  .learning_tutorial {
    margin: 30px 10px;
    padding: 15px;
  }
}
.learning_tutorial .heading01 {
  width: 187px;
  height: 0;
  padding: 46px 0 0;
  margin: 0 0 25px;
  overflow: hidden;
  background: url(../../img/learning/tutorial_ttl01.jpg) no-repeat;
}

@media only screen and (max-width: 767px) {
  .learning_tutorial_list .tutorial + .tutorial {
    margin-top: 15px;
  }
}
.learning_tutorial_list .tutorial > a {
  display: block;
  text-decoration: none;
  color: #222;
}
.learning_tutorial_list .tutorial .thumbnail {
  display: block;
}
.learning_tutorial_list .tutorial .label {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  padding-top: 7px;
}
.learning_tutorial_list .tutorial .label em {
  font-weight: 300;
}
.learning_tutorial_list .tutorial .title {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 1.4em;
  padding-top: 5px;
}
.learning_tutorial_list .tutorial .title a {
  color: #866c43;
  text-decoration: none;
}

.learning_practical {
  margin: 60px auto;
  padding-top: 30px;
  background: url(../img/bg/line01.png) no-repeat left top;
}
@media only screen and (max-width: 767px) {
  .learning_practical {
    margin: 30px 10px;
  }
}
@media only screen and (max-width: 767px) {
  .learning_practical .practical + .practical {
    margin-top: 15px;
  }
}
.learning_practical .practical > a {
  display: block;
  text-decoration: none;
  color: #222;
}
.learning_practical .practical .thumbnail {
  display: block;
}
.learning_practical .practical .label {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  padding-top: 7px;
}
.learning_practical .practical .label em {
  font-weight: 300;
}
.learning_practical .practical .title {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 1.4em;
  padding-top: 5px;
}
.learning_practical .practical .title a {
  color: #866c43;
  text-decoration: none;
}
.learning_practical .practical_category_list {
  font-size: 12px;
  font-size: 1.2rem;
  float: right;
  margin-top: -57px;
}
@media only screen and (max-width: 767px) {
  .learning_practical .practical_category_list {
    display: none;
  }
}
.learning_practical .practical_category_list li {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  padding-left: 0;
}
.learning_practical .practical_category_list li::before {
  content: "/";
  position: static;
  margin: 0 0.2em;
  font-family: "Noto Sans Japanese", "Noto Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, verdana, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}
.learning_practical .practical_category_list li:first-child::before {
  display: none;
}

/* 製品比較表 */
/* 製品比較表 */
.page-compare-wrapper {
  width: 980px !important;
  margin: 0 auto;
}

#compare_table {
  overflow: hidden;
  position: relative;
  margin: 0 -15px 0 0;
  padding: 0 15px 0 0;
}
#compare_table table {
  margin: 0;
}
#compare_table thead {
  display: block;
  position: absolute;
  top: 0;
  z-index: 9999;
}
#compare_table tbody {
  display: block;
  position: relative;
  z-index: 1;
}
#compare_table .data_header {
  background: #f5f0e3;
  padding: 15px 10px;
}

.compare_header_column {
  float: left;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 2;
}
.compare_header_column thead {
  width: 412px;
}
.compare_header_column td {
  width: 410px;
  font-size: 13px;
  font-size: 1.3rem;
}
.compare_header_column tbody tr:nth-child(odd) td {
  background: #efefef;
}
.compare_header_column .header_product {
  color: #fff;
  background: #555;
  font-size: 18px;
  font-size: 1.8rem;
  text-align: left;
}
.compare_header_column .header_checkbox {
  color: #fff;
  background: #333;
  border-bottom: 2px solid #000;
}
.compare_header_column .header_checkbox .filtering_label {
  float: left;
}
.compare_header_column .header_checkbox .filtering_button_area {
  float: right;
}
.compare_header_column .header_checkbox button {
  background: #fff;
  color: #111;
  padding: 5px 30px;
  margin-left: 10px;
  border-style: none;
  border-radius: 2px;
}
.compare_header_column .data_header {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 700;
  text-align: left;
}

.compare_product_container {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

#carousel_next, #carousel_prev {
  text-decoration: none;
  text-indent: -9999px;
  display: block;
  width: 30px;
  height: 30px;
  margin: 0;
  position: fixed;
  top: 80px;
  z-index: 9999;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  transition: all .3s ease;
  display: none;
}

#carousel_prev {
  background: url(../img/ico/arwL02.png) no-repeat;
  margin-left: -15px;
}

#carousel_next {
  background: url(../img/ico/arwR02.png) no-repeat;
}

.compare_product {
  overflow: hidden;
}
.compare_product .movements {
  overflow: hidden;
  display: inline-block;
}
.compare_product .movements:after {
  content: ".";
  height: 0;
  clear: both;
  display: block;
  visibility: hidden;
}
.compare_product .compare_product_column {
  width: 140px;
  float: left;
  position: relative;
}
.compare_product .compare_product_column table {
  vertical-align: top;
}
.compare_product th,
.compare_product td {
  width: 140px;
  text-align: center;
  vertical-align: middle;
  border-left-style: none;
  background: #fff;
}
.compare_product tbody tr:nth-child(odd) td {
  background: #efefef;
}
.compare_product .cell_checkbox {
  vertical-align: middle;
  text-align: center;
  border-bottom: 2px solid #000;
}
.compare_product .header_product {
  vertical-align: top;
  line-height: 1.4em;
}
.compare_product .header_product .thumbnail {
  display: block;
  padding: 10px 0 20px;
  text-align: center;
}
.compare_product .header_product .thumbnail img {
  width: auto;
  max-height: 57px;
}

#filtering_reset {
  display: none;
}

.compare_note {
  margin-top: 50px;
  counter-reset: compare_note;
}
.compare_note li {
  counter-increment: compare_note;
  padding-left: 2.5em;
  position: relative;
}
.compare_note li::before {
  position: absolute;
  left: 0;
  content: "※" counter(compare_note);
}

/* 使い方ガイド */
._ex_guide_step_label01, .page-guide .guide_intro01_link li::before {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  background: #011287;
  color: #fff;
  padding: 0 0.5em;
  margin-right: 1em;
}

._ex_guide_step_label02, .page-guide .guide_pagenav01 li .title::before, .page-guide .guide_pagenav03 li > a::before {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  text-align: center;
}

.page-guide {
  counter-reset: step_body;
  /*	.guide_pagenav02 {
  		margin: 50px auto;
  		
  		ol {
  			list-style-type: none;
  			overflow: hidden;
  			counter-reset: guide_pagenav02;
  			margin: 0 -15px;
  			
  		}
  		li {
  			width: 33.333333%;
  			float: left;
  			counter-increment: guide_pagenav02;
  			
  			> a{
  				display: block;
  				text-decoration: none;
  				background: #222;
  				color: #fff;
  				margin: 0 15px;
  				padding: 7px ;
  				
  				&::before {
  					@extend ._ex_guide_step_label02 ;
  					content: "STEP."counter(guide_pagenav02);
  				}
  				
  				
  			}
  		}
  	}
  */
}
.page-guide .guide_intro01 {
  margin: 0 auto 50px;
  font-size: 16px;
  font-size: 1.6rem;
}
.page-guide .guide_intro01_link {
  margin: 15px 0;
}
.page-guide .guide_intro01_link ol {
  counter-reset: guide_intro01_link;
  list-style-type: none;
}
.page-guide .guide_intro01_link li {
  counter-increment: guide_intro01_link;
  border-bottom: 1px dotted #999;
  padding: 10px 0;
}
.page-guide .guide_intro01_link li::before {
  content: "STEP." counter(guide_intro01_link);
}
.page-guide .guide_header01 {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 auto 30px;
  padding: 25px 15px;
  font-weight: 700;
  border: 1px solid #aaa;
  border-top: 1px solid #011287;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_header01 {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 10px 15px;
    margin-bottom: 20px;
  }
}
.page-guide .guide_header02 {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 auto 30px;
  text-align: center;
  font-weight: 700;
}
.page-guide .guide_pagenav01 {
  margin: 50px auto;
}
.page-guide .guide_pagenav01 ol {
  list-style-type: none;
  overflow: hidden;
  counter-reset: guide_pagenav01;
  margin: 0 -15px;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_pagenav01 ol {
    margin: 0;
  }
}
.page-guide .guide_pagenav01 li {
  width: 33.333333%;
  float: left;
  text-align: center;
  counter-increment: guide_pagenav01;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_pagenav01 li {
    float: none;
    width: auto;
  }
}
.page-guide .guide_pagenav01 li .title::before {
  content: "STEP." counter(guide_pagenav01);
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_pagenav01 li .title::before {
    text-align: left;
  }
}
.page-guide .guide_pagenav01 li > a {
  background-color: #ededed;
  background-repeat: no-repeat;
  background-position: center 20px;
  color: #222;
  display: block;
  text-decoration: none;
  margin: 0 15px 30px;
  padding: 135px 0 20px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_pagenav01 li > a {
    text-align: left;
    margin: 0;
    padding: 15px 15px 15px 100px;
    background-position: 15px center;
    background-size: auto 80%;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #ccc;
  }
  .page-guide .guide_pagenav01 li > a::after {
    line-height: 24px;
    font-size: 24px;
    display: block;
    font-family: FontAwesome;
    font-weight: normal !important;
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -0.5em;
    content: "\f105";
  }
}
.page-guide .guide_pagenav01 li > a::before {
  position: absolute;
  left: 50%;
  bottom: -35px;
  margin-left: -16px;
  width: 0;
  height: 0;
  content: "";
  border: 16px solid transparent;
  border-top: 8px solid #222;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_pagenav01 li > a::before {
    display: none;
  }
}
.page-guide .guide_pagenav01 li > a[href*="step01"] {
  background-image: url(../../img/guide_pagenav01.png);
}
.page-guide .guide_pagenav01 li > a[href*="step02"] {
  background-image: url(../../img/guide_pagenav02.png);
}
.page-guide .guide_pagenav01 li > a[href*="step03"] {
  background-image: url(../../img/guide_pagenav03.png);
}
.page-guide .guide_pagenav03 ol {
  list-style-type: none;
  overflow: hidden;
  text-align: center;
}
.page-guide .guide_pagenav03 li {
  width: 320px;
  margin: 0 auto;
  line-height: 100%;
}
.page-guide .guide_pagenav03 li > a {
  display: block;
  text-decoration: none;
  background: #222;
  color: #fff;
  padding: 15px;
  position: relative;
  font-weight: 700;
  font-size: 20px;
  font-size: 2rem;
  text-align: center;
}
.page-guide .guide_pagenav03 li > a::before {
  font-weight: 400;
  padding-bottom: 10px;
}
.page-guide .guide_pagenav03 li > a::after {
  line-height: 24px;
  font-size: 24px;
  display: block;
  font-family: FontAwesome;
  font-weight: normal !important;
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -0.5em;
  content: "\f105";
}
.page-guide .guide_pagenav03 .step01 a::before {
  content: "STEP.1";
}
.page-guide .guide_pagenav03 .step02 a::before {
  content: "STEP.2";
}
.page-guide .guide_pagenav03 .step03 a::before {
  content: "STEP.3";
}
.page-guide .guide_pageanchor01 {
  margin: 50px auto;
  padding: 25px 30px;
  background: #ededed;
  border-top: #222 solid 1px;
  overflow: hidden;
  @incude font-size(1.4);
}
.page-guide .guide_pageanchor01 ol[start="0"] li:first-child {
  list-style-type: none;
}
.page-guide .guide_pageanchor01 li {
  border-bottom: 1px solid #222;
  padding: 7px 0;
  list-style-position: inside;
}
.page-guide .guide_pageanchor01 li a {
  color: #222;
  text-decoration: none;
}
.page-guide .guide_pageanchor01 li a:hover {
  text-decoration: underline;
}
.page-guide .guide_ttl01 {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 auto 30px;
  text-align: center;
  font-weight: 700;
}
.page-guide .guide_ttl01 .step_label {
  margin-right: 1em;
}
.page-guide .guide_ttl02 {
  color: #011287;
  font-size: 24px;
  font-size: 2.4rem;
  margin: 0 auto 40px;
  padding: 0 200px 0 30px;
  font-weight: 700;
  border: 1px solid #bbb;
  line-height: 58px;
  min-height: 60px;
  position: relative;
}
.page-guide .guide_ttl02::before {
  content: counter(step_body) ". ";
}
.page-guide .guide_ttl02::after {
  content: "";
  width: 5px;
  height: 100%;
  position: absolute;
  left: -1px;
  top: -1px;
  display: block;
  background: #011287;
  border: 1px solid #011287;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_ttl02 {
    font-size: 20px;
    font-size: 2rem;
    line-height: 38px;
    min-height: 40px;
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
.page-guide .guide_ttl03 {
  color: #89612b;
  font-size: 20px;
  font-size: 2rem;
  margin: 0 auto 15px;
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_ttl03 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.page-guide .guide_ttl03.left {
  float: left;
}
.page-guide .guide_ttl04 {
  color: #011287;
  font-size: 18px;
  font-size: 1.8rem;
  margin: 0 auto 15px;
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_ttl04 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.page-guide .guide_ttl04.left {
  float: left;
}
.page-guide .guide_ttl05 {
  font-size: 18px;
  font-size: 1.8rem;
  margin: 0 auto 15px;
  font-weight: 700;
}
.page-guide .step_body {
  position: relative;
  overflow: hidden;
  background: #fff;
  counter-increment: step_body;
}
.page-guide .step_body + .step_body {
  margin-top: 60px;
}
.page-guide .step_content {
  overflow: hidden;
  padding: 0 45px 40px 25px;
  border-bottom: 1px solid #bbb;
  margin-top: 40px;
}
@media only screen and (max-width: 767px) {
  .page-guide .step_content {
    padding: 0 15px 15px;
  }
}
.page-guide .step_content .step_sub_content {
  margin-left: -25px;
  margin-right: -45px;
}
@media only screen and (max-width: 767px) {
  .page-guide .step_content .step_sub_content {
    margin-left: -15px;
    margin-right: -15px;
  }
}
.page-guide .step_sub_content {
  overflow: hidden;
  padding: 25px 45px 25px 25px;
  margin-top: 30px;
  background: #f5f0e3;
}
@media only screen and (max-width: 767px) {
  .page-guide .step_sub_content {
    padding: 15px;
  }
}
.page-guide .step_sub_content .step_content {
  padding: 0 25px 30px 0;
  margin-right: -25px;
}
@media only screen and (max-width: 767px) {
  .page-guide .step_sub_content .step_content {
    padding: 0 15px 15px;
    margin-right: 0;
  }
}
.page-guide .step_sub_content .step_content:first-child {
  margin-top: 0;
}
.page-guide .step_sub_content .step_content:last-child {
  border-bottom-style: none;
  padding-bottom: 5px;
}
.page-guide .guide_kome01 {
  font-size: 13px;
  font-size: 1.3rem;
}
.page-guide .guide_kome01 li {
  padding-left: 1.5em;
}
.page-guide .guide_kome01 li::before {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "※";
  text-indent: -1.5em;
}
.page-guide .guide_movie_btn01 {
  position: absolute;
  right: 1px;
  top: 1px;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_movie_btn01 {
    position: static;
    margin-top: 20px;
  }
}
.page-guide .guide_movie_btn01 a {
  line-height: 58px;
  min-height: 58px;
  background: #222;
  color: #fff;
  text-decoration: none;
  text-align: center;
  width: 10em;
  display: none;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_movie_btn01 a {
    width: auto;
  }
}
.page-guide .guide_movie_btn01 a::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f144";
  margin-right: 2.5em;
}
.page-guide .guide_movie_btn01 a[href^="http://"], .page-guide .guide_movie_btn01 a[href^="https://"] {
  display: block;
}
.page-guide .guide_closing01 {
  font-size: 24px;
  font-size: 2.4rem;
  margin: 50px auto;
  text-align: center;
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  .page-guide .guide_closing01 {
    font-size: 20px;
    font-size: 2rem;
  }
}
.page-guide strong {
  font-weight: 500;
}
.page-guide small {
  font-size: 100%;
}
.page-guide .img_area {
  max-width: 400px;
}
@media only screen and (max-width: 767px) {
  .page-guide .img_area {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}
.page-guide .img_area.double {
  max-width: 415px;
  display: table;
  border-spacing: 15px 0;
}
.page-guide .img_area.double.right {
  margin-right: -15px;
}
.page-guide .img_area.double a {
  display: table-cell;
  max-width: 200px;
  vertical-align: middle;
  background: #fff;
}
.page-guide .img_area.double a + a {
  margin-left: 15px;
}
.page-guide .alignleft,
.page-guide .img_area.left {
  float: left;
  margin-right: 30px;
}
@media only screen and (max-width: 767px) {
  .page-guide .alignleft,
  .page-guide .img_area.left {
    float: none;
    margin: 0 auto 10px;
    text-align: center;
  }
}
.page-guide .alignleft + .text_area,
.page-guide .img_area.left + .text_area {
  clear: right;
}
.page-guide .alignright,
.page-guide .img_area.right {
  float: right;
  margin-left: 30px;
}
@media only screen and (max-width: 767px) {
  .page-guide .alignright,
  .page-guide .img_area.right {
    float: none;
    margin: 0 auto 10px;
    text-align: center;
  }
}
.page-guide .alignright + .text_area,
.page-guide .img_area.right + .text_area {
  clear: left;
}
.page-guide .img_area.center {
  max-width: 640px;
  text-align: center;
  margin: 0 auto 30px;
}
.page-guide .text_area {
  overflow: hidden;
}
.page-guide p + p {
  margin-top: 1.5em;
}
.page-guide p img {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  vertical-align: middle;
  max-height: 20px;
  width: auto;
  margin-right: 7px;
}
.page-guide a.colorbox-guide {
  position: relative;
  display: block;
  margin: 0 5px 5px 0;
}
@media only screen and (max-width: 767px) {
  .page-guide a.colorbox-guide.inline {
    display: none;
  }
}
.page-guide a.colorbox-guide::after {
  text-align: center;
  width: 35px;
  height: 35px;
  line-height: 35px;
  display: block;
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 20px;
  content: "\f00e";
  background: #011287;
  color: #fff;
  position: absolute;
  right: -5px;
  bottom: -5px;
}
.page-guide .guide_num_list {
  counter-reset: guide_num_list;
}
.page-guide .guide_num_list li {
  list-style-type: none;
  counter-increment: guide_num_list;
  line-height: 30px;
  position: relative;
  padding-left: 40px;
}
.page-guide .guide_num_list li + li {
  margin-top: 0.5em;
}
.page-guide .guide_num_list li:before {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: counter(guide_num_list);
  color: #830008;
  border: 2px solid #830008;
  width: 24px;
  min-height: 24px;
  position: absolute;
  left: 0;
  top: 0;
  left: 0;
  line-height: 24px;
  vertical-align: top;
  text-align: center;
  border-radius: 17px;
  font-weight: 700;
}
.page-guide .wp-image-2198,
.page-guide .wp-image-2199,
.page-guide .wp-image-2202,
.page-guide .wp-image-2201,
.page-guide .wp-image-2200 {
  max-height: none;
}
.page-guide .wp-image-2248 {
  max-height: 24px;
}
.page-guide .wp-image-2180 {
  max-height: 48px;
}
.page-guide img[alt="[雲]"] {
  max-height: 42px;
}
.page-guide .tool_list01 ul {
  margin-top: 20px;
}
.page-guide .tool_list01 li + li {
  margin-top: 7px;
}
.page-guide .tool_list01 img {
  margin-right: 7px;
}
.page-guide .tool_list02 .row, .page-guide .tool_list02 .function_list_general .function ul, .function_list_general .function .page-guide .tool_list02 ul,
.page-guide .tool_list02 .function_list_general .function ol,
.function_list_general .function .page-guide .tool_list02 ol, .page-guide .tool_list02 .single.interview .ba, .single.interview .page-guide .tool_list02 .ba {
  margin-bottom: 30px;
}
.page-guide .caption {
  display: block;
  padding-top: 5px;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .page-guide .popup_wrapper {
    display: block !important;
  }
  .page-guide .popup .title {
    display: none;
  }
  .page-guide .eyecatch {
    max-width: 90%;
    margin: 0 auto 15px;
  }
  .page-guide .excerpt {
    background-color: transparent;
  }
}
.page-guide #step02_00 .guide_ttl02::before {
  content: "";
}
.page-guide #step02_01 {
  counter-reset: step_body;
}
.page-guide #step03_04_01 .img_area a + a {
  margin-top: 30px;
}

/* カスタム投稿タイプ「機能」 */
.searchform_open {
  width: 280px;
  background: #666;
  display: block;
  margin: 20px auto;
  padding: 15px 80px;
  color: #fff;
  border-radius: 30px;
  position: relative;
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
  cursor: pointer;
  line-height: 1em;
}
@media only screen and (max-width: 767px) {
  .searchform_open {
    width: auto;
    margin: 20px;
  }
}
.search-results .searchform_open {
  display: none;
}

.searchform_selector {
  background: #f5f5f5;
  border: 1px solid #bbb;
  margin: 0 auto 40px;
  padding: 0;
  max-width: 980px;
}
.searchform_selector .searchform_selector_body {
  display: none;
}
.search-results .searchform_selector .searchform_selector_body {
  display: block;
}
@media only screen and (max-width: 767px) {
  .searchform_selector {
    margin: 15px auto 30px;
  }
}
.searchform_selector .btn_close {
  text-align: right;
  padding: 20px 20px 0 0;
  font-size: 30px;
  color: #666;
}
.searchform_selector .btn_close span {
  cursor: pointer;
}
.searchform_selector .checkboxBlock {
  background: #f5f5f5;
  padding: 30px;
}
@media only screen and (max-width: 767px) {
  .searchform_selector .checkboxBlock {
    padding: 10px;
  }
}
.searchform_selector .checkboxBlock + .checkboxBlock {
  border-top: 1px dashed #bbb;
}
.searchform_selector .btnBlock {
  background: #DDDDDD;
  padding: 30px;
  border-top: 1px solid #bbb;
}
@media only screen and (max-width: 767px) {
  .searchform_selector .btnBlock {
    padding: 10px;
  }
}
.searchform_selector label {
  display: inline-block;
  cursor: pointer;
}
@media (min-width: 1px) {
  .searchform_selector label::before {
    content: "";
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 1em;
    height: 1em;
    line-height: 1;
    border-radius: 2px;
    vertical-align: middle;
    margin-right: 5px;
    border: 1px solid #bbb;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.1) inset;
  }
  .searchform_selector label.active::before {
    font-family: FontAwesome;
    font-weight: normal !important;
    content: "\f00c";
  }
  .searchform_selector input[type="checkbox"] {
    display: none;
  }
}
.searchform_selector .title {
  color: #011287;
  font-weight: 700;
  padding-left: 40px;
  margin-bottom: 15px;
}
.searchform_selector .title.product {
  background: url(../img/ico/ico_product01.png) no-repeat left center;
}
.searchform_selector .title.function {
  background: url(../img/ico/ico_function01.png) no-repeat left center;
}
.searchform_selector .feas-submit-button {
  width: 280px;
  cursor: pointer;
  display: block;
  margin: 0 auto;
  padding: 15px 80px;
  background: #222;
  color: #fff;
  border-radius: 30px;
  border-style: none;
  position: relative;
  line-height: 1em;
}
@media only screen and (max-width: 767px) {
  .searchform_selector .feas-submit-button {
    width: auto;
  }
}
.searchform_selector .feas-submit-button::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f002";
  position: absolute;
  left: 60px;
  top: 10px;
}
.searchform_selector #search_product_selector .menu {
  overflow: hidden;
  margin: -10px -3% 0 0;
}
.searchform_selector #search_product_selector label {
  font-size: 13px;
  font-size: 1.3rem;
  width: 30%;
  margin: 10px 3% 0 0;
  padding: 5px 40px 5px 5px;
  float: left;
  border: 1px solid #bbb;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 100%;
  cursor: pointer;
  display: block;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .searchform_selector #search_product_selector label {
    width: 47%;
  }
}
@media only screen and (max-width: 767px) {
  .searchform_selector #search_product_selector label {
    width: auto;
    float: none;
  }
}
.searchform_selector #search_product_selector label::before {
  border-style: none;
  box-shadow: none;
  height: auto;
  font-family: FontAwesome;
  font-weight: normal !important;
  font-size: 18px;
  content: "\f00c";
  color: #bbb;
  margin-right: 5px;
}
.searchform_selector #search_product_selector label.active::before {
  color: #111;
}
.searchform_selector #feas_0_1_0,
.searchform_selector #feas_1_1_0 {
  background-image: url(../img/ico/ico_mdex.png);
}
.searchform_selector #feas_0_1_1,
.searchform_selector #feas_1_1_1 {
  background-image: url(../img/ico/ico_id.png);
}
.searchform_selector #feas_0_1_2,
.searchform_selector #feas_1_1_2 {
  background-image: url(../img/ico/ico_rd.png);
}
.searchform_selector #feas_0_1_3,
.searchform_selector #feas_1_1_3 {
  background-image: url(../img/ico/ico_md.png);
}

.return_prev_page {
  margin: 40px auto;
  max-width: 280px;
}
.return_prev_page a {
  text-decoration: none;
  text-align: center;
  display: block;
  margin: 0 auto;
  padding: 10px 0;
  background: #222;
  color: #fff;
  border-radius: 30px;
  position: relative;
}

.post_type_function_list .function {
  margin-bottom: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid #bbb;
}
.post_type_function_list .function .icon {
  line-height: 1;
  margin: 10px 0 5px;
}
.post_type_function_list .function .icon li {
  display: inline-block;
}
.post_type_function_list .function .icon li a {
  display: block;
  width: 20px;
  height: 0;
  padding: 20px 0 0;
  overflow: hidden;
  background-size: 20px auto !important;
}
.post_type_function_list .function .icon li a[href*="pro9"] {
  background: url(../img/ico/ico_md.png) no-repeat;
}
.post_type_function_list .function .icon li a[href*="pro9ex"] {
  background: url(../img/ico/ico_mdex.png) no-repeat;
}
.post_type_function_list .function .icon li a[href*="neo3"] {
  background: url(../img/ico/ico_id.png) no-repeat;
}
.post_type_function_list .function .icon li a[href*="reform-designer"] {
  background: url(../img/ico/ico_rd.png) no-repeat;
}
.post_type_function_list .function .title {
  font-weight: 700;
  display: block;
  margin: 5px 0;
}
.post_type_function_list .function .more {
  display: block;
}
.post_type_function_list .function .more a {
  /*デザイナ追記*/
  display: inline-block;
  background: #aaa;
  border: none;
  color: #fff;
  text-decoration: none;
  text-align: center;
  padding: 2px 20px;
  margin-top: 10px;
}
.post_type_function_list .function .more a:before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f0da";
  margin-right: 10px;
}

.number_of_posts {
  display: block;
  float: right;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 400;
}
.number_of_posts strong {
  color: #011287;
  font-size: 24px;
  font-size: 2.4rem;
}

@media only screen and (max-width: 979px) {
  .single-function .body {
    padding: 0 15px;
  }
}
.single-function .body h2, .single-function .body h3, .single-function .body h4 {
  font-weight: 700;
  overflow: hidden;
  line-height: 1.4em;
}
.single-function .body * + h2,
.single-function .body * + h2,
.single-function .body * + h4 {
  margin-top: 40px;
}
.single-function .body h2 {
  font-size: 27px;
  font-size: 2.7rem;
  text-align: center;
  margin: 20px auto 30px auto;
  font-weight: 500;
  letter-spacing: 0.5px;
}
.single-function .body h4 {
  font-size: 19px;
  font-size: 1.9rem;
  position: relative;
  background: url(../img/bg/slash03.png);
  margin: 0 auto 15px;
  padding: 25px;
  font-weight: 500;
}
.single-function .body h4::before {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  content: "";
  height: 0;
  width: 0;
  border: 8px solid transparent;
  border-top-color: #011287;
  border-left-color: #011287;
}
.single-function .body .row, .single-function .body .function_list_general .function ul, .function_list_general .function .single-function .body ul,
.single-function .body .function_list_general .function ol,
.function_list_general .function .single-function .body ol, .single-function .body .single.interview .ba, .single.interview .single-function .body .ba {
  margin-bottom: 40px;
}

/* カスタム投稿タイプ「出力サンプル」 */
/* Scss Document */
/* 出力サンプル詳細 */
.perspective_content .body + .link_product_page_list {
  margin-top: 30px;
}

#thumbnailSlides .slides li {
  width: 25% !important;
}

.link_product_page_list li {
  border-bottom: 1px dotted #bbb;
}
.link_product_page_list li a {
  text-decoration: none;
  color: #222;
  display: block;
  padding: 10px 10px 10px 56px;
  line-height: 36px;
  background-repeat: no-repeat;
  background-position: 10px 10px;
  background-size: 36px auto;
}
.link_product_page_list li a[href*="pro9"] {
  background-image: url(../img/ico/ico_md.png);
}
.link_product_page_list li a[href*="pro9ex"] {
  background-image: url(../img/ico/ico_mdex.png);
}
.link_product_page_list li a[href*="neo3"] {
  background-image: url(../img/ico/ico_id.png);
}
.link_product_page_list li a[href*="reform-designer"] {
  background-image: url(../img/ico/ico_rd.png);
}

.link_product_page_list_heading {
  font-size: 16px;
  font-size: 1.6rem;
  color: #555;
  padding: 0 10px 10px;
  border-bottom: 1px solid #bbb;
}

.connected_perspective_list {
  max-width: 980px;
  margin: 60px auto;
  padding: 30px;
  background: url(../img/bg/slash03.png);
  border: 1px solid #ededed;
  border-top: 1px solid #021fdf;
}
@media only screen and (max-width: 767px) {
  .connected_perspective_list {
    padding: 15px;
  }
}

.connected_perspective_list_heading {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 800;
  text-align: center;
  margin-bottom: 30px;
}

.perspective_list_normal {
  margin: 60px auto;
}
@media only screen and (max-width: 767px) {
  .perspective_list_normal {
    margin: 15px auto;
  }
}
.perspective_list_normal .row, .perspective_list_normal .function_list_general .function ul, .function_list_general .function .perspective_list_normal ul,
.perspective_list_normal .function_list_general .function ol,
.function_list_general .function .perspective_list_normal ol, .perspective_list_normal .single.interview .ba, .single.interview .perspective_list_normal .ba {
  margin-top: -30px;
}
.perspective_list_normal .perspective {
  margin-top: 30px;
  text-align: center;
}
.perspective_list_normal .perspective a {
  color: #222;
  text-decoration: none;
}
.perspective_list_normal .perspective .thumbnail {
  display: block;
}
.perspective_list_normal .perspective .title {
  display: block;
}

.related_perspective_list {
  margin: 60px auto;
}

.connected_interview_list {
  margin: 60px auto;
}

.interview_list_normal .row, .interview_list_normal .function_list_general .function ul, .function_list_general .function .interview_list_normal ul,
.interview_list_normal .function_list_general .function ol,
.function_list_general .function .interview_list_normal ol, .interview_list_normal .single.interview .ba, .single.interview .interview_list_normal .ba {
  margin-top: -30px;
}
.interview_list_normal .interview {
  border: 1px solid #bbb;
  margin-top: 30px;
}
.interview_list_normal .interview > a {
  color: #bbb;
  text-decoration: none;
  padding: 15px 30px 15px 0;
  display: block;
  overflow: hidden;
  position: relative;
}
.interview_list_normal .interview > a:after {
  display: block;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f055";
  position: absolute;
  right: 15px;
  top: 15px;
}
.interview_list_normal .interview .thumbnail {
  width: 48%;
  float: left;
  margin: -16px 15px -16px -1px;
}
.interview_list_normal .interview .textArea {
  overflow: hidden;
}
.interview_list_normal .interview .number {
  display: block;
  margin-bottom: 10px;
}
.interview_list_normal .interview .number strong {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 400;
}
.interview_list_normal .interview .number.pro9ex {
  /* PRO9EX */
  color: #307bd1;
}
.interview_list_normal .interview .number.page-neo3 {
  /* Neo3 */
  color: #830008;
}
.interview_list_normal .interview .number.reform-designer2 {
  /* リフォームデザイナー */
  color: #CF7119;
}
.interview_list_normal .interview .number.pro9 {
  /* PRO9 */
  color: #830008;
}
.interview_list_normal .interview .title {
  font-size: 16px;
  font-size: 1.6rem;
  color: #222;
}
.interview_list_normal .interview .name {
  color: #a87b46;
}

.perspective_author_comment {
  margin-bottom: 30px;
  overflow: hidden;
  color: #555;
}
.perspective_author_comment .perspective_author_comment_ttl {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 5px;
}
.perspective_author_comment .perspective_author_comment_ttl::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f007";
  margin-right: 5px;
  font-size: 20px;
  font-weight: normal !important;
}
.perspective_author_comment .body {
  background: #fafafa;
  border: 1px solid #bababa;
  padding: 15px;
  overflow: hidden;
}
.perspective_author_comment a[target="_blank"] {
  text-decoration: none;
}
.perspective_author_comment a[target="_blank"]:hover {
  text-decoration: underline;
}
.perspective_author_comment a[target="_blank"]::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f08e";
  font-size: 14px;
  margin-left: 5px;
}

/* カスタム投稿タイプ「導入事例・インタビュー」 */
.interview_title01 {
  color: #111;
  @font-size (2.4);
  font-weight: 700;
  margin: 0 auto 35px;
}
.interview_title01 .vol {
  margin-right: 1em;
}

.interview_archive_list .interview {
  padding-left: 15px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list .interview {
    padding-left: 0;
  }
}
.interview_archive_list .interview + .interview {
  margin-top: 15px;
}
.interview_archive_list .interview .number {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 700;
  color: #111;
  border-bottom: 2px solid #222;
  position: absolute;
  left: 0;
  top: 20px;
  z-index: 10;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list .interview .number {
    font-size: 14px;
    font-size: 1.4rem;
    position: static;
    border-bottom-style: none;
  }
}
.interview_archive_list .interview > a {
  color: #555;
  text-decoration: none;
  display: block;
  border: 1px solid #ccc;
  overflow: hidden;
  padding: 0 40px 0 0;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list .interview > a {
    padding-right: 20px;
  }
}
.interview_archive_list .interview > a::after {
  font-size: 24px;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f105";
  color: #ccc;
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -12px;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list .interview > a::after {
    right: 7px;
  }
}
.interview_archive_list .interview .thumbnail {
  display: block;
  margin: -1px 30px -1px -1px;
  float: left;
  width: 35%;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list .interview .thumbnail {
    margin-right: 15px;
  }
}
.interview_archive_list .interview .textArea {
  overflow: hidden;
  line-height: 1.4;
}
.interview_archive_list .interview .title {
  margin: 15px 0;
  color: #111 !important;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 700;
}
.interview_archive_list .interview .catch {
  margin: 15px 0;
  display: block;
  color: #866c43 !important;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 400;
  height: 3em;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list .interview .catch {
    margin: 10px 0;
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.interview_archive_list .interview .nameArea {
  margin: 15px 0;
}

.single.interview .cover {
  overflow: hidden;
  position: relative;
  margin: 0 auto 30px;
}
.single.interview .cover img {
  border: 1px solid #ccc;
  width: 100%;
  height: auto;
}
.single.interview .cover img + .nameArea {
  position: absolute;
  right: 1px;
  bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .single.interview .cover img + .nameArea {
    position: static !important;
  }
}
.single.interview .cover .nameArea {
  width: 45%;
  background: #111;
  color: #fff;
  margin: 0 0 0 auto;
  padding: 25px 30px;
  position: static;
}
@media only screen and (max-width: 767px) {
  .single.interview .cover .nameArea {
    width: 100%;
    margin: 0 auto;
    padding: 15px 20px;
  }
}
.single.interview .cover .nameArea .vol {
  display: block;
  color: #de8238;
  position: relative;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 700;
  padding: 0 0 5px;
}
.single.interview .cover .nameArea .vol::after {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  border-top: 1px solid #de8238;
  width: 30px;
  height: 0;
}
.single.interview .cover .nameArea .name {
  color: #fff;
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: 400;
  display: block;
  margin: 10px 0;
}
@media only screen and (max-width: 767px) {
  .single.interview .cover .nameArea .name {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.single.interview .body {
  font-size: 16px;
  font-size: 1.6rem;
}
.single.interview .body * + p {
  margin-top: 1em;
}
.single.interview .ttl01 {
  color: #866c43;
  font-size: 30px;
  font-size: 3rem;
  font-weight: 400;
  line-height: 1.5;
  margin: 0 auto 30px;
}
.single.interview .ttl02 {
  color: #111;
  font-size: 30px;
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.5;
  padding-left: 45px;
  margin: 0 auto 30px;
  background: url(../img/ico/ico_bubble01.png) no-repeat left 0.25em;
}
.single.interview .ttl03 {
  color: #de8238;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 400;
  position: relative;
  margin: 50px auto 30px;
  padding: 3px 0 0 45px;
  line-height: 30px;
  min-height: 36px;
}
.single.interview .ttl03:first-child {
  margin-top: 0;
}
.single.interview .ttl03.num1::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "1";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num2::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "2";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num3::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "3";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num4::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "4";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num5::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "5";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num6::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "6";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num7::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "7";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num8::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "8";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num9::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "9";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num10::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "10";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num11::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "11";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num12::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "12";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num13::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "13";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num14::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "14";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num15::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "15";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num16::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "16";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num17::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "17";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num18::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "18";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num19::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "19";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .ttl03.num20::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "20";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.interview .conversion {
  margin: 30px auto;
  width: 100%;
  border: 1px solid #ccc;
  overflow: hidden;
  display: table;
}
@media only screen and (max-width: 767px) {
  .single.interview .conversion {
    display: block;
  }
}
.single.interview .conversion .conversion_ttl {
  background: #111;
  color: #fff;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  width: 30%;
  font-size: 20px;
  font-size: 2rem;
  font-weight: 400;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .single.interview .conversion .conversion_ttl {
    width: 25%;
  }
}
@media only screen and (max-width: 767px) {
  .single.interview .conversion .conversion_ttl {
    width: auto;
    display: block;
    padding: 7px 0;
  }
}
.single.interview .conversion .conversion_ttl em {
  display: block;
  color: #858585;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: 700;
}
.single.interview .conversion .conversion_content {
  display: table-cell;
  width: 70%;
  padding: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .single.interview .conversion .conversion_content {
    width: 75%;
  }
}
@media only screen and (max-width: 767px) {
  .single.interview .conversion .conversion_content {
    width: auto;
    display: block;
  }
}
.single.interview .conversion .conversion_content strong {
  background: #f5d608;
  padding: 0 0.2em;
  font-weight: 200;
}
.single.interview .conversion .conversion_content * + p {
  margin-top: 0.5em;
}
.single.interview .conversion .conversion_content li {
  line-height: 1.4em;
  padding-left: 25px;
  background: url(../img/ico/ico_check01.png) no-repeat left 0.2em;
}
.single.interview .conversion .conversion_content li + li {
  margin-top: 1em;
}
.single.interview * + .block {
  margin-top: 60px;
}
.single.interview .block {
  border-top: 1px solid #ccc;
  position: relative;
  padding-top: 30px;
}
.single.interview .block::before {
  position: absolute;
  left: 0;
  top: -1px;
  display: block;
  content: "";
  height: 0;
  width: 30px;
  border-top: 2px solid #111;
}
.single.interview .ba {
  overflow: hidden;
  margin: 30px auto;
}
.single.interview .ba .ba_ttl {
  text-align: center;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
  margin: 0 auto 0.5em;
}
.single.interview .ba .ba_caption {
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 0.5em;
  display: block;
  line-height: 1.6;
}

.interview_archive_list_small .interview {
  margin-top: -1px;
  position: relative;
}
.interview_archive_list_small .interview > a {
  color: #111;
  text-decoration: none;
  display: block;
  border: 1px solid #ccc;
  overflow: hidden;
  padding: 15px 40px 15px 15px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list_small .interview > a {
    padding-right: 20px;
  }
}
.interview_archive_list_small .interview > a::after {
  font-size: 24px;
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f105";
  color: #ccc;
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -12px;
}
@media only screen and (max-width: 767px) {
  .interview_archive_list_small .interview > a::after {
    right: 7px;
  }
}
.interview_archive_list_small .interview > a .title .vol {
  margin-right: 1em;
}
.interview_archive_list_small .interview > a .catch {
  color: #866c43 !important;
  font-weight: 700;
  line-height: 1.5;
}

/* カスタム投稿タイプ「ユーザー作品」 */
.single.users .body .eyecatch {
  text-align: center;
}
.single.users .body table {
  margin: 30px auto;
  width: 100%;
}
.single.users .body table th {
  background: #000;
  color: #fff;
  font-weight: 400;
  white-space: nowrap;
}
.single.users a[target="_blank"] {
  text-decoration: none;
}
.single.users a[target="_blank"]:hover {
  text-decoration: underline;
}
.single.users a[target="_blank"]::after {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f08e";
  font-size: 14px;
  margin-left: 5px;
}

.users_invitation {
  margin: 30px auto;
  padding: 20px;
  border: 1px solid #bbb;
  border-top-color: #011287;
  overflow: hidden;
}
.users_invitation .users_invitation_ttl {
  color: #011287;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 400;
  margin-bottom: 20px;
}
.users_invitation .link {
  margin-top: 20px;
}
.users_invitation .link a {
  width: 200px;
  display: block;
  padding: 10px 30px;
  position: relative;
}
.users_invitation .link a .fa-caret-right {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -0.5em;
}

/* カスタム投稿タイプ「インテリアを学ぶ」 */
.practical_category_list li {
  padding-left: 1em;
  position: relative;
}
.practical_category_list li::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f0da";
  font-size: 12px;
  position: absolute;
  left: 0;
}
.practical_category_list a {
  color: #4a4a4a;
  text-decoration: none;
}
.practical_category_list a:hover {
  text-decoration: underline;
}
.practical_category_side .practical_category_list {
  border-top: 1px solid #aaa;
  margin: 29px 0 50px;
  padding-top: 20px;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 140%;
}
.practical_category_side .practical_category_list li + li {
  margin-top: 10px;
}
.practical_category_footer .practical_category_list {
  background: #efefef;
  padding: 20px;
}
.practical_category_footer .practical_category_list ul {
  overflow: hidden;
}
.practical_category_footer .practical_category_list li {
  float: left;
  width: 50%;
}
@media only screen and (max-width: 767px) {
  .practical_category_footer .practical_category_list li {
    float: none;
    width: auto;
  }
}

@media only screen and (min-width: 768px) and (max-width: 979px) {
  .practical_category_side {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .practical_category_side {
    display: none;
  }
}

.practical_category_footer {
  margin-top: 50px;
}
.practical_category_footer .practical_category_footer_ttl {
  color: #1b1b1b;
  font-size: 14px;
  font-size: 1.4rem;
  margin-bottom: 10px;
}

.post_type_practical_list ul {
  margin-top: -30px;
}
.post_type_practical_list .practical {
  margin-top: 30px;
}
.post_type_practical_list .practical .thumbnail {
  display: block;
}
.post_type_practical_list .practical .thumbnail img {
  width: 100%;
  height: auto;
}
.post_type_practical_list .practical .label {
  display: block;
  border-bottom: 1px solid #aaa;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 5px 0;
}
.post_type_practical_list .practical .label em {
  font-weight: 300;
}
.post_type_practical_list .practical .label em::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f02b";
  margin: 0 10px;
}
.post_type_practical_list .practical .title {
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 300;
  line-height: 1.4em;
  padding-top: 10px;
}
.post_type_practical_list .practical .title a {
  color: #866c43;
  text-decoration: none;
}

.single.practical {
  font-size: 14px;
  font-size: 1.4rem;
}
.single.practical .ttl01 {
  font-size: 20px;
  font-size: 2rem;
  text-align: center;
  padding: 20px 80px;
  margin: 50px auto 20px;
  position: relative;
  color: #866c43;
  font-weight: 300 !important;
}
@media only screen and (max-width: 767px) {
  .single.practical .ttl01 {
    margin: 30px auto 15px;
    padding: 10px 40px;
  }
}
.single.practical .ttl01::before, .single.practical .ttl01::after {
  content: "";
  line-height: 1em;
  color: #ab9b85;
  position: absolute;
  top: 0;
  width: 41px;
  height: 31px;
}
@media only screen and (max-width: 767px) {
  .single.practical .ttl01::before, .single.practical .ttl01::after {
    width: 24px;
    background-size: 100% auto !important;
  }
}
.single.practical .ttl01::before {
  left: 20px;
  background: url(../img/bg/bg_quote_start.png) no-repeat center top;
}
@media only screen and (max-width: 767px) {
  .single.practical .ttl01::before {
    left: 0;
  }
}
.single.practical .ttl01::after {
  right: 20px;
  background: url(../img/bg/bg_quote_end.png) no-repeat center top;
}
@media only screen and (max-width: 767px) {
  .single.practical .ttl01::after {
    right: 0;
  }
}
.single.practical .ttl02 {
  font-size: 20px;
  font-size: 2rem;
  margin: 50px auto 20px;
  position: relative;
  color: #866c43;
  font-weight: 300 !important;
}
.single.practical .ttl03 {
  color: #de8238;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 300 !important;
  position: relative;
  margin: 50px auto 30px;
  padding: 3px 0 0 45px;
  line-height: 30px;
  min-height: 36px;
}
.single.practical .ttl03:first-child {
  margin-top: 0;
}
.single.practical .ttl03.num1::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "1";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num2::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "2";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num3::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "3";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num4::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "4";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num5::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "5";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num6::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "6";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num7::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "7";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num8::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "8";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num9::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "9";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num10::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "10";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num11::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "11";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num12::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "12";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num13::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "13";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num14::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "14";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num15::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "15";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num16::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "16";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num17::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "17";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num18::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "18";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num19::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "19";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.practical .ttl03.num20::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "20";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}

.practical_header01 {
  color: #1b1b1b;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 30px;
  border-bottom: 1px solid #aaa;
  margin-bottom: 30px;
  padding-bottom: 18px;
}
.practical_header01 .label {
  display: block;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 20px;
  color: #817f7f;
}

.practical_intro {
  display: table;
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .practical_intro {
    display: block;
    width: auto;
  }
}
.practical_intro .img_area {
  display: table-cell;
  width: 50%;
}
.practical_intro .img_area img {
  max-width: 360px;
  height: auto;
}
@media only screen and (max-width: 767px) {
  .practical_intro .img_area {
    display: block;
    text-align: center;
    width: auto;
  }
}
.practical_intro .name_area {
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", YuMincho, "HG明朝E", "MS P明朝", "MS 明朝", serif;
  display: table-cell;
  vertical-align: middle;
  text-align: right;
  padding-right: 30px;
  width: 50%;
}
@media only screen and (max-width: 767px) {
  .practical_intro .name_area {
    display: block;
    text-align: center;
    margin-top: 20px;
    padding: 0;
    width: auto;
  }
}
.practical_intro .name_area .catch {
  color: #de8238;
  font-size: 20px;
  font-size: 2rem;
  font-style: italic;
  font-family: "Times New Roman", Times, serif;
}
.practical_intro .name_area .name {
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", YuMincho, "HG明朝E", "MS P明朝", "MS 明朝", serif;
  font-size: 24px;
  font-size: 2.4rem;
}
.practical_intro .name_area .name em {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
}

.practical_section {
  overflow: hidden;
  margin: 0;
}
.practical_section + .practical_section {
  margin-top: 50px;
  border-top: 1px dotted #aaa;
}
@media only screen and (max-width: 767px) {
  .practical_section + .practical_section {
    margin-top: 30px;
  }
}

.practical_comment {
  overflow: hidden;
  margin-top: 50px;
}
.practical_comment .comment_ttl01 {
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: 700;
  background: #1b1b1b;
  color: #fff;
  padding: 10px 30px;
}
.practical_comment .comment_ttl01::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f02d";
  margin-right: 10px;
}
.practical_comment .practical_comment_body {
  overflow: hidden;
  padding: 30px;
  border: 1px solid #aaa;
  background: url(../img/bg/there_is_no_repeat_bg01.jpg) center top;
}

/* カスタム投稿タイプ「チュートリアル」 */
.tutorial_category_list li {
  padding-left: 1em;
  position: relative;
}
.tutorial_category_list li::before {
  font-family: FontAwesome;
  font-weight: normal !important;
  content: "\f0da";
  font-size: 12px;
  position: absolute;
  left: 0;
}
.tutorial_category_list a {
  color: #4a4a4a;
  text-decoration: none;
}
.tutorial_category_list a:hover {
  text-decoration: underline;
}
.tutorial_category_side .tutorial_category_list {
  border-top: 1px solid #aaa;
  margin: 29px 0 50px;
  padding-top: 20px;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 140%;
}
.tutorial_category_side .tutorial_category_list li + li {
  margin-top: 10px;
}
.tutorial_category_footer .tutorial_category_list {
  background: #efefef;
  padding: 20px;
}
.tutorial_category_footer .tutorial_category_list ul {
  overflow: hidden;
}
.tutorial_category_footer .tutorial_category_list li {
  float: left;
  width: 50%;
}
@media only screen and (max-width: 767px) {
  .tutorial_category_footer .tutorial_category_list li {
    float: none;
    width: auto;
  }
}

@media only screen and (min-width: 768px) and (max-width: 979px) {
  .tutorial_category_side {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .tutorial_category_side {
    display: none;
  }
}

.tutorial_category_footer {
  margin-top: 50px;
}
.tutorial_category_footer .tutorial_category_footer_ttl {
  color: #1b1b1b;
  font-size: 14px;
  font-size: 1.4rem;
  margin-bottom: 10px;
}

.post_type_tutorial_list ul {
  margin-top: -30px;
}
.post_type_tutorial_list .tutorial {
  margin-top: 30px;
}
.post_type_tutorial_list .tutorial .thumbnail {
  display: block;
  border: 1px solid #aaa;
}
.post_type_tutorial_list .tutorial .thumbnail img {
  width: 100%;
  height: auto;
}
.post_type_tutorial_list .tutorial .caption_area {
  background: #1b1b1b;
  color: #fff;
  padding: 15px;
  border: 1px solid #aaa;
  margin-top: -1px;
}
.post_type_tutorial_list .tutorial .label {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  color: #d3b689;
}
.post_type_tutorial_list .tutorial .label em {
  font-weight: 300;
}
.post_type_tutorial_list .tutorial .title {
  font-weight: 300;
  display: block;
  line-height: 1.4em;
  padding-top: 5px;
}
.post_type_tutorial_list .tutorial .title a {
  color: #fff;
  text-decoration: none;
}

.single.tutorial {
  font-size: 14px;
  font-size: 1.4rem;
}
.single.tutorial .ttl02 {
  font-size: 20px;
  font-size: 2rem;
  margin: 50px auto 20px;
  position: relative;
  color: #866c43;
  font-weight: 300 !important;
}
.single.tutorial .ttl02:first-child {
  margin-top: 0;
}
.single.tutorial .ttl03 {
  color: #de8238;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 300 !important;
  position: relative;
  margin: 50px auto 30px;
  padding: 3px 0 0 45px;
  line-height: 30px;
  min-height: 36px;
}
.single.tutorial .ttl03:first-child {
  margin-top: 0;
}
.single.tutorial .ttl03.num1::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "1";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num2::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "2";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num3::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "3";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num4::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "4";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num5::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "5";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num6::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "6";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num7::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "7";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num8::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "8";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num9::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "9";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num10::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "10";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num11::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "11";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num12::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "12";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num13::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "13";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num14::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "14";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num15::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "15";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num16::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "16";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num17::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "17";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num18::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "18";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num19::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "19";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.single.tutorial .ttl03.num20::before {
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  content: "20";
  text-align: center;
  width: 36px;
  height: 36px;
  line-height: 36px;
  vertical-align: top;
  background: url(../img/ico/bg_num01.png) no-repeat;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}

.tutorial_header01 {
  color: #1b1b1b;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 30px;
  border-bottom: 1px solid #aaa;
  margin-bottom: 30px;
  padding-bottom: 18px;
}
.tutorial_header01 .label {
  display: block;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 20px;
  color: #817f7f;
}

.tutorial_section {
  overflow: hidden;
  margin: 0;
}
.tutorial_section + .tutorial_section {
  margin-top: 50px;
  border-top: 1px dotted #aaa;
}
@media only screen and (max-width: 767px) {
  .tutorial_section + .tutorial_section {
    margin-top: 30px;
  }
}

/* カスタム投稿タイプ共通 */
article.single {
  max-width: 980px;
  margin: 0 auto;
}
article.single h1, article.single h2, article.single h3, article.single h4, article.single h5, article.single h6 {
  font-weight: 700;
}
article.single .body {
  overflow: hidden;
}

.main_header01 {
  max-width: 980px;
  min-height: 75px;
  margin: 40px auto 60px;
  padding: 15px 0 0;
  font-weight: 800;
  text-align: right;
  position: relative;
}
@media only screen and (max-width: 979px) {
  .main_header01 {
    margin: 15px auto 30px;
    padding: 0 15px;
  }
}
.main_header01 .logo a {
  width: 390px;
  height: 0;
  padding: 60px 0 0;
  overflow: hidden;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/bg/main_header01.jpg) no-repeat left top;
  font-size: 0;
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .main_header01 .logo a {
    width: 325px;
    padding: 50px 0 0;
    background-size: auto 50px;
    left: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .main_header01 .logo a {
    width: 260px;
    padding: 40px 0 0;
    background-size: auto 40px;
    left: 15px;
  }
}
.main_header01 .title01 {
  font-size: 14px;
  font-size: 1.4rem;
  color: #555;
}
.main_header01 .title01 strong {
  font-weight: 700;
  color: #222;
}
@media only screen and (max-width: 979px) {
  .main_header01 .title01 {
    display: none;
  }
}
.main_header01 .title02 {
  margin-top: 10px;
  font-size: 30px;
  font-size: 3rem;
  color: #222;
  font-weight: 700;
}
@media only screen and (max-width: 979px) {
  .main_header01 .title02 {
    font-size: 20px;
    font-size: 2rem;
    margin: 0;
    padding: 65px 0 0;
    text-align: center;
  }
}

.main_header02 {
  max-width: 980px;
  border-top: 1px solid #000;
  margin: 30px auto 40px;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .main_header02 {
    margin-bottom: 30px;
  }
}
.main_header02 .title01 {
  color: #111;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 700;
  padding: 50px 0 0;
}
@media only screen and (max-width: 767px) {
  .main_header02 .title01 {
    font-size: 20px;
    font-size: 2rem;
    padding-top: 30px;
  }
}
.main_header02 .title01 em {
  display: block;
  color: #de8238;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 900;
}

.sub_header01 {
  background: #f5f0e3;
  padding: 25px;
  margin: 40px auto 30px;
  border-top: 1px solid #bbb;
  border-bottom: 1px dotted #c7b581;
  overflow: hidden;
  /* 機能の場合はアイコンを表示 */
  /* 出力サンプルの場合はパース製作者を表示 */
}
@media only screen and (max-width: 767px) {
  .sub_header01 {
    padding: 10px;
    margin: 20px auto 15px;
  }
}
.sub_header01 .title {
  float: left;
  font-size: 25px;
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 36px;
}
@media only screen and (max-width: 767px) {
  .sub_header01 .title {
    float: none;
    font-size: 20px;
    font-size: 2rem;
  }
}
.sub_header01 .product_icon {
  float: right;
  text-align: right;
  line-height: 1;
}
.sub_header01 .product_icon li {
  display: inline-block;
}
.sub_header01 .product_icon li + li {
  margin-left: 5px;
}
.sub_header01 .product_icon a {
  display: block;
  width: 36px;
  height: 0;
  padding: 36px 0 0;
  overflow: hidden;
  background-size: 100% !important;
  font-size: 0;
}
@media only screen and (max-width: 767px) {
  .sub_header01 .product_icon a {
    width: 24px;
    padding: 24px 0 0;
  }
}
.sub_header01 .product_icon a[href*="pro9"] {
  background: url(../img/ico/ico_md.png) no-repeat;
}
.sub_header01 .product_icon a[href*="pro9ex"] {
  background: url(../img/ico/ico_mdex.png) no-repeat;
}
.sub_header01 .product_icon a[href*="neo3"] {
  background: url(../img/ico/ico_id.png) no-repeat;
}
.sub_header01 .product_icon a[href*="reform-designer"] {
  background: url(../img/ico/ico_rd.png) no-repeat;
}
.sub_header01 .perspective_author {
  overflow: hidden;
  border-left: 1px solid #bbb;
  padding-left: 20px;
}
@media only screen and (max-width: 979px) {
  .sub_header01 .perspective_author {
    border-left-style: none;
    padding: 10px 0 0 0;
  }
}
.sub_header01 .perspective_author dt {
  display: block;
  text-align: left;
}
.sub_header01 .perspective_author dd.thumbnail {
  float: right;
}
.sub_header01 .perspective_author dd.name {
  overflow: hidden;
}

.sub_title01, ._uni_ttl_style07, .single-function .body h3 {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 700;
  border-bottom: 1px solid #bbb;
  padding: 5px 0 15px 20px;
  margin: 0 auto 20px;
  position: relative;
  line-height: 1.4em;
}
.sub_title01:before, ._uni_ttl_style07:before, .single-function .body h3:before {
  content: "";
  display: block;
  width: 5px;
  height: 70%;
  background: #011287;
  position: absolute;
  left: 0;
  top: 5px;
}

/* 製品購入リンク */
.product_purchace_list {
  max-width: 980px;
  margin: 60px auto;
  line-height: 100%;
}
@media only screen and (max-width: 767px) {
  .product_purchace_list {
    margin: 30px auto;
  }
}
@media only screen and (min-width: 980px) {
  .product_purchace_list .row, .product_purchace_list .function_list_general .function ul, .function_list_general .function .product_purchace_list ul,
  .product_purchace_list .function_list_general .function ol,
  .function_list_general .function .product_purchace_list ol, .product_purchace_list .single.interview .ba, .single.interview .product_purchace_list .ba {
    margin-right: -30px;
  }
}
@media only screen and (max-width: 767px) {
  .product_purchace_list .row, .product_purchace_list .function_list_general .function ul, .function_list_general .function .product_purchace_list ul,
  .product_purchace_list .function_list_general .function ol,
  .function_list_general .function .product_purchace_list ol, .product_purchace_list .single.interview .ba, .single.interview .product_purchace_list .ba {
    padding: 0 10px;
    margin-top: -15px;
    margin-right: 0;
  }
}
.product_purchace_list .product {
  text-align: center;
  background: #f3f3f3;
  padding: 20px;
  border: 1px solid #bbb;
  border-top-color: #011287;
}
@media only screen and (min-width: 980px) {
  .product_purchace_list .product {
    width: 224px;
    margin: 0 28px 0 0;
  }
}
@media only screen and (max-width: 979px) {
  .product_purchace_list .product {
    padding: 15px;
    margin-top: 15px;
  }
}
.product_purchace_list .product .thumbnail {
  display: block;
  padding: 15px 30px;
  background: #fff;
}
@media only screen and (max-width: 979px) {
  .product_purchace_list .product .thumbnail {
    padding: 5px 15px;
    width: 33%;
    float: left;
    margin-right: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .product_purchace_list .product .thumbnail {
    width: 33%;
  }
}
.product_purchace_list .product .name {
  font-weight: 800;
  line-height: 140%;
  margin: 15px auto;
}
@media only screen and (max-width: 979px) {
  .product_purchace_list .product .name {
    margin-top: 0;
  }
}
.product_purchace_list .product .link li + li {
  margin-top: 10px;
}
.product_purchace_list .product .btn {
  display: block;
  margin: 0;
  padding: 12px 0;
  width: 100%;
}
@media only screen and (max-width: 979px) {
  .product_purchace_list .product .btn {
    width: auto;
  }
}
.product_purchace_list .product .btn .fa-caret-right {
  position: absolute;
  right: 10px;
  top: 12px;
}
@media only screen and (max-width: 979px) {
  .product_purchace_list .product .btn .fa-caret-right {
    display: none;
  }
}

.footer_product_purchace {
  margin: 30px auto;
  padding: 20px;
  border: 1px solid #bbb;
  border-top-color: #011287;
  overflow: hidden;
  background: #f3f4f6;
}
.footer_product_purchace .purchace_title {
  color: #011287;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 400;
}
.footer_product_purchace .purchace_content {
  overflow: hidden;
  margin-top: 30px;
}
.footer_product_purchace .thumbnail {
  width: 25%;
  display: block;
  float: left;
  margin-right: 30px;
  padding: 20px 30px;
  background: #fff;
}
@media only screen and (max-width: 767px) {
  .footer_product_purchace .thumbnail {
    padding: 10px 15px;
  }
}
.footer_product_purchace .text_area {
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .footer_product_purchace .text_area {
    overflow: visible !important;
  }
}
.footer_product_purchace .name {
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
  .footer_product_purchace .name {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .footer_product_purchace .description {
    overflow: hidden;
  }
}
.footer_product_purchace .description ul li {
  list-style-type: disc;
  margin-left: 1.25em;
}
.footer_product_purchace .link {
  margin-top: 15px;
}
.footer_product_purchace .link ul {
  overflow: hidden;
}
.footer_product_purchace .link li {
  width: 45%;
  float: left;
  margin-right: 15px;
}
@media only screen and (max-width: 767px) {
  .footer_product_purchace .link li {
    width: 48%;
    margin: 0;
  }
  .footer_product_purchace .link li + li {
    float: right;
  }
}
.footer_product_purchace .link li a {
  display: block;
  padding: 10px 30px;
}
.footer_product_purchace .link li a .fa-caret-right {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -0.5em;
}

/* 新着情報 */
.post_list li + li {
  margin-top: 20px;
}
.post_list li a {
  display: block;
  overflow: hidden;
  text-decoration: none;
  color: #222;
  position: relative;
  border: 1px solid #ddd;
  position: relative;
  padding: 20px 30px 0 0;
  overflow: hidden;
}
.post_list li a:after {
  font-family: FontAwesome;
  font-weight: normal !important;
  color: #999;
  content: "\f105";
  font-size: 25px;
  position: absolute;
  top: 50%;
  left: 96%;
  margin-top: -13px;
}
@media only screen and (max-width: 767px) {
  .post_list li a {
    padding: 15px 20px 0 0;
  }
}
.post_list li a .thumbnail {
  max-width: 225px;
  display: block;
  float: left;
  margin: -20px 30px 0 0;
}
@media only screen and (max-width: 767px) {
  .post_list li a .thumbnail {
    width: 35%;
    margin: -15px 15px 0 0;
  }
}
.post_list li a .heading {
  margin-bottom: 10px;
  font-size: 18px;
  font-size: 1.8rem;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .post_list li a .heading {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 120%;
  }
}
.post_list li a .excerpt {
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .post_list li a .excerpt {
    display: none;
  }
}

.support_link li + li {
  margin-top: -1px;
}
.support_link li a {
  display: block;
  overflow: hidden;
  text-decoration: none;
  color: #222;
  position: relative;
  border: 1px solid #ddd;
  position: relative;
  padding: 15px 30px 15px 65px;
  line-height: 160%;
}
.support_link li a:after {
  font-family: FontAwesome;
  font-weight: normal !important;
  color: #999;
  content: "\f105";
  font-size: 25px;
  position: absolute;
  top: 50%;
  left: 96%;
  margin-top: -13px;
}
@media only screen and (min-width: 980px) {
  .support_link li a:after {
    left: 93%;
  }
}
.support_link li a strong {
  display: block;
  font-weight: 700;
  font-size: 16px;
  font-size: 1.6rem;
}
.support_link li.download a {
  background: url(../../img/index/support_ico02.png) no-repeat 15px center;
}
.support_link li.supportInfo a {
  background: url(../../img/index/support_ico03.png) no-repeat 18px center;
}
.support_link li.user a {
  background: url(../../img/index/support_ico04.png) no-repeat 18px center;
}

.post .body {
  clear: both;
  overflow: hidden;
}
.post .body p {
  margin-bottom: 1.8em;
}
.post .date {
  display: block;
  text-align: right;
  margin: 20px 0;
}
.post .alignleft,
.post .img_area.left {
  float: left;
  margin-right: 30px;
  max-width: 47%;
}
@media only screen and (max-width: 767px) {
  .post .alignleft,
  .post .img_area.left {
    width: auto;
    float: none;
    margin: 0 0 10px;
    text-align: center;
  }
}
.post .alignright,
.post .img_area.right {
  float: right;
  margin-left: 30px;
  max-width: 47%;
}
@media only screen and (max-width: 767px) {
  .post .alignright,
  .post .img_area.right {
    width: auto;
    float: none;
    margin: 0 0 10px;
    text-align: center;
  }
}
.post .text_area {
  overflow: hidden;
}

.dropdown {
  text-align: right;
  margin: 25px auto;
}
.dropdown > * {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

/* プライバシーポリシー */
#privacy {
  margin: 20px 0;
}
#privacy ol {
  padding-left: 25px;
}

/* 404 notfound */
#notfound .body {
  padding: 0 30px 30px;
}
#notfound .btn {
  margin-top: 30px;
}

/*----------------------------------------------------
	form要素
--------------------------------------------------- */
input, textarea {
  padding: 5px 7px;
  border-radius: 2px;
  margin: 0;
  border: none;
  background-color: #fff;
  border: 1px solid #A7A6AA;
}

.jInput {
  border: 1px solid #A7A6AA;
}

.jFocus {
  outline: medium none !important;
  background-color: #fff !important;
  border-color: #6ddeff !important;
}

.jFocus {
  box-shadow: 0 0 3px rgba(82, 168, 236, 0.5);
  -webkit-box-shadow: 0 0 3px rgba(82, 168, 236, 0.5);
  -moz-box-shadow: 0 0 3px rgba(82, 168, 236, 0.5);
  -ms-box-shadow: 0 0 3px rgba(82, 168, 236, 0.5);
  -o-box-shadow: 0 0 3px rgba(82, 168, 236, 0.5);
  border-color: rgba(82, 168, 236, 0.75) !important;
}

input[type="radio"], input[type="checkbox"] {
  margin-right: 5px;
  vertical-align: baseline;
  border-style: none;
}

label {
  margin-right: 15px;
}

/*----------------------------------------------------
	ページ分割ナビ
--------------------------------------------------- */
#main .wp-pagenavi {
  margin: 60px auto;
  text-align: center;
  overflow: hidden;
}
#main .wp-pagenavi a, #main .wp-pagenavi span {
  padding: 3px 12px;
  background: #fff;
  color: #222;
  margin-right: 5px;
  text-decoration: none;
  border: 1px solid #bbb;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
#main .wp-pagenavi a:hover,
#main .wp-pagenavi .current {
  background: #242a9c;
  color: #fff;
}
#main .wp-pagenavi .pages {
  margin-right: 20px;
}
#main .wp-pagenavi .alignleft {
  margin-top: 0;
  margin-bottom: 0;
  float: none;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
#main .wp-pagenavi .center {
  margin-top: 0;
  margin-bottom: 0;
  float: none;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
#main .wp-pagenavi .alignright {
  margin-top: 0;
  margin-bottom: 0;
  float: none;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

/********************************************************
追記スタイル
********************************************************/
.borderbox {
  border: solid 1px #E8E8E8;
  padding: 15px;
}

.single-function #main .row img, .single-function #main .function_list_general .function ul img, .function_list_general .function .single-function #main ul img,
.single-function #main .function_list_general .function ol img,
.function_list_general .function .single-function #main ol img, .single-function #main .single.interview .ba img, .single.interview .single-function #main .ba img {
  margin-bottom: 5px;
}

.graybox {
  font-size: 84%;
  background-color: #f9f9f9;
  padding: 18px 24px 22px;
  line-height: 180%;
}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  overflow: hidden;
}

#cboxWrapper {
  max-width: none;
}

#cboxOverlay {
  position: fixed;
  width: 100%;
  height: 100%;
}

#cboxMiddleLeft, #cboxBottomLeft {
  clear: left;
}

#cboxContent {
  position: relative;
}

#cboxLoadedContent {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

#cboxTitle {
  margin: 0;
}

#cboxLoadingOverlay, #cboxLoadingGraphic {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
  cursor: pointer;
}

.cboxPhoto {
  float: left;
  margin: auto;
  border: 0;
  display: block;
  max-width: none;
  -ms-interpolation-mode: bicubic;
}

.cboxIframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
  padding: 0;
  margin: 0;
}

#colorbox, #cboxContent, #cboxLoadedContent {
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay {
  background: #000;
  opacity: 0.6;
  filter: alpha(opacity=60);
}

#colorbox {
  outline: 0;
}

#cboxContent {
  margin-top: 20px;
  padding: 20px;
}

.cboxIframe {
  background: #fff;
}

#cboxError {
  padding: 50px;
  border: 1px solid #ccc;
}

#cboxLoadedContent {
  background: #fff;
  padding: 20px;
  border-radius: 3px;
}

#cboxTitle {
  position: absolute;
  top: -20px;
  left: 0;
  color: #ccc;
}

#cboxCurrent {
  display: none;
}

/*#cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}*/
#cboxLoadingGraphic {
  background: url(images/loading.gif) no-repeat center center;
}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
  border: 0;
  padding: 0;
  margin: 0;
  overflow: visible;
  width: auto;
  background: none;
}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {
  outline: 0;
}

#cboxSlideshow {
  position: absolute;
  top: -20px;
  right: 90px;
  color: #fff;
}

#cboxPrevious,
#cboxNext {
  position: absolute;
  top: 50%;
  margin-top: -20px;
  width: 40px;
  height: 40px;
  text-align: center;
  border: 1px solid #fff;
  border-radius: 20px;
  background: #000;
  color: #fff;
  text-indent: -9999px;
}
#cboxPrevious::after,
#cboxNext::after {
  display: block;
  font-family: FontAwesome;
  font-weight: normal !important;
  text-indent: 0;
  font-size: 24px;
  line-height: 38px;
  text-align: center;
  position: absolute;
  top: 0;
}

#cboxPrevious {
  left: 0;
}
#cboxPrevious::after {
  content: "\f104";
  left: 14px;
}

#cboxNext {
  right: 0;
}
#cboxNext::after {
  content: "\f105";
  right: 14px;
}

#cboxClose {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  background: #000 url(../img/ico/ico_close01.png) no-repeat center center;
  width: 40px;
  height: 40px;
  text-indent: -9999px;
  cursor: pointer;
}
.page-pro9ex #cboxClose, .page-pro9ex-child #cboxClose {
  /* PRO9EX */
  background-color: #307bd1;
}
.page-neo3 #cboxClose, .page-neo3-child #cboxClose {
  /* Neo3 */
  background-color: #830008;
}
.page-reform-designer2 #cboxClose, .page-reform-designer2-child #cboxClose {
  /* リフォームデザイナー */
  background-color: #CF7119;
}
.page-pro9 #cboxClose, .page-pro9-child #cboxClose {
  /* PRO9 */
  background-color: #830008;
}

@media (max-width: 767px) {
  #cboxClose {
    width: 30px;
    height: 30px;
    background-size: contain;
  }
}
/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */
/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
  outline: none;
}

.slides,
.flex-control-nav,
.flex-direction-nav {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Icon Fonts
*********************************/
/* Font-face Icons */
@font-face {
  font-family: 'flexslider-icon';
  src: url("fonts/flexslider-icon.eot");
  src: url("fonts/flexslider-icon.eot?#iefix") format("embedded-opentype"), url("fonts/flexslider-icon.woff") format("woff"), url("fonts/flexslider-icon.ttf") format("truetype"), url("fonts/flexslider-icon.svg#flexslider-icon") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* FlexSlider Necessary Styles
*********************************/
.flexslider {
  margin: 0;
  padding: 0;
}

.flexslider .slides > li {
  display: none;
  -webkit-backface-visibility: hidden;
}

/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {
  width: 100%;
  display: block;
}

.flex-pauseplay span {
  text-transform: capitalize;
}

/* Clearfix for the .slides element */
.slides:after {
  content: "\0020";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

html[xmlns] .slides {
  display: block;
}

* html .slides {
  height: 1%;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
  display: block;
}

/* FlexSlider Default Theme
*********************************/
.flexslider {
  margin: 0;
  position: relative;
  zoom: 1;
}

.flex-viewport {
  max-height: 2000px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.loading .flex-viewport {
  max-height: 300px;
}

.flexslider .slides {
  zoom: 1;
}

.carousel li {
  margin-right: 5px;
}

/* Direction Nav */
.flex-direction-nav {
  *height: 0;
}

.flex-direction-nav a {
  text-decoration: none;
  text-indent: -9999px;
  display: block;
  width: 30px;
  height: 30px;
  margin: -15px 0 0;
  position: absolute;
  top: 50%;
  z-index: 10;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  transition: all .3s ease;
}

.flex-direction-nav .flex-prev {
  left: 0;
}

.flex-direction-nav .flex-next {
  right: 0;
}

.flex-direction-nav .flex-disabled {
  cursor: default;
}

/* Pause/Play */
.flex-pauseplay a {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  bottom: 5px;
  left: 10px;
  opacity: 0.8;
  z-index: 10;
  overflow: hidden;
  cursor: pointer;
  color: #000;
}

.flex-pauseplay a:before {
  font-family: "flexslider-icon";
  font-size: 20px;
  display: inline-block;
  content: '\f004';
}

.flex-pauseplay a:hover {
  opacity: 1;
}

.flex-pauseplay a.flex-play:before {
  content: '\f003';
}

/* Control Nav */
.flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: -40px;
  text-align: center;
}

.flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.flex-control-paging li a {
  width: 11px;
  height: 11px;
  display: block;
  background: #666;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
  text-indent: -9999px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
}

.flex-control-paging li a:hover {
  background: #333;
  background: rgba(0, 0, 0, 0.7);
}

.flex-control-paging li a.flex-active {
  background: #000;
  background: rgba(0, 0, 0, 0.9);
  cursor: default;
}

.flex-control-thumbs {
  margin: 14px -7px 0;
  position: static;
  overflow: hidden;
}

.flex-control-thumbs li {
  width: 25%;
  float: left;
  margin: 0;
}

.flex-control-thumbs img {
  width: 100%;
  height: auto;
  display: block;
  opacity: .7;
  cursor: pointer;
  padding: 0 7px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.flex-control-thumbs img:hover {
  opacity: 1;
}

.flex-control-thumbs .flex-active {
  opacity: 1;
  cursor: default;
}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev {
    opacity: 1;
    left: 10px;
  }

  .flex-direction-nav .flex-next {
    opacity: 1;
    right: 10px;
  }
}
/*----------------------------------------------------
	for IE 
----------------------------------------------------*/
a.btn:not(:target) {
  padding-top: 12px\9;
  padding-bottom: 8px\9;
}

#series .subTtl01:not(:target) {
  line-height: 1.4\9;
}

#series .seriesNav h2:not(:target) {
  background-position: center 65%;
}

._uni_ttl_style01:not(:target),
.page-guide .guide_header01:not(:target) {
  padding: 32px 15px 18px\9;
}

._uni_ttl_style02:not(:target),
.page-guide .guide_ttl02:not(:target) {
  line-height: 50px\9;
  padding-top: 8px\9;
}

._uni_ttl_style07:not(:target),
.sub_title01:not(:target),
._uni_ttl_style07:not(:target),
.single-function .body h3:not(:target) {
  padding-top: 12px\9;
}

.sub_header01:not(:target) {
  padding-top: 33px\9;
  padding-bottom: 17px\9;
}

.sub_header01 .product_icon:not(:target) {
  margin-top: -8px\9;
}

.single-function .body h3:not(:target) {
  padding-top: 12px !important \9;
}

._uni_numttl_style:not(:target) {
  line-height: 27px\9;
  padding-top: 9px\9;
}

._uni_numttl_style::before:not(:target) {
  line-height: 32px\9;
  padding-top: 4px\9;
}

._ex_guide_step_label01:not(:target), .page-guide .guide_intro01_link li:not(:target)::before, .page-guide .guide_intro01_link li::before:not(:target) {
  padding-top: 4px\9;
}

.product_sub_nav.fixed li.buy a:not(:target) {
  padding-top: 5px\9;
  margin-top: -3px\9;
}

.product_top_function_link li .btn01:not(:target) {
  padding-top: 18px\9;
  padding-bottom: 12px\9;
}

.function_list_new .function .title:not(:target) {
  position: relative\9;
  top: -12px\9;
}

.product_purchace_list .product .btn:not(:target) {
  padding-top: 16px\9;
  padding-bottom: 8px\9;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  a.btn {
    padding-top: 12px;
    padding-bottom: 8px;
  }

  #series .subTtl01 {
    line-height: 1.4;
  }

  #series .seriesNav h2 {
    background-position: center 65%;
  }

  ._uni_ttl_style01,
  .page-guide .guide_header01 {
    padding: 32px 15px 18px;
  }

  ._uni_ttl_style02,
  .page-guide .guide_ttl02 {
    line-height: 50px;
    padding-top: 8px;
  }

  ._uni_ttl_style07,
  .sub_title01,
  ._uni_ttl_style07,
  .single-function .body h3 {
    padding-top: 12px;
  }

  .sub_header01 {
    padding-top: 33px;
    padding-bottom: 17px;
  }

  .sub_header01 .product_icon {
    margin-top: -8px;
  }

  .single-function .body h3 {
    padding-top: 12px !important;
  }

  ._uni_numttl_style {
    line-height: 27px;
    padding-top: 9px;
  }

  ._uni_numttl_style::before {
    line-height: 32px;
    padding-top: 4px;
  }

  ._ex_guide_step_label01, .page-guide .guide_intro01_link li::before, .page-guide .guide_intro01_link li::before {
    padding-top: 4px;
  }

  .product_sub_nav.fixed li.buy a {
    padding-top: 5px;
    margin-top: -3px;
  }

  .product_top_function_link li .btn01 {
    padding-top: 18px;
    padding-bottom: 12px;
  }

  .function_list_new .function .title {
    position: relative;
    top: -8px;
  }

  .product_purchace_list .product .btn {
    padding-top: 16px;
    padding-bottom: 8px;
  }
}

DIV.bana_pro9ex{
	position: relative;
	width: 960px;
	height: 200px;
	background: url("http://www.megasoft.co.jp/3d/wp/wp-content/uploads/2016/07/pro9ex_bc.jpg") no-repeat 0 0;
	margin:1% auto 5%;
}
DIV.bana_pro9ex_sp{
	display:none;
}
DIV.bana_pro9ex P.detail{
	position: absolute;
	top: 110px;
	left: 190px;
}
@media only screen and (max-width: 640px){
DIV.bana_pro9ex_sp{
	display:block;
}
DIV.bana_pro9ex{
	display:none;
}
}
/*----------------------------------------------------
	印刷用スタイル
----------------------------------------------------*/
@media print {
  * html body {
    zoom: .7;
  }
}

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