@charset "utf-8";
/*
Theme Name: Key-point Original
Theme URI: http://www.key-p.com/
Author: キー・ポイント株式会社
Author URI: http://www.key-p.com/
Description: 
Version: 1.5
*/

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}
:focus {/* remember to define focus styles! */
  outline: 0;
}
body {
  background: #fff;
  line-height: 1;
  min-width: 980px;
}
ol, ul {
  list-style: none;
}
table {/* tables still need 'cellspacing="0"' in the markup */
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  font-weight: normal;
  text-align: left;
  vertical-align: middle;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}
blockquote, q {
  quotes: "" "";
}
a img {
  border: 0;
  vertical-align: top;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}


/* =Structure
----------------------------------------------- */

#page {
  margin: 0 auto 40px;
  width: 980px;
}

#page-wf {
  background: url(images/webfile/bg-head-title.gif) no-repeat top center scroll transparent;
}

#secondary {
  float: right;
  margin-right: 7.6%;
  width: 18.8%;
}

/* Singular */
.singular #primary {
	margin: 0;
}

/* Attachments */
.singular .image-attachment .entry-content {
	margin: 0 auto;
	width: auto;
}
.singular .image-attachment .entry-description {
	margin: 0 auto;
	width: 68.9%;
}

/* Showcase */
.page-template-showcase-php #primary,
.left-sidebar.page-template-showcase-php #primary {
	margin: 0;
}
.page-template-showcase-php #content,
.left-sidebar.page-template-showcase-php #content {
	margin: 0 7.6%;
	width: auto;
}
.page-template-showcase-php section.recent-posts {
	float: right;
	margin: 0 0 0 31%;
	width: 69%;
}
.page-template-showcase-php #main .widget-area {
	float: left;
	margin: 0 -22.15% 0 0;
	width: 22.15%;
}

/* error404 */
.error404 #primary {
	float: none;
	margin: 0;
}
.error404 #primary #content {
	margin: 0 7.6%;
	width: auto;
}

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.625em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.625em;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Right Content */
.left-sidebar #primary {
	float: right;
	margin: 0 0 0 -26.4%;
	width: 100%;
}
.left-sidebar #content {
	margin: 0 7.6% 0 34%;
	width: 58.4%;
}
.left-sidebar #secondary {
	float: left;
	margin-left: 7.6%;
	margin-right: 0;
	width: 18.8%;
}

/* One column */
.one-column #page {
	max-width: 980px;
}
.one-column #content {
	margin: 0 7.6%;
	width: auto;
}
.one-column #nav-below {
	border-bottom: 1px solid #ddd;
	margin-bottom: 1.625em;
}
.one-column #secondary {
	float: none;
	margin: 0 7.6%;
	width: auto;
}
/* Simplify the showcase template */
.one-column .page-template-showcase-php section.recent-posts {
	float: none;
	margin: 0;
	width: 100%;
}
.one-column .page-template-showcase-php #main .widget-area {
	float: none;
	margin: 0;
	width: auto;
}
.one-column .page-template-showcase-php .other-recent-posts {
	border-bottom: 1px solid #ddd;
}
/* Simplify the showcase template when small feature */
.one-column section.featured-post .attachment-small-feature {
	border: none;
	display: block;
	height: auto;
	max-width: 60%;
	position: static;
}
.one-column article.feature-image.small {
	margin: 0 0 1.625em;
	padding: 0;
}
.one-column article.feature-image.small .entry-title {
	font-size: 20px;
	line-height: 1.3em;
}
.one-column article.feature-image.small .entry-summary {
	height: 150px;
	overflow: hidden;
	padding: 0;
	text-overflow: ellipsis;
}
.one-column article.feature-image.small .entry-summary a {
	left: -9%;
}
/* Remove the margin on singular articles */
.one-column.singular .entry-header,
.one-column.singular .entry-content,
.one-column.singular footer.entry-meta,
.one-column.singular #comments-title {
	width: 100%;
}
/* Simplify the pullquotes and pull styles */
.one-column.singular blockquote.pull {
	margin: 0 0 1.625em;
}
.one-column.singular .pull.alignleft {
	margin: 0 1.625em 0 0;
}
.one-column.singular .pull.alignright {
	margin: 0 0 0 1.625em;
}
.one-column.singular .entry-meta .edit-link a {
	position: absolute;
	left: 0;
	top: 40px;
}
.one-column.singular #author-info {
	margin: 2.2em -8.8% 0;
	padding: 20px 8.8%;
}
/* Make sure we have room for our comment avatars */
.one-column .commentlist > li.comment {
	margin-left: 102px;
	width: auto;
}
/* Make sure the logo and search form don't collide */
.one-column #branding #searchform {
	right: 40px;
	top: 4em;
}
/* Talking avatars take up too much room at this size */
.one-column .commentlist > li.comment {
	margin-left: 0;
}
.one-column .commentlist > li.comment .comment-meta,
.one-column .commentlist > li.comment .comment-content {
	margin-right: 85px;
}
.one-column .commentlist .avatar {
	background: transparent;
	display: block;
	padding: 0;
	top: 1.625em;
	left: auto;
	right: 1.625em;
}
.one-column .commentlist .children .avatar {
	background: none;
	padding: 0;
	position: absolute;
	top: 2.2em;
	left: 2.2em;
}
.one-column #respond {
	width: auto;
}


/* =Global
----------------------------------------------- */

body, input, textarea {
  color: #373737;
  font-family: "メイリオ","ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  font-size:1.0em;
}

/* Headings */
h1,h2,h3,h4,h5,h6 {
  clear: both;
}

h5{
  font-family: "ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  margin-top:10px;
  margin-bottom:10px;
  font-size:1.3em;
  border-bottom:1px dotted #000000;
  padding:5px;
  font-weight:bold;
}

/* Text elements */
ul { list-style:square inside none; }
ol { list-style-type: decimal; }
ol ol { list-style: upper-alpha; }
ol ol ol { list-style: lower-roman; }
ol ol ol ol { list-style: lower-alpha; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }


/* Forms */
input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=number],
input[type=tel],
textarea {
/*  background: #fafafa;*/
  -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
  box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
  border: 1px solid #ddd;
  color: #888;
}

input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=number]:focus,
input[type=tel]:focus,
textarea:focus { color: #373737; }

textarea {
    padding-left: 3px;
    width: 98%;
}

input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=number],
input[type=tel],
textarea {
  padding: 3px;
  width:85%;
}


/* Links */
a {
  color: #3FA582;
  text-decoration:underline ;
}

a:focus,
a:active,
a:hover {
  text-decoration: none;
}

a.cta_alink {
    color: #333333;
    text-decoration:underline ;
}


/* Assistive text */
.assistive-text {
    position: absolute !important;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
}
#access a.assistive-text:active,
#access a.assistive-text:focus {
	background: #eee;
	border-bottom: 1px solid #ddd;
	color: #1982d1;
	clip: auto !important;
	font-size: 12px;
	position: absolute;
	text-decoration: underline;
	top: 0;
	left: 7.6%;
}

/* 202104 */
/* 共通
----------------------------------------------- */
  #container_wf li { list-style: none!important; }

  .c-bk_light { background-color: #F2FAFE; }

  .c-text_primary { color: #2ca2d8; }
  .c-title_large { font-size: 36px; }
  .c-title_medium { font-size: 28px; }
  .c-title_small { font-size: 20px; }


  .c-inner { margin: 0 auto; }
  .c-inner.large { max-width: 1260px; }
  .c-inner.medium { max-width: 1000px; }
  .c-inner.small { max-width: 780px; }

  .c-flex_col {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;
  }

  .c-reverse {
    flex-direction: row-reverse;
  }

  .c-list_col2 { width: calc(100% / 2); }
  .c-list_col3 { width: calc(100% / 3); }
  .c-list_col4 { width: calc(100% / 4); }

  .c-top_card {
      border: 1px solid #FFFFFF;
      border-radius: 6px;
      text-align: center;
      box-sizing: border-box;
  }

  .c-top_card_title {
      font-weight: bold;
      font-size: 16px;
      text-align: center;
  }

  .c-top_card_body {
      color: #585858;
      text-align: left;
      line-height: 1.5;
      margin-bottom: 30px;
  }

  .c-top_table {
    border-collapse: collapse;
    width: 100%;
  }

  .c-top_table td {
    color: #222222;
  }

  .c-space40 { padding: 40px 0; }
  .c-space80 { padding: 80px 0; }
  .c-space100 { padding: 100px 0; }


/* ボタン
----------------------------------------------- */
  .btn_main {
    display: inline-block;
    text-align: center;
  }

  .btn_top:hover {
    opacity: 0.6;
    cursor: pointer;
  }
  .cta-area {
      text-align: center;
      margin: 0 auto;
    /* display: flex; */
    /* align-items: center; */
    /* justify-content: center; */
  }
  .btn_top {
    box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.1);
    text-decoration: none;
    width: 300px;
    border-radius: 10px;
    letter-spacing: 0.1rem;
    display: table;
    background-color: #000;
    text-align: center;
    margin: 0 auto;
  }

  .btn_top.top {
      height: 70px;
      width: 360px;
  }

  .btn_top.cta {
    height: 100px;
    box-shadow: 0 3px 6px rgba(112, 112, 112, 0.4);
  }

  .btn_top.white {
    color: #2ca2d8;
    background-color: #FFFFFF;
    border:2px solid #2ca2d8;
  }
  .btn_top div.middle {
    display: table-cell;
    vertical-align: middle;
  }
  .btn_top.key {
    color: #FFFFFF;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eb82a1+0,ea6b8f+100 */
    background: #eb82a1; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #eb82a1 0%, #ea6b8f 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #eb82a1 0%,#ea6b8f 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #eb82a1 0%,#ea6b8f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eb82a1', endColorstr='#ea6b8f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    border: 2px solid #eb82a1;
  }

    .btn_top.outline {
    color: #ea6b8f;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eb82a1+0,ea6b8f+100 */
    background: #FFFFFF; /* Old browsers */
    border: 2px solid #eb82a1;
  }

    .btn_content {
        width: 360px;
    }

    .ico_arrow {
        position: relative;
        right: 20px;
        top: 39%;
        display: block;
    }

    .btn_wrap_small {
    display: inline-block;
  }

  .btn_top_small {
    background-color: #2ca2d8;
    border: 1px solid #2ca2d8;
    border-radius: 30px;
    color: #FFFFFF;
    font-weight: bold;
    width: 180px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
  }

  .btn_top_small:hover {
    opacity: 0.6;
  }


/* ヘッダー
----------------------------------------------- */

#branding {
  position: relative;
  z-index: 9999;
  background:url(images/webfile/bg-head-top.gif) repeat-x top left #FFFFFF;
}

#branding hgroup {
  width:980px;
  margin:0 auto;
}

p.sub-title{
  padding-top:30px;
  padding-bottom:10px;
  padding-left:12px;
  font-size:80%;
  color:#464646;
}

#site-title-wf {
  width:212px;
  height:53px;
  background:url(images/webfile/logo.gif) no-repeat top left;
  text-indent:-9999px;
  margin-bottom:35px;
  float:left;
}

#site-title-wf a {
  color: #111;
  font-size: 30px;
  text-decoration: none;
  display:block;
  width:189px;
  height:62px;
}

.top-link{
  margin-top:10px;
}

#branding img{
  margin-left:-5px;
}

.top-link ul{ list-style:none; }

.top-link li{
  float:left;
  padding-left:18px;
  margin-right:15px;
  font-size:80%;
}

.top-link li a{ color:#838383; }
.top-link li a:hover{ color:#000000; }

li.access{ background:url(images/ico-access.gif) no-repeat top left; }
li.sitemap{ background:url(images/ico-sitemap.gif) no-repeat top left; }
li.privacy{
  background:url(images/ico-privacy.gif) no-repeat top left;
  margin:0px;
}

/* 検索フォーム */
.header-right-area{
  float:right;
}

#searchform {
  text-align: right;
}

#s {
  -webkit-transition-duration: 400ms;
  -webkit-transition-property: width, background;
  -webkit-transition-timing-function: ease;
  -moz-transition-duration: 400ms;
  -moz-transition-property: width, background;
  -moz-transition-timing-function: ease;
  -o-transition-duration: 400ms;
  -o-transition-property: width, background;
  -o-transition-timing-function: ease;
  width: 225px;
  height:17px;
  background-color: #FFFFFF;
}

#s:focus {
  background-color: #F9F9F9;
  width: 225px;
}

#searchsubmit {
  float:right;
  border: 0px;
  width: 86px;
  height: 26px;
  background: url(images/btn-search.gif) left top no-repeat;
  margin-left:5px;
  cursor: pointer;
}

.only-search #searchform {
  top: 5px;
  z-index: 1;
}

/* メニュー
-------------------------------------------------------------- */

#access ul {
  width:100%;
  list-style:none;
}

.access{ height:50px;}

#access li {
  float: left;
  position: relative;
  border-left:1px solid #DDDDDD;
  padding:5px 18px;
}

#access li a{
  display:block;
  color:#000000;
  font-size:0.9em;
  text-decoration: none;
}

#access a:focus,
#access a:active,
#access a:hover {
  text-decoration: underline;
}


/* 202104 */
/* header
 * -------------------------------------------------------------- */
#top_header {
  width: 95%;
  height: 100px;
  margin: 0 auto;
}

#top_header nav ul {
  display: flex;
}

#top_header nav ul li a {
  color: #222222;
  text-decoration: none;
  font-weight: bold;
  margin-left: 20px;
}

#top_header nav ul li a:hover {
  opacity: 0.6;
}

/* レスポンシブ */
.set_800,input#webfilenav,.set_320 { display: none; }


/* 一時的なニュース
 * -------------------------------------------------------------- */
.topic-temporary{
        font-size: 1.2em;
        text-align: center;
        padding: 20px 30px;
}

.topic-temporary > a {
        border: 2px solid #F19D1D;
        padding: 10px 30px;
        color: #F19D1D;
}

/* アイキャッチ内
-------------------------------------------------------------- */

.eye-catch{
  background: url(images/webfile/bg-eye.gif) repeat-x scroll top center;
  padding-top:25px;
  padding-bottom:12px;
}

.main-eye{
  background: url(images/webfile/img-top-eye.png) no-repeat scroll top left;
  background-size: contain;
  width:900px;
  height:150px;
  margin: 0 auto;
  text-indent:-9999px;
}

.eye-nav ul{ list-style:none;}
.eye-nav ul li{
  float:left;
  text-indent:-9999px;
}

.eye-nav ul li a{
  display:block;
  /* height:353px; */
  /* 以下テスト用に変更 */
  height: 280px;
  margin: 20px 10px 20px 0;
  box-shadow: 5px 5px 6px rgba(0,0,0,0.2);
  border-radius: 6px;
}

.eye-nav ul li a:hover {
	box-shadow: none;
	transition: 0.3s;
	opacity: 0.7;
}

.eye-nav ul li.send a{
  /* background: url(images/webfile/btn-naveye-send.png) no-repeat scroll top left;
  width:197px; */
  background: url(images/webfile/btn-naveye-send-2.png) no-repeat scroll top left;
  width: 183px;
}

.eye-nav ul li.collect a{
  /* background: url(images/webfile/btn-naveye-collect.png) no-repeat scroll top left;
  width:195px; */
  background: url(images/webfile/btn-naveye-collect-2.png) no-repeat scroll top left;
  width: 183px;
}

.eye-nav ul li.share a{
  /* background: url(images/webfile/btn-naveye-share.png) no-repeat scroll top left;
  width:195px; */
  background: url(images/webfile/btn-naveye-share-2.png) no-repeat scroll top left;
  width: 183px;
}

.eye-nav ul li.admin a{
  /* background: url(images/webfile/btn-naveye-admin.png) no-repeat scroll top left;
  width:195px; */
  background: url(images/webfile/btn-naveye-admin-2.png) no-repeat scroll top left;
  width: 183px;
}

.eye-nav ul li.security a{
  /* background: url(images/webfile/btn-naveye-security.png) no-repeat scroll top left;
  width:195px; */
  background: url(images/webfile/btn-naveye-security-2.png) no-repeat scroll top left;
  width: 183px;
}

/* 202104 */
/* メイン
----------------------------------------------- */
.wf_main_title {
  font-size: 56px;
  margin: 10px 0 50px;
}

.wrap_main {
  background: url(images/webfile/bk_main_blue.svg)no-repeat right;
  background-size: contain;
}

#wf_main {
  padding: 70px 0 140px;
}

#wf_main h2 {
  color: #222222;
  text-shadow: 1px 1px 3px #cccccc;
  line-height: 3rem;
}


/* トップトピック
----------------------------------------------- */

.top-topic-area{
  margin-top: 20px;
  width: 700px;
}

.topic{
  background: url(images/webfile/bg-top-topic.gif) no-repeat scroll top left;
/*  width:957px;*/
  width:700px;
  height:151px;
  font-family: "ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
}

.topic-title{
/*  font-size:1.2em;*/
  font-weight:bold;
  color:#535353;
  margin-bottom:10px;
/*  width:680px;*/
  width:430px;
  padding: 38px 0 0 87px;
}

.topic-com-1{
/*  width:520px;*/
  width:310px;
  color:#6D6D6D;
  line-height:140%;
  font-size:0.9em;
  background:url(images/webfile/img-topic1.gif) no-repeat scroll top left;
  padding-left:125px;
  margin-left:87px;
  height:70px;
}

.topic-com-2{
/*  width:520px;*/
  width:310px;
  color:#6D6D6D;
  line-height:140%;
  font-size:0.9em;
  background:url(images/webfile/img-topic2.gif) no-repeat scroll top left;
  padding-left:125px;
  margin-left:87px;
  height:70px;
}

.topic-com-3{
  /*  width:520px;*/
  width:310px;
  color:#6D6D6D;
  line-height:140%;
  font-size:0.9em;
  background:url(images/webfile/img-topic3.gif) no-repeat scroll top left;
  padding-left:125px;
  margin-left:87px;
  height:70px;
}

.topic-link{
  float:right;
  padding-top: 19px;
}

.topic-link a{
  display:block;
  background: url(images/webfile/btn-topic.gif) no-repeat scroll bottom right;
  width:162px;
  height:132px;
  text-indent:-9999px;
}

/* 202104変更 */
/* WebFileとは
----------------------------------------------- */
  #wf_about {
    background: url(images/webfile/bk_about.png)no-repeat;
    background-size: cover;
  }

  .wf_about_title {
    font-size: 22px;
    line-height: 1.6;
    margin-bottom: 10px;
  }

  .wf_about_body {
    line-height: 2;
    width: 85%;
  }

  #wf_about .c-flex_col {
    justify-content: center;
  }


/* ポイント
----------------------------------------------- */
  #wf_point .c-flex_col:not(:last-child) {
    padding-bottom: 100px;
   }

  .c-top_card.point_lead {
    border: none;
  }

  .top_point h4 {
    background-color: inherit;
    border-bottom: none;
    padding: 0;
    margin-bottom: 15px;
  }

  .point_number {
    color: #FFFFFF;
    background-color: #2ca2d8;
    border-radius: 20px;
    width: 100px;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
  }

  .point_link {
    color: #222222;
    font-weight: bold;
    border-bottom: 3px solid #2ca2d8;
    text-decoration: none;
    padding-bottom: 5px;
    margin-right: 20px;
    display: inline-block;
  }

  .point_link:hover {
    padding-bottom: 1px;
    opacity: 0.6;
    transition: 0.3s;
  }

  .img_point {
    box-shadow: 3px 3px 10px rgba(0, 152, 221, 0.3);
    border-radius: 10px;
  }


  .top_point.c-flex_col {
    align-items: flex-start;
  }

/* 例えばこんな使い方
----------------------------------------------- */
  #wf_sample .c-list_col3 {
    width: 320px;
  }
  
  #wf_sample .c-list_col3::before {
    content: "";
    display: inline-block;
    width: 50px;
    height: 7px;
    background: #2CA2D8;
    border-radius: 4px;
    margin-bottom: 30px;
  }


/* CTA
----------------------------------------------- */
  .top_cta {
    background: url(images/webfile/bk_cta.svg)no-repeat;
    background-size: cover;
    padding: 70px 0;
    text-align: center;
    color: #FFFFFF;
  }

  .inner_top_cta {
    max-width: 650px;
    margin: 0 auto;
  }

  .top_cta .c-title_large,
  .top_cta .c-title_small {
    margin-bottom: 20px;
  }

/* TOP価格表
----------------------------------------------- */
  .c-top_table.price .Ptable_thead {
    width: 260px;
    padding: 40px 0;
    color: #FFFFFF;
    font-weight: bold;
  }

  .Ptable_thead:nth-of-type(2) {
    background-color: #8CD0F0;
  }

  .Ptable_thead:nth-of-type(3) {
    background-color: #73C6EC;
  }

  .Ptable_thead:nth-of-type(4) {
    background-color: #40B2E5;
  }

  .c-top_table.price {
    position: relative;
    margin-top: 70px;
  }

  .c-top_table.price::before {
    content: "";
    display: block;
    background: url(images/webfile/img_price_point.svg)no-repeat center;
    position: absolute;
    right: 0;
    top: -45px;
    width: 260px;
    height: 40px;
  }

  .Ptable_col:nth-child(2n+1) {
    background-color: #F8F8F8;
  }

  .Ptable_col td {
    text-align: center;
  }

  .Ptable_col td:nth-child(1) {
    background-color: #F8F8F8;
    text-align: left;
  }

  .Ptable_col:nth-child(2n+1) td:nth-child(1) {
    background-color: #DDDDDD;
  }

  .Ptable_col.base td {
    height: 70px;
    font-size: 22px;
  }

  .Ptable_col.opt td {
  height: 50px;
  font-size: 18px;
  }

  .first_price {
    display: inline-block;
    background-color: #F2FAFE;
    border: 1px solid #F2FAFE;
    border-radius: 6px;
    width: 90%;
    padding: 15px;
  }


/* TOP導入事例
----------------------------------------------- */
  #wf_case .c-top_card {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
    padding: 20px;
    background: #FFFFFF;
    width: 300px;
    height: 300px;
    text-decoration: none;
    color: #222222;
  }

  #wf_case .c-top_card:hover {
    box-shadow: none;
  }


/* TOPLiteについて
----------------------------------------------- */
  .inner_lite {
    border: 3px solid #2ca2d8;
    border-radius: 6px;
    text-align: center;
    padding: 30px;
    line-height: 1.2;
  }

  .c-top_table.Litetable {
    margin: 20px 0;
  }
  
  .c-top_table.Litetable tr td {
    padding: 20px;
  }  

  .c-top_table.Litetable tr:first-child {
    border-bottom: 1px dotted #707070;
  }

  .c-top_table.Litetable tr td:first-child {
    border-right: 1px dotted #707070;
  }

  #top_lite .c-title_small {
    border-bottom: 1px solid #2ca2d8;
    padding-bottom: 20px;
  }


/* 機能一覧
----------------------------------------------- */
  .func_list {
    background-color: #FFFFFF;
    border: 1px solid #FFFFFF;
    border-radius: 6px;
    padding: 35px 45px;
    line-height: 2;
    justify-content: start;
  }

  .func_list > li::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
  }

  .func_list.user > li::before {
    background: url(images/webfile/icon_list_user.svg)no-repeat left bottom;
  }

  .func_list.admin > li::before {
    background: url(images/webfile/icon_list_admin.svg)no-repeat left bottom;
  }

  .func_title {
    width: 120px;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 10px;
  }

  .func_list a {
    color: #000000;
  }


/* footer(202104の変更でTOPのfooterはpage-webfile.phpに)
----------------------------------------------- */
  #top_footer,
  #top_footer a {
    color: #4A4A4A;
  }

  #top_footer ul:not(:first-of-type) {
    padding-top: 40px;
  }

  #top_footer ul:first-of-type {
    padding: 40px 0;
    border-bottom: 1px solid #707070;
  }

  #top_footer ul li {
    display: inline-block;
    margin-right: 40px;
  }

  #top_footer ul:first-child {
    border-bottom: 1px solid #707070;
  }




/* お知らせ
----------------------------------------------- */

.wf-news{
  margin-top:40px;
  padding:0px 7px;
}

.news-title{
  padding:23px;
  border-top:2px solid #5C9D82;
}

.main-news-title{
  color:#000000;
  font-weight:bold;
  font-size:1.4em;
}

.sub-news-title{
  color:#9C9C9C;
  font-size:0.85em;
  padding-top:3px;
}

.news-main{
  margin-bottom:20px;
  border-top:1px dotted #C6D3C0;
}

.news-main dl{
  border-bottom:1px dotted #C6D3C0;
  padding: 15px 0px 15px 23px;
}

.news-main dt{
  float:left;
  margin-right:15px;
  background:url(images/webfile/ico-news-ya.gif) no-repeat scroll center right #000000;
  color:#FFFFFF;
  height:26px;
  font-size:0.9em;
  font-family: "ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
}

.date{ padding:7px 20px 0px 7px;}

.news-main dd{
  padding-top:7px;
}

/* お知らせアイコン */
.ico-bg-wfnews {
  background: #bc533e;
  color: #fff;
  font-size: 0.85em;
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-block;
}


/* 202104 */
#top_news dl {
  border-bottom: 1px dotted #707070;
}

#top_news dl:first-child {
  padding-bottom: 20px;
}

#top_news dl:not(:first-child) {
  padding: 20px 0;
}

#top_news dl dt,
#top_news dl dd {
  display: inline-block;
}

#top_news a {
  color: #2CA2D8;
}



/* 製品概要
----------------------------------------------- */

h2.title-summary{
  background:url(images/webfile/title-summary.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

.wf-wrapper{ margin-top:18px;}

.main-wrapper{ padding:0px 25px 15px 25px;}
.main-wrapper2{ padding:0px 10px 15px 10px;}

.pan{
  margin-bottom:6px;
  font-size:0.85em;
  line-height:130%;
}

.com-wrapper{
  margin-top:10px;
}

/* 共通h3タイトル */
h3.title-h3-wf{
  background:url(images/webfile/title-h3-wf.gif) no-repeat scroll top left transparent;
  width:690px;
  padding:14px 0px 16px 28px;
  font-size:1.1em;
  font-family: "ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
}

/* 共通h4タイトル */
h4{
  background-color:#E5E5E5;
  padding:8px 0px 8px 12px;
  margin-top:15px;
  font-weight:bold;
  font-size:1.1em;
  font-family: "ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  border-bottom: 3px double #CCCCCC;
  border-radius: 3px; /* CSS3草案 */
  -webkit-border-radius: 3px; /* Safari,Google Chrome用 */
  -moz-border-radius: 3px; /* Firefox用 */
  zoom:100%;
}

.what-webfile{
  background:url(images/webfile/img-what-webfile.jpg) no-repeat scroll top left transparent;
  width:646px;
  height:527px;
  text-indent:-9999px;
  margin-top:14px;
  margin-bottom:10px;
  position:relative;
}

.btn-admin{ /* webfileの仕組み 管理ボタン */
  position:absolute;
  top:42px;
  left:23px;
  background:url(images/webfile/btn-admin.gif) no-repeat scroll top left transparent;
  width:173px;
  height:56px;
  display:block;
}

.btn-share{ /* webfileの仕組み 共有ボタン */
  position:absolute;
  bottom:15px;
  left:103px;
  background:url(images/webfile/btn-share.gif) no-repeat scroll top left transparent;
  width:123px;
  height:56px;
  display:block;
}

.btn-security{ /* webfileの仕組み 保護ボタン */
  position:absolute;
  top:146px;
  left:293px;
  background:url(images/webfile/btn-security.gif) no-repeat scroll top left transparent;
  width:123px;
  height:57px;
  display:block;
}

.btn-send{ /* webfileの仕組み 配布ボタン */
  position:absolute;
  bottom:53px;
  left:330px;
  background:url(images/webfile/btn-send.gif) no-repeat scroll top left transparent;
  width:123px;
  height:56px;
  display:block;
}

.btn-collect{ /* webfileの仕組み 収集ボタン */
  position:absolute;
  top:160px;
  right:23px;
  background:url(images/webfile/btn-collect.gif) no-repeat scroll top left transparent;
  width:123px;
  height:57px;
  display:block;
}

p{
  color:#6F6F6F;
  margin-bottom:5px;
  font-size:0.9em;
}

.read{
  margin-top:15px;
  font-size:0.9em;
  line-height:150%;
  clear:both;
}

.function-area{ margin:10px 0px 15px;}

.read ul{
  margin-top:20px;
  list-style:none;
}

.read ul li{ margin-bottom:5px;}

.read ul li a{
  background:url(images/webfile/ico-linklist.gif) no-repeat scroll center left transparent;
  padding-left:15px;
  white-space:nowrap;
}

.read ul.left{ margin:0px;}
.read ul.left li{
  float:left;
  margin-right:20px;
}

.title-tieup{
  background:url(images/webfile/title-tieup.gif) no-repeat scroll top left transparent;
  width:242px;
  height:33px;
  text-indent:-9999px;
}

.img-send{
  background:url(images/webfile/img-send.gif) no-repeat scroll top left transparent;
  width:382px;
  height:350px;
  text-indent:-9999px;
  float:left;
}

.title-send{
  background:url(images/webfile/title-send.gif) no-repeat scroll top left transparent;
  width:286px;
  height:100px;
  text-indent:-9999px;
  float:left;
}

.img-collect{
  background:url(images/webfile/img-collect.gif) no-repeat scroll top left transparent;
  width:382px;
  height:300px;
  text-indent:-9999px;
  float:right;
}

.title-collect{
  background:url(images/webfile/title-collect.gif) no-repeat scroll top left transparent;
  width:286px;
  height:100px;
  text-indent:-9999px;
  float:left;
}

.img-security{
  background:url(images/webfile/img-security.gif) no-repeat scroll top left transparent;
  width:382px;
  height:360px;
  text-indent:-9999px;
  float:left;
  padding-right:10px;
}

.title-security{
  background:url(images/webfile/title-security.gif) no-repeat scroll top left transparent;
  width:286px;
  height:100px;
  text-indent:-9999px;
  float:left;
}

.img-share{
  background:url(images/webfile/img-share.gif) no-repeat scroll top left transparent;
  width:382px;
  height:330px;
  text-indent:-9999px;
  float:right;
}

.title-share{
  background:url(images/webfile/title-share.gif) no-repeat scroll top left transparent;
  width:286px;
  height:100px;
  text-indent:-9999px;
  float:left;
}

.img-admin{
  background:url(images/webfile/img-admin.gif) no-repeat scroll top left transparent;
  width:382px;
  height:343px;
  text-indent:-9999px;
  float:left;
  padding-right:10px;
}

.title-admin{
  background:url(images/webfile/title-admin.gif) no-repeat scroll top left transparent;
  width:286px;
  height:100px;
  text-indent:-9999px;
  float:left;
}


/* 機能詳細
----------------------------------------------- */

h2.title-function{
  background:url(images/webfile/title-function.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

.h4-title{
  background: url(images/ico-foot-arrow.gif) no-repeat scroll center left;
  font-family:"A-OTF 見出ゴMB31 Pro", "メイリオ","ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  font-weight:bold;
  font-size:1.0em;
  padding-left:30px;
  padding:10px 0px 10px 30px;
  margin-bottom:5px;
  color:#000000;
}

ul.evi li{
  padding:3px 0px 3px 10px;
  border-bottom:1px dotted #818181;
  color:#4A4A4A;
}

.function-up-flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 10px;
}

.function-up-card {
	display: inline-block;
	padding: 1em 1.2em 2em;
	border: 1px solid #707070;
	width: 40%;
	position: relative;
	margin-bottom: 10px;
}

.function-up-title {
	font-size: 1.2em;
	font-weight: 600;
	color: #222222;
}

.function-up-card a {
	text-decoration: none;
}

.function-up-card:hover {
	background-color: rgba(0, 0, 0, 0.09);
}

.function-up-card-b {
	width: 100%;
	background-color: #e5e5e5;
	text-align: right;
	font-weight: 600;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: -1;
	box-sizing: border-box;
	padding: 1px 5px;
}

/* 記事内 */
.function-up-wrapper section {
	padding: 0px 5px;
}

.function-up-flex-fix {
	display: flex;
	justify-content: center;
	align-items: center;
}

.function-up-summary {
	color: #3fa582;
	font-size: 1.4em;
	font-weight: 600;
	text-align: center;
}

.function-up-example-job {
	list-style: none;
	background-color: #c0d7d8;
	padding: .5em .9em;
	border-radius: 20px;
	display: inline-block;
	margin: 1.3em .5em;
}

.function-up-font-b {
	font-size: 1.2em;
	display: inline-block;
}

.function-up-j-center {
	justify-content: center;
}

/* テスト環境に反映ここまで↑　ここから下はまだ */
.function-up-question {
	background: url(images/webfile/function_up_q.svg)no-repeat center;
	text-indent: -9999px;
	width: 5em;
	height: 7em;
	display: inline-block;
}

.function-up-answer {
	background: url(images/webfile/function_up_arrow.svg)no-repeat center;
	text-indent: -9999px;
	width: 3em;
	height: 35px;
	display: inline-block;
}

.customize-summary {
	color: #c13a3a;
	font-weight: 600;
	font-size: 1.8em;
	text-align: center;
	padding: 10px;
	background: linear-gradient(180deg,#ffffff 0%, #ffffff 50%, #fcd9d9 50%, #fcd9d9 100%);
}

.customize-arrow {
	text-indent: -9999px;
	background: url(images/webfile/function_up_arrow.svg)no-repeat center;
	transform: rotate(90deg);
	width: 40px;
	height: 40px;
	margin: 0 auto;
}

/* 導入事例
----------------------------------------------- */

h2.title-case{
  background:url(images/webfile/title-case.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

.case-area{
  background-color:#FFFFFF;
  border:1px solid #E9E9E9;
  padding:8px;
  width:305px;
  float:left;
  margin:15px 0;
  border-radius: 4px; /* CSS3草案 */
  -webkit-border-radius: 4px; /* Safari,Google Chrome用 */
  -moz-border-radius: 4px; /* Firefox用 */
}

.case-area p{
  line-height:150%;
  font-size:0.8em;
  margin:0px;
}

.case-title{
  background-color:#E9E9E9;
  padding:14px 10px 14px 10px;
  margin-bottom:10px;
}

.case-title span{
  background:url(images/webfile/ico-case.gif) no-repeat scroll center left #E9E9E9;
  padding:5px 0px 6px 35px;
  font-weight:bold;
  height:25px;
}

.case-img{
  float:left;
  margin-right:10px;
  height:130px;
}

.case-img img{ border:1px solid #B9B9B9;}

.case-text{
  float:rigth;
  color:#393939;
  font-weight:bold;
  line-height:130%;
}

/* 詳細*/
.case-detail-title-area{
  background-color:#F5F5F5;
  border-left:5px solid #50A009;
  border-bottom:1px dotted #000000;
  padding:15px;
  margin-top:20px;
}

.case-detail-title{
  font-size:1.8em;
  font-weight:bold;
  font-family:"ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  line-height:120%;
  margin-bottom:20px;
}

.office-name{
  text-align:right;
  font-weight:bold;
}

.case-datail-sub-area{
  background-color:#F5F5F5;
  padding:15px;
  border-right:5px solid #50A009;
  font-size:0.9em;
  line-height:130%;
}

.koyaku-data-area{
  margin-top:20px;
}

.koyaku-data-title{
  border-bottom:1px solid #D2D2D2;
  padding:5px;
  margin-bottom:10px;
}

.koyaku-data-img{ float:right;}
.koyaku-data-img img{ border:1px solid #B9B9B9;}

.koyaku-data-text{
  float:left;
  margin-right:20px;
  width:450px;
  line-height:150%;
}

.kokyaku-main-title{
  background-color:#F5F5F5;
  padding:10px;
  font-size:1.1em;
  font-weight:bold;
  border-bottom:1px dotted #000000;
  margin-top:30px;
  margin-bottom:15px;
}

.kokyaku-main-text{
  padding:10px 3px;
  font-size:0.85em;
  line-height:160%;
  color:#444444;
}

.main-sub-title{
  margin-bottom:15px;
  font-weight:bold;
  font-size:1.2em;
}

/* ラインナップ */
ul.lineup-list{
  list-style:none;
}

ul.lineup-list li{
  vertical-align:bottom;
  border: none;
  display:inline;
}

ul.lineup-list li.title{
  text-indent:-9999px;
  background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll 0px 0px transparent;
  padding-top:22px;
  display:block;
}

ul.lineup-list li a{
  display:block;
  width:242px;
  text-indent:-9999px;
}

ul.lineup-list li.lite a{
  background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll 0px -39px transparent;
  height:79px;
}

ul.lineup-list li.lite a:hover{ background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll -241px -39px transparent;}

ul.lineup-list li.asp a{
  background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll 0px -117px transparent;
  height:63px;
}
ul.lineup-list li.asp a:hover{ background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll -241px -117px transparent;}

ul.lineup-list li.oem a{
  background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll 0px -180px transparent;
  height:75px;
}
ul.lineup-list li.oem a:hover{ background:url(images/webfile/nav-side-lineup.gif) no-repeat scroll -241px -180px transparent;}

.lineup-entry-btn{
  padding:20px 10px;
  margin:15px 0px 30px 0px;
  border-top:1px dotted #000000;
  border-bottom:1px dotted #000000;
  text-align:center;
}

.wf-lite-entry{
  background:url(images/webfile/btn-wf-lite-entry.gif) no-repeat scroll top left transparent;
  float:left;
}

.wf-lite-inquiry{
  background:url(images/webfile/btn-wf-lite-inquiry.gif) no-repeat scroll top left transparent;
  float:left;
}

.wf-order{
  background:url(images/webfile/btn-webfile-order.gif) no-repeat scroll top left transparent;
  float:left;
}

.wf-inquiry{
  background:url(images/webfile/btn-webfile-inquiry.gif) no-repeat scroll top left transparent;
  float:left;
}

.wf-lite-entry a, .wf-lite-inquiry a, .wf-order a, .wf-inquiry a{
  display:block;
  text-indent:-9999px;
  width:310px;
  height:74px;
  margin-right:15px;
}


/* LiteとASP比較ページ */
.Ltable thead {
  color: #FFF;
  font-size: 20px;
}

.Ltable thead th {
  width: 240px;
}

.Ltable thead th:first-child {
  width: 200px;
}

.Ltable thead tr th:nth-of-type(2) {
  background-color: #40B2E5;
  height: 80px;
  text-align: center
}

.Ltable thead tr th:nth-of-type(3) {
  background-color: #8CD0F0;
  text-align: center;
}

.Ltable_col:nth-child(2n+1) {
  background-color: #F8F8F8;
}

.Ltable_col th {
  background-color: #F8F8F8;
  font-weight: bold;
  color: #222222;
  text-align: left;
  padding: 10px;
}

.Ltable_col td {
  text-align: center;
}

.Ltable_col:nth-child(2n+1) th {
  background-color: #DDDDDD;
}

.Ltable_col td span {
  font-size: 11px;
  color: #434446;
  display: inline-block;
  width: 80%;
  margin: 0 auto;
}

/* 料金
----------------------------------------------- */

/* lite */
.title-lite{
  background:url(images/webfile/title-lite.gif) no-repeat scroll top left transparent;
  height:75px;
  width:670px;
  text-indent:-9999px;
}

h2.title-price{
  background:url(images/webfile/title-price.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

/* 基本料金テーブル */
table.price_table{
  width:100%;
  border-collapse:collapse;
  margin-bottom:10px;
}

table.price_table p{
  margin-bottom:0px;
  font-size:0.9em;
}

table.price_table p.best-price{
  font-size:1.3em;
  font-weight:bold;
  color:#0861B2;
}

table.price_table p.best-price5g{
  font-size:1.3em;
  font-weight:bold;
  color:#257D11;
}

table.price_table th{
  text-align:left;
  border:1px solid #B8B8B8;
  border-bottom:1px dotted #B8B8B8;
  border-top:1px dotted #B8B8B8;
  white-space:nowrap;
  padding:10px;
  font-weight:bold;
}

table.price_table td{
  text-align:center;
  border:1px solid #B8B8B8;
  border-bottom:1px dotted #B8B8B8;
  border-top:1px dotted #B8B8B8;
  white-space:nowrap;
  padding:10px;
}

table.price_table td.bgblue{
  background-color:#F2F5F7;
}

table.price_table td span{
  color:#434446;
  font-size:11px;
}

/* 25G 50G */
table.price_table th.price-bg{
  background:url(images/webfile/bg-price-table.gif) repeat-x scroll top left #EBEEEF;
  border-top:1px solid #b8b8b8;
  font-size:1.5em;
  font-weight:bold;
  padding:20px 0px;
  text-align:center;
}

/* 5G */
table.price_table th.price-bg2{
  background:url(images/webfile/bg-price-table2.gif) repeat-x scroll top left #D0F771;
  border-top:1px solid #b8b8b8;
  font-size:1.5em;
  font-weight:bold;
  padding:20px 0px;
  text-align:center;
}

/* lite */
table.price_table th.price-bgLite{
  background:url(images/webfile/bg-price-table3.gif) repeat-x scroll top left #B3E8F8;
  border-top:1px solid #b8b8b8;
  font-size:1.3em;
  font-weight:bold;
  padding:10px 0px 7px;
  text-align:center;
}

table.price_table th.price-bgLite2{
  background:url(images/webfile/bg-price-table.gif) repeat-x scroll top left #EBEEEF;
  border-top:1px solid #b8b8b8;
  font-size:1.3em;
  font-weight:bold;
  padding:10px 0px 7px;
  text-align:center;
}

/* 左上空白 */
table.price_table th.no{
  border: 0 none !important;
  width: 50px;
}

/* 年間契約で50%OFF */
.salse-point{
  border-radius: 4px; /* CSS3草案 */
  -webkit-border-radius: 4px; /* Safari,Google Chrome用 */
  -moz-border-radius: 4px; /* Firefox用 */
  background-color:#E84B1B;
  color:#FFFFFF;
  box-shadow: 2px 2px 3px 1px #C33E15 inset;
  padding:2px;
}

.price1{ background-color: #E3F5B6;}
.price1a{ background-color: #B8E448;}
.price2{ background-color: #F0F0F0;}

/* オプション料金テーブル */
table.price_table-option{
  border-collapse: collapse;
  width:100%;
  margin-bottom:10px;
}

table.price_table-option th,table.price_table-option td{
  padding:7px 7px 7px 9px;
  border:1px solid #B8B8B8;
  border-bottom:1px dotted #B8B8B8;
  border-top:1px dotted #B8B8B8;
  white-space:nowrap;
}

table.price_table-option th{ font-weight:bold;}

table.price_table-option th.option-th{
  background:url(images/webfile/bg-option-th.gif) repeat-x scroll top left #90D5FE;
  height:35px;
  padding:0px;
  text-align:center;
  font-weight:bold;
  border-top:1px solid #B8B8B8;
}

table.price_table-option th.option-th2{
  background:url(images/webfile/bg-option-th2.gif) repeat-x scroll top left #D8E0E2;
  height:35px;
  padding:0px;
  text-align:center;
  font-weight:bold;
  border-top:1px solid #B8B8B8;
  width:10%;
}

table.price_table-option td{
  text-align:right;
}

.font-s-ex {
  font-size: 11px !important;
  font-weight: normal !important;
}

.ico-tri {
  background:url(images/webfile/ico-price-option.gif) no-repeat scroll center left transparent;
  padding-left: 15px;
}

.bg-gray{ background-color:#F8F8F8;}
.bg-gray-gradi { background: linear-gradient(#EDF4F5,#D8E0E2); }

/* 簡単お見積もりフォーム */
.clearBtn {
  background: url(images/webfile/btn-sim-clear.gif) no-repeat scroll left center transparent;
  border: 0 none;
  cursor: pointer;
  height: 25px;
  margin-left: 5px;
  width: 103px;
}

.step1{
  background: url(images/webfile/sim-s-step1.gif) no-repeat scroll left center transparent;
  font-size: 1.2em;
  font-weight:bold;
  padding: 0px 0px 0px 55px;
}

.step2{
  background: url(images/webfile/sim-s-step2.gif) no-repeat scroll left center transparent;
  font-size: 1.2em;
  font-weight:bold;
  padding: 0px 0px 0px 55px;
  margin-top:40px;
}

.step3{
  background: url(images/webfile/sim-s-step3.gif) no-repeat scroll left center transparent;
  font-size: 1.2em;
  font-weight:bold;
  padding: 0px 0px 0px 55px;
  margin-top:40px;
}

table.step1-table {
  background-color: #EDEDED;
  border-collapse: separate;
  border-radius: 3px 3px 3px 3px;
  border-spacing: 4px;
  margin: 5px 0px;
  width: 100%;
  font-size:1.1em;
}

table.step1-table th {
  background: url(images/webfile/bg-sim-tableStep1.gif) repeat-x scroll left top #BFD380;
  border: 1px solid #9BB260;
  border-radius: 3px 3px 3px 3px;
  color: #2E2E2E;
  font-size: 1em;
  padding: 7px 7px 7px 10px;
  text-align: left;
  vertical-align: middle;
  width: 110px;
  font-weight:bold;
}

table.step1-table td {
  background-color: #FFFFFF;
  border: 1px solid #BBBBBB;
  padding: 5px 5px 5px 10px;
  border-radius: 3px 3px 3px 3px;
  color: #424242;
  font-size: 0.9em;
  padding: 7px;
  text-align: left;
  vertical-align: middle;
}

table.step1-table th span.no1{
  background: url(images/webfile/sim-no-1.gif) no-repeat scroll left center transparent;
  padding-left:23px;
}

table.step1-table th span.no2{
  background: url(images/webfile/sim-no-2.gif) no-repeat scroll left center transparent;
  padding-left:23px;
}

.sfont {
  color: #2E69FF;
  font-size: 0.9em;
}

table.option-table {
  border: 0 none;
  border-collapse: collapse;
  margin-top: 5px;
  width: 100%;
}

table.option-table th {
  background: url(images/webfile/bg-sim-tableStep2.gif) repeat-x scroll left top #EEEEEE;
  border: 1px solid #CFCFCF;
  color: #484848;
  font-size: 1em;
  font-weight:bold;
  padding: 3px;
  text-align: center;
  white-space: nowrap;
}

table.option-table td {
  border-bottom: 1px dotted #A2A2A2;
  color: #353535;
  font-size: 0.9em;
  padding: 5px;
  vertical-align: top;
}

/* 詳細を見るボタン */
.detailBtn {
  background: url(images/webfile/ico-sim-open.gif) no-repeat scroll left center transparent;
  border: 0 none;
  cursor: pointer;
  margin-left: 5px;
  padding-bottom: 1px;
  padding-left: 18px;
}

/* 閉じるボタン */
.closeBtn {
  background: url(images/webfile/ico-sim-close.gif) no-repeat scroll left center transparent;
  border: 0 none;
  cursor: pointer;
  margin-left: 5px;
  padding-bottom: 1px;
  padding-left: 20px;
}

#detail-1, #detail-2, #detail-3, #detail-4, #detail-5, #detail-6, #detail-7, #detail-8 {
    display: none;
}

ul.sim-step2-ico {
  margin-left: 30px;
  margin-top:5px;
}

ul.sim-step2-ico li{
  margin-bottom:5px;
  line-height:100%;
  list-style: none inside url(images/webfile/ico-sim-ya.gif);
  color:#4A4A4A;
}

.optionTitle {
  color: #353535;
  font-size: 1.1em;
  font-weight: bold;
  margin-bottom: 3px;
}

/* トータルボタン */
.btn-total {
  margin: 20px auto;
  text-align: center;
}

#total {
  background: url(images/webfile/btn-sim-result.gif) no-repeat scroll left center transparent;
  border: 0 none;
  cursor: pointer;
  height: 77px;
  width: 208px;
}

/* お見積もり内容 */
.total-area {
  background: url(images/webfile/bg-sim-tableTop.gif) no-repeat scroll left top transparent;
  width: 530px;
  margin:0 auto;
}

.step {
  border-left: 1px solid #CACACA;
  border-right: 1px solid #CACACA;
}

.total-step {
  padding-top: 45px;
}

ul.total {
  margin: 0px 10px;
  padding: 10px 0px 5px;
}

ul.total li {
  border-bottom: 1px dotted #CCCCCC;
  color: #353535;
  font-size: 0.9em;
  list-style: none outside none;
  min-height: 36px;
  padding:15px 0px 0px  95px;
  font-size:1.1em;
}

ul.total li.to-step1 { background: url(images/webfile/sim-step1.gif) no-repeat scroll left center transparent;}
ul.total li.to-step2 { background: url(images/webfile/sim-step2.gif) no-repeat scroll left center transparent;}
ul.total li.to-step3 { background: url(images/webfile/sim-step3.gif) no-repeat scroll left center transparent;}
ul.total li.nb { border: medium none;}

.total-table table {
  border-collapse: collapse;
  border: solid 1px #CACACA;
  width: 100%;
}

.total-table table th {
  background: url(images/webfile/bg-sim-tableResult.gif) repeat-x scroll left top #EDEDED;
  border-bottom: 1px dotted #CACACA;
  border-right: 1px dotted #CACACA;
  color: #000000;
  padding: 7px;
  text-align: center;
  width: 50%;
}

.total-table table td {
  border-bottom: 1px dotted #CACACA;
  padding: 7px;
  text-align: right;
}


/* お問い合わせ画面
----------------------------------------------- */

table.control-group-table{
  width:100%;
  border-collapse:separate;
  border-top:3px double #B8B8B8;
  border-bottom:3px double #B8B8B8;
  margin-top:15px;
  font-size:0.9em;
}

table.control-group-table th{
  padding:5px 5px 5px 20px;
  text-align:right;
  white-space:nowrap;
  font-weight:bold;
  background: url("images/webfile/bg-option-th2.gif") repeat-x scroll left top #D8E0E2;
  width:120px;
}

table.control-group-table td{
  padding:12px 10px 10px;
  border-bottom:1px dotted #B8B8B8;
}

table.control-group-table th .required{ color:#EB1111;}

table.control-group-subTable{
  width:100%;
  border-collapse:separate;
}

table.control-group-subTable th{
  color: #373737 !important;
  background: url("images/webfile/bg-option-th2.gif") repeat-x scroll left top #D8E0E2;
  padding:10px 5px 10px 10px;
  text-align:right;
  white-space:nowrap;
  font-weight:bold;
  width:10%;
}

table.control-group-subTable td{
  padding:8px;
}

table.control-group-subTable td.zipcode input{
  width:50px !important;
}

.privacy-link{
  background:url(images/ico-privacylink.gif) no-repeat scroll center left #FFFFFF;
  padding-left:25px;
}

.privacy-link:link{
  color:#373737;
  text-decoration: underline;
}
.privacy-link:hover{ text-decoration: none;}

.privacy-wrapper{
  padding:10px;
}

h4.privacy{
  margin-top:30px;
  padding-bottom:5px;
  color:#000000;
  border-bottom:#C6C6C6 1px dotted;
  background-color:#FFFFFF;
}

.privacy-confirm-btn{
  margin-top:20px;
  margin-bottom: 20px;
  padding:10px;
  text-align:center;
  background-color:#E3ECEF;
}

.privacy-confirm-btn p{
  margin:0px !important;
}

.bnone { border: medium none !important;}

.help-inline{
  display:block;
  padding-top: 5px;
  color:#EB1111;
}

.error-list ul{
  margin-top:10px;
}

.notice-question {
 text-align: center; 
 padding: 30px; 
 margin: 20px 0px 20px; 
 border-bottom: 1px solid #5C9D82; 
}

.notice-question a { 
 color: #595959; 
 font-weight: bold; 
 font-size: 1.2rem; 
 text-decoration: none; 
 padding: 10px 40px; 
 border: 2px solid #5C9D82;
 border-radius: 4px; /* CSS3草案 */ 
 -webkit-border-radius: 4px; /* Safari,Google Chrome用 */ 
 -moz-border-radius: 4px; /* Firefox用 */ 
}

.notice-question a:hover { 
 background-color: #DDF2E9; 
} 


/* 申込み --------------------------------------*/
h2.title-entry2{
  background:url(images/webfile/title-entry2.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}


/* 質問 ----------------------------------------*/
dl.question-list{
  margin-top:10px;
}

dl.question-list dt{
  background: url(images/webfile/bg-option-th2.gif) repeat-x scroll left top #D8E0E2;
  font-weight: bold;
  padding:8px;
  border:1px solid #B8B8B8;
  border-bottom:1px dotted #B8B8B8;
}

dl.question-list dd{
  padding:8px;
  line-height:150%;
  border:1px solid #B8B8B8;
  border-top:none;
}

dl.question-list dt .required{
  color:#EB1111;
}

/* lite ----------------------------------------*/
ul.lite-list{
  margin:20px 0px 30px;
  line-height:140%;
  font-size:0.9em;
}

ol.wfl-rules{
  margin: 5px 0px 15px 25px;
  line-height:150%;
  font-size:0.9em;
}

.kiyaku{
  border: 1px solid #CECECE;
  height: 200px;
  overflow: scroll;
  padding: 20px;
  width: 635px;
  margin-top:10px;
}

.kiyaku p{line-height:140%;}

.alerm{
  background-color: #FFF5EE;
  border: 1px solid #CC0000;
  color: #CC0000;
  margin: 20px auto;
  padding: 15px;
  text-align: center;
  line-height: 1.8em;
}

.alerm_grey {
  background-color: #f2f2f2;
  margin: 20px auto;
  padding: 15px;
  text-align: center;
  line-height: 1.8em;
  font-size: 0.9em;
}

/* 動画 ----------------------------------------*/
.howtoMovie {
  margin: 30px auto 20px auto;
  text-align: center;
}

/* How to WebFile
----------------------------------------------- */

h2.title-howto{
  background:url(images/webfile/title-howto.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

/* ファイル共有のよくある間違い */
.eye-sharesmistake-title{
  background: url(images/webfile/eye-sharesmistake-title.gif) no-repeat scroll left top #FFFFFF;
  text-indent:-9999px;
  height:130px;
  border-top:4px solid #7C8891;
  margin-left:5px;
}

/* 情報漏洩の原因から考える事故防止策と安全なファイル共有 */
.eye-incidentsurvey-title{
  background: url(images/webfile/eye-incidentsurvey-title.gif) no-repeat scroll left top #FFFFFF;
  text-indent:-9999px;
  height:140px;
  border-top:4px solid #7C8891;
  margin-left:5px;
}

/* 企業が恐れる情報漏えい事故を防ぐための多角的かつ多重なファイル送信セキュリティ */
.eye-sendsecurity-title{
  background: url(images/webfile/eye-sendsecurity-title.gif) no-repeat scroll left top #FFFFFF;
  text-indent:-9999px;
  height:155px;
  border-top:4px solid #7C8891;
  margin-left:5px;
}

ul.howtoList {
  list-style: none outside none;
  margin: 5px 0px;
}

ul.howtoList li{
  border-top:1px dotted #000000;
  padding:5px;
  margin:0px;
}

ul.howtoList li a{
  text-decoration: none;
  font-size:0.9em;
}

ul.howtoList li a:focus,
ul.howtoList li a:active,
ul.howtoList li a:hover {
  text-decoration: underline;
}

table.SharesMistake {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 90%;
  margin-bottom: 30px;
  width:100%;
}

table.SharesMistake th, td {
  color: #2D5C79;
  padding: 5px 10px;
}

table.SharesMistake th {
  background: none repeat scroll 0 0 #A0C9DB;
  border-bottom: 1px solid #2D5C79;
  border-top: 1px solid #2D5C79;
}

table.SharesMistake td {
  background: none repeat scroll 0 0 #E6F2F8;
  border-bottom: 1px solid #2D5C79;
  border-top: 1px solid #2D5C79;
}

table.SharesMistake td.ng {
  background: none repeat scroll 0 0 #EEEEEE;
  border-top: 1px solid #333333;
}

table.SharesMistake .ng span { color: #333333;}
table.SharesMistake span {
  color: #CC0000;
  font-weight: bold;
}


/* スライドショー
-------------------------------------------------------------- */
#slideshow-area{
	width:100%;
	text-align:center;
  }

  /* 202104 */
  .slide-main{
    width: 700px;
    margin: 0 auto;
    padding: 5px 0px 0px;
    position: relative;
    }
  
  .pamphlet-btn{
	position:absolute;
	top:180px;
	right:20px;
	z-index:100;
  }
  
  .btn-left{
	position:absolute;
	top:170px;
	left:-20px;
	z-index:102;
  }
  
  .btn-right{
	position:absolute;
	top:170px;
	right:-20px;
	z-index:102;
  }


  /* 202104 */
  .slides_container {
    width: 690px;
    height: 370px;
    overflow: hidden;
    position: relative;
    display: none;
    margin: 0 auto;
    box-shadow: 0 10px 10px rgba(0, 152, 221, 0.5);
    border-radius: 10px;
  }

  .slides_container a {
	  width: 570px;
	  height: 270px;
  }

  .pagination {
	width: 180px;
	margin: 15px auto 0px;
	padding-bottom: 20px;
	padding-top: 4px;
	text-align: center;
  }

  .pagination li {
	list-style:none;
	float:left;
	margin-left:18px;
  }

  .pagination li a{
	display:block;
	background-position:0 0;
	overflow:hidden;
	text-indent:-9999px;
	float:left;
	cursor:pointer;
	background: url(images/pagination.png) left top no-repeat;
	width:12px;
	height:11px;
  }
  
  .pagination li.current a {
	background: url(images/pagination.png) 0px -12px no-repeat;
  }

/* 4.1リリース紹介
----------------------------------------------- */
.section_410 {
	padding-top: 100px;
}

.btn_410 {
	border-radius: 30px;
	box-shadow: 0 3px 7px #0000004D;
	font-weight: bold;
	display: inline-block;
	text-decoration: none;
	min-width: 200px;
	text-align: center;
}

.btn_410:hover {
	box-shadow: none;
}

.btn_410.green {
	background-color: #25B242;
	border: 1px solid #25B242;
	color: #FFFFFF;
	font-size: 1.4rem;
	padding: 0.9rem 2.4rem ;
}

.btn_410.green::after {
	content: "";
	display: inline-block;
	background: url(images/webfile/ico_arrow_white.svg) no-repeat center;
	background-size: contain;
	width: 14px;
	height: 18px;
	margin-left: 1rem;
}

.btn_410.white {
	background-color: #FFFFFF;
	border: 3px solid #25B242;
	color: #25B242;
	width: 35%;
	padding: 0.5rem 0;
}

.btn_410.white::after {
	content: "";
	display: inline-block;
	background: url(images/webfile/ico_arrow_green.svg) no-repeat center;
	background-size: contain;
	width: 12px;
	height: 12px;
	margin-left: 1rem;
}

.titleWrap_410 {
	background-color: #EFEFEF;
	border-radius: 10px;
	padding: 1.2rem 2rem;
}

.titleInnerWrap_410 {
	display: flex;
	justify-content: space-between;
	vertical-align: middle;
	align-items: center;
	width: 90%;
	margin: 0 auto;
}

.titleInnerWrap2_410 {
	display: inline-block;
	text-align: left;
}

.titleWrap_410 .dFlex {
	width: 85%;
	margin: 0 auto;
}

.title_big_410 {
	font-size: 2.7rem;
	font-weight: bold;
	letter-spacing: 0.1rem;
	margin: 10px 0 15px;
}

.titleWrap_mini_410 {
	border: 1px solid #000000;
	width: 100%;
	padding: 1rem 2.5rem;
	box-sizing: border-box;
	margin: 50px 0 10px;
}

.titleWrap_mini_410 .right {
	width: 35%;
}

.title_mini_410 {
	font-size: 1.5rem;
	font-weight: bold;
}

.subtitle_410 {
	font-size: 1.5rem;
}

.point_410 {
	background-color: #FF9A00;
	border: 1px solid #FF9A00;
	border-radius: 4px;
	width: 100%;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
	padding: 0.3rem 0.7rem;
	box-sizing: border-box;
}

.ctaArea_410 {
	border: 3px solid #FF9A00;
	text-align: center;
	padding: 2rem;
	width: 100%;
	box-sizing: border-box;
}

.ctaArea_410 .titleInnerWrap2_410 {
	font-size: 1.1rem;
	line-height: 1.4;
	margin-bottom: 15px;
}

.ctaArea_mini_410 {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 60px;
	font-size: 1.2rem;
}

.imgWrap_410 {
	width: 250px;
}

.imgWrap_410 img {
	width: 100%;
}

.read-text-410 {
	padding-right: 20px;
}

.dFlex { 
	display: flex;
	justify-content: space-between;
	vertical-align: middle;
	align-items: center;
}

.titleInnerWrap_410 > p,
.dFlex > p { display: none; }

.reverce {
	flex-direction: row-reverse;
}

.ui-img-410 {
	flex-shrink: 0;
	width: 300px;
	padding-right: 30px;
}

.price_change_410 {
	width: 70%;
	margin: 0 auto;
	padding: 30px 0;
}

.price_change_title {
	width: 100%;
	background: #EFEFEF;
	border-radius: 30px;
	text-align: center;
	padding: 1.2rem;
	box-sizing: border-box;
}

/* =トップメイン
----------------------------------------------- */

h2.title-entry{
  background:url(images/webfile/title-entry.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

h2.title-step{
  background:url(images/webfile/title-step.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

/* =トップメイン
----------------------------------------------- */

#content{
  width:700px;
  float:left;
  font-size:95%;
}

/* お知らせ */
.topnews{
  padding:35px 35px 18px;
}

.topnews img{
  vertical-align:middle;
}

.title-topnews{
  background: url(images/title-topnews.gif) no-repeat scroll top left;
  text-indent:-9999px;
  height:23px;
  width:145px;
  float:left;
  margin-bottom:25px;
}

.all-topnews-btn{
  background: url(images/btn-topnews-all.gif) no-repeat scroll top right;
  text-indent:-9999px;
  float:right;
}

.all-topnews-btn a{
  display:block;
  height:24px;
  width:112px;
}

.news-list dl{
  border-left:2px solid #056EAB;
  margin-bottom:20px;
}

.news-list dt ,.news-list dd{ padding:7px 12px 5px; }

.news-list dt{
  color:#000000;
  font-weight:bold;
  font-size:90%;
}

.news-list dd a{ color:#828282; }


/* サイドバー
----------------------------------------------- */
#sidebar{
  float:right;
  width:242px;
}

#sidebar img{
  margin-bottom:10px;
}

.side-banner{
  width:242px;
  padding:40px 0px 0px;
}

.side-banner2{
  width:242px;
  padding:20px 0px 0px;
}

.basic-list{
  background-color:#F6F6F6;
  border:1px solid #B7B7B7;
  padding:6px ;
  margin-top:48px;
}

.basic-list img{
  margin:0px !important;
}

.basic-list ul{
  list-style:none;
}

.basic-list ul li{
  padding:15px;
  border-bottom:1px dotted #B7B7B7;
  background-color:#FFFFFF;
  list-style-position:outside;
}

.basic-list ul li a{
  background: url(images/ico-ya.gif) no-repeat scroll center left #FFFFFF;
  padding-left:12px;
  color:#5A5A5A;
}


.basic-list2{
  background-color:#F6F6F6;
  border:1px solid #B7B7B7;
  padding:6px ;
  margin-top:48px;
}

.basic-list2 img{
  margin:0px !important;
}

.basic-list2 ul{
  list-style:none;
}

.basic-list2 ul li{
  padding:5px;
  border-bottom:1px dotted #B7B7B7;
  background-color:#FFFFFF;
  list-style-position:outside;
  line-height:150%;
  font-size:0.9em;
}

.basic-list2 ul li a{
  background: url(images/ico-ya.gif) no-repeat scroll center left #FFFFFF;
  padding-left:12px;
  color:#5A5A5A;
}

.list-title-guid{
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* IE10+ */
  background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
  border:1px solid #a9a9a9;
  border-bottom:1px dotted #a9a9a9;
  padding:10px;
}

.list-title-guid span{
  border-left:6px solid #58b01b;
  padding-left:8px;
}


/* フッター
----------------------------------------------- */

#colophon {
  clear: both;
  border-top:3px solid #5C9D82;
  background-color:#DDF2E9;
  height:100%;
}

#colophon a{ text-decoration: none;}

#colophon a:focus,
#colophon a:active,
#colophon a:hover {
  text-decoration: underline;
}

.footer-top{
  width:980px;
  margin:0 auto;
  height:auto;
  margin-bottom:10px;
}

/* リンク */
ul.mainLink{
  margin-top:20px;
  list-style:none;
}

ul.mainLink li{
  float:left;
  border-left:1px solid #B1B1B1;
  height:200px;
}

ul.mainLink li.last{ border-right:1px solid #B1B1B1;}
ul.mainLink li.last2{ border:none;}

ul.mainLink li ul.subLink{
  list-style:none;
  padding:18px 28px;
}

ul.mainLink li ul.subLink2{ padding:8px 15px;}

ul.mainLink li ul.subLink li{
  float:none;
  border:none;
  height:auto;
  font-size:12px;
  margin-bottom:5px;
  list-style-position:outside;
}

ul.mainLink li ul.subLink li a{ color:#616161;}

ul.mainLink li ul.subLink li.basic{
  font-family:"ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  font-weight:bold;
  font-size:1.0em;
  margin-bottom:15px;
  text-align:center;
}

ul.mainLink li ul.subLink li.basic a{ color:#000000;}

ul.mainLink li ul.subLink li.ya{
  background: url(images/webfile/ico-foot.gif) no-repeat scroll center left;
  padding-left:15px;
  color:#696969;
}

ul.mainLink li ul.subLink li.ya a{ color:#75AB1F;}

ul.mainLink li ul.subLink li.basic img{ vertical-align:middle;}





.footer-bottom{
  background: url(images/webfile/bg-footer-bottom.gif) repeat-x scroll top left #5C9D82;
  padding:15px 0px 12px;
  text-align:center;
  font-size:0.85em;
  color:#FFFFFF;
}

.footer-bottom a{ color:#FFFFFF;}

.fo-main{
  width:550px;
  margin:0 auto;
}

.footLeft{
  float:left;
}

.footRight{
  color:#FFFFFF;
  font-family:"ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  font-size:0.7em;
  line-height:110%;
}

.cam-name{
  font-size:1.4em;
  padding-top:5px;
}


/* TOP以外の画面
----------------------------------------------- */

/* 共通 */
h3.sub-title{
  background: url(images/webfile/title-h3-wf.gif) no-repeat scroll left top transparent;
  font-family: "ヒラギノ角ゴ Pro",Helvetica,Arial,sans-serif;
  font-size: 1.1em;
  padding: 14px 0 16px 28px;
  width: 704px;
}

.mailaddress{
  display:blodk;
  background: url(images/mailaddress.gif) no-repeat top left scroll transparent;
  width:219px;
  height:18px;
  padding:2px 0px 6px;
  margin-top:3px;
  padding-right:219px;
  text-indent:-9999px;
}

/* お知らせ */
.news-wrapper{ padding:20px;}

h2.entry-title{
  font-size:1.3em;
  font-weight:bold;
  margin-bottom:10px;
}

.entry-top-border{ border-top:4px solid #AAAEB3;}

.time{
  color:#8C8C8C;
  font-size:0.9em;
}

.entry-header{ font-family:"ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif; }
.entry-content{
  margin-top:20px;
  font-size:0.9em;
  color:#5A5A5A;
  line-height:150%;
}

/* 検索 */
.entry-summary{
  font-size:0.9em;
  color:#2D2D2D;
  line-height:150%;
}

.nextpage a{
  text-align:right;
  display:block;
}


/* よくある質問
----------------------------------------------- */

.question-q{
  padding:5px 5px 10px 5px;
  margin-bottom:10px;
  border-bottom:4px dotted #15be9c;
  font-size:1.4em;
}

.question-q span{
  background: url(images/webfile/ico-question-q.gif) no-repeat scroll center left;
  padding:10px 0px 10px 50px;
  display:block;
  line-height:130%;
}

.question-a{
  padding:5px 5px 10px 5px;
  font-size:1.2em;
}

.question-a span{
/*  background: url(images/webfile/ico-question-a.gif) no-repeat scroll top left;*/
/*  padding:0px 0px 10px 50px;*/
/*  display:block;*/
  background:none;
  display:inline;
  padding:0px;
}


/* シンクローラー
----------------------------------------------- */
.synchroer-area{
  margin:5px 0px 5px 25px;
  _margin:5px 0px 5px 12px;
  width:310px;
  height:290px;
  float:left;
}


/* お知らせ
----------------------------------------------- */

.wfnews{
  font-size:1.4em;
  border-bottom:1px dotted #000000;
  padding-bottom:5px;
}

h2.title-news{
  background:url(images/webfile/title-news.png) no-repeat scroll top left transparent;
  margin-top:38px;
  height:96px;
  text-indent:-9999px;
}

.wf-entry-content p{
  font-size:1.0em;
  padding-top:10px;
}

.link-list{
  border-top:1px dotted #000000;
  border-bottom:1px dotted #000000;
  padding:15px 0px;
}

.link-list ul ul{
  list-style:none;
}

.link-list li{
  background:url(images/ico-ya.gif) no-repeat scroll left center #FFFFFF;
  list-style-type:none;
  padding-left:10px;
  line-height:130%;
}

/* =Content
----------------------------------------------- */

#main {
  clear: both;
  padding: 1.625em 0 0;
}
.page-title {
  color: #666;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 2.6em;
  margin: 0 0 2.6em;
  text-transform: uppercase;
}
.page-title a {
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0;
  text-transform: none;
}

.hentry,
.no-results {
  border-bottom: 1px solid #ddd;
  padding: 20px 0px 0px;
  position: relative;
}

.hentry:last-child,
.no-results {
	border-bottom: none;
}
.blog .sticky .entry-header .entry-meta {
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}
.entry-meta {
	color: #666;
	clear: both;
	font-size: 12px;
	line-height: 18px;
}
.entry-meta a {
	font-weight: bold;
}
.single-author .entry-meta .by-author {
	display: none;
}
.comment-content ul,
.comment-content ol {
	margin-bottom: 1.625em;
}
.comment-content ul ul,
.comment-content ol ol,
.comment-content ul ol,
.comment-content ol ul {
	margin-bottom: 0;
}
dl.gallery-item {
	margin: 0;
}
.page-link {
	clear: both;
	display: block;
	margin: 0 0 1.625em;
}
.page-link a {
	background: #eee;
	color: #373737;
	margin: 0;
	padding: 2px 3px;
	text-decoration: none;
}
.page-link a:hover {
	background: #888;
	color: #fff;
	font-weight: bold;
}
.page-link span {
	margin-right: 6px;
}
.entry-meta .edit-link a,
.commentlist .edit-link a {
	background: #eee;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #666;
	float: right;
	font-size: 12px;
	line-height: 1.5em;
	font-weight: 300;
	text-decoration: none;
	padding: 0 8px;
}
.entry-meta .edit-link a:hover,
.commentlist .edit-link a:hover {
	background: #888;
	color: #fff;
}
.entry-content .edit-link {
	clear: both;
	display: block;
}


/* 一斉収集画面 */
.gathering {
    line-height: 1.4;
}

.gathering p {
    color: #1c1c1c;
    font-size: 1.0em;
}

.gathering .c-title {
    text-align: center;
    background: url(images/webfile/bg-gathering-title-img.png) no-repeat center right scroll transparent;
    background-color: rgba(255,255,255,0.5);
    background-blend-mode: lighten;
}

.gathering .c-title div {
    width: 50%;
    padding: 0px 20px;
}

.gathering .c-title p {
    font-size: 0.9em;
    text-align: left;
}

.gathering .l-horizontal {
    display: flex;
    justify-content: space-between;
    vertical-align: middle;
    padding: 10px;
}

.gathering .l-horizontal section {
    width: 202px;
    margin: 0px 10px 10px 10px;
}

.gathering .c-scene {
    text-align: center;
    background-color: #ebf2ed;
    overflow: hidden;
    margin: 0px 5px;
}

.gathering .c-scene h4 {
    color: #1a814d;
    font-size: 1.4em;
    background-color: transparent;
    border: transparent;
}

.gathering .c-scene p {
    text-align: left;
    font-size: 0.9em;
    color: #1c1c1c;
}

.gathering .c-scene h5 {
    border: transparent;
    font-size: 1.2em;
}

.gathering .c-features, .gathering .c-title
{
    overflow: hidden;
    padding: 40px 0px;
}

.gathering .c-features p {
    padding: 0 1.2rem;
}
.gathering .bg-green {
    background-color: #ebf2ed;
}

.gathering .c-features h4,
.gathering .c-price h4,
.gathering .c-title h4,
.gathering .c-contact h4
{
    background-color: transparent;
    border: transparent;
    color: #1a814d;
    font-size: 2.4em;
    font-weight: normal;
    letter-spacing: 0.1em;
    text-align: center;
    margin-bottom: 18px;
    padding: 0px;
}

.gathering .c-price {
    text-align: center;
    margin: 50px auto 30px auto;
}

.gathering .c-price h4,
.gathering .c-contact h4 {
    font-size: 1.8em;
}

.gathering .c-price table {
    text-align: center;
    border: 1px;
    border-collapse: separate;
    border-spacing: 0;
    margin: 0px auto;
    width: 70%;
}

.gathering .c-price table td, .gathering .c-price table th {
    padding: 20px ;
    border: 1px solid #dddddd;
    text-align: center;
    color: #1c1c1c;
}

.gathering .c-price table th {
    font-weight: bold;
}

.gathering .notes {
    color: #6F6F6F;
    text-align: left;
    font-size: 0.9em;
    width: 400px;
    margin: 5px auto;
    list-style: none;
}

.gathering .c-contact {
    margin-bottom: 30px;
    padding: 20px;
}

.gathering .c-contact .l-flex-item {
    width: 46.8%;
}
.gathering .c-contact:hover {
    background-color: #ebf2ed;
}

.gathering .c-contact a {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    height: 100px;
    border: 1px solid #dedede;
    border-radius: 8px;
    background: url(images/webfile/bg-gathering-contact-button.png) 0 no-repeat #fff;
    color: #000;
    font-size: 1.5em;
    letter-spacing: .05em;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
}
.gathering .c-contact a:hover {
    -webkit-box-shadow: 0 10px 10px -6px rgba(0,0,0,.25);
    box-shadow: 5px 5px 10px -6px rgba(0,0,0,.25);
    color: red
}

.gathering .c-contact div.l-right-pane p {
    padding-right: 10px;
    font-size: 0.9em;
}


.gathering .l-p-right { padding-right: 20px; }
.gathering .l-p-left  { padding-left: 20px; }
.gathering .l-p-top   { padding-top:  20px; }
.gathering .l-p-bottom { padding-bottom: 20px; }
.gathering .f-green   { color: #1a814d; }


/* sms認証機能 */
.f-sms img.screen {
  display: block;
  margin: 0 auto;
}

.f-sms section.scene {
  margin: 40px 0 60px;
}

.f-sms section.scene h5 {
  border: transparent;
  font-size: 1.2rem;
  text-align: center;
  margin-bottom: 30px;
}

.f-sms .read {
  font-size: 1.0rem;
}

.f-sms .scene_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.f-sms .scene_wrap .scene_card {
  background-color: #F5F5F5;
  padding: 30px 20px;
  width: 280px;
}

.f-sms .scene_wrap .scene_card .text {
  font-size: 16px;
  line-height: 1.6;
  text-align: left;
  margin-top: 30px;
}

.f-sms .scene_wrap > p,
.f-sms .scene_wrap .scene_card > p {
  display: none;
}


/* WebFileにはppapのページ */
.ppap h5 {
 border: transparent; 
}

.ppap .read,
.ppap p.read {
  font-size: 16px;
  color: #000000;
}

.ppap_problem {
  margin-bottom: 40px;
}

.ppap .ppap_solve {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.ppap .ppap_solve.reverse {
  flex-direction: row-reverse;
}

.ppap .ppap_solve h5 {
  color: #00910D;
}

.ppap .ppap_solve .text {
  width: calc(100%/2);
}

.ppap .ppap_contact {
  background-color: #EBEBEB;
  font-weight: bold;
  font-size: 1.1rem;
  text-align: center;
  padding: 30px;
  line-height: 1.4;
  margin-bottom: 40px;
}

.ppap .ppap_contact a {
  background-color: #00910D;
  border: 1px solid #00910D;
  border-radius: 4px;
  color: #FFFFFF;
  text-decoration: none;
  padding: 10px 50px;
  margin-top: 20px;
  display: inline-block;
}

.ppap .ppap_contact a:hover {
  opacity: 0.4;
}

.ppap .ppap_solve .text a {
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
  color: #2262E0;
  margin-top: 20px;
}

/* 独自ドメイン切り替えフロー */
.domain_f .read {
  margin: 20px 0 40px;
}

.domain_f .flow_title {
  border: 3px solid #2CA2D8;
  border-radius: 4px;
  font-weight: bold;
  margin-bottom: 5px;
}

.domain_f .flow_title span {
  background: #2CA2D8;
  color: #FFF;
  display: inline-block;
  padding: 10px 14px;
  margin-right: 10px;
}

.domain_f .recommend_title {
  font-weight: bold;
  font-size: 1.2rem;
  margin-bottom: 19px;
}

.domain_f .recommend_title span {
  color: #2CA2D8;
}

.domain_f .domain_qa {
  border-bottom: 1px solid #707070;
  padding-bottom: 20px;
  margin-bottom: 15px;
}

.domain_f .domain_qa .qa_title::before {
  content: "Q.";
  display: inline-block;
  color: #2CA2D8;
  font-weight: bold;
  font-size: 20px;
  margin: 0 10px 15px 0;
}

.domain_f .domain_flex {
  display: flex;
  justify-content: space-between;
}

.domain_f .domain_qa .qa_a {
  justify-content: left;
}

.domain_f .domain_qa .qa_a div {
  color: #eb82a1;
  font-weight: bold;
  font-size: 20px;
  margin-right: 10px;
}

/* Images */
.entry-content img,
.comment-content img,
.widget img {
	max-width: 97.5%; /* Fluid images for posts, comments, and widgets */
}
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
	height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
img.size-full,
img.size-large {
	max-width: 97.5%;
	width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */
	height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
.entry-content img.wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}
img.alignleft,
img.alignright,
img.aligncenter {
	margin-bottom: 1.625em;
}
p img,
.wp-caption {
	margin-top: 0.4em;
}
.wp-caption {
	background: #eee;
	margin-bottom: 1.625em;
	max-width: 96%;
	padding: 9px;
}
.wp-caption img {
	display: block;
	margin: 0 auto;
	max-width: 98%;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	color: #666;
	font-family: Georgia, serif;
	font-size: 12px;
}
.wp-caption .wp-caption-text {
	margin-bottom: 0.6em;
	padding: 10px 0 5px 40px;
	position: relative;
}
.wp-caption .wp-caption-text:before {
	color: #666;
	content: '\2014';
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	margin-right: 5px;
	position: absolute;
	left: 10px;
	top: 7px;
}
#content .gallery {
	margin: 0 auto 1.625em;
}
#content .gallery a img {
	border: none;
}
img#wpstats {
	display: block;
	margin: 0 auto 1.625em;
}
#content .gallery-columns-4 .gallery-item {
	width: 23%;
	padding-right: 2%;
}
#content .gallery-columns-4 .gallery-item img {
	width: 100%;
	height: auto;
}

/* Image borders */
img[class*="align"],
img[class*="wp-image-"],
#content .gallery .gallery-icon img {/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
	border: 1px solid #ddd;
	padding: 6px;
}
.wp-caption img {
	border-color: #eee;
}
a:focus img[class*="align"],
a:hover img[class*="align"],
a:active img[class*="align"],
a:focus img[class*="wp-image-"],
a:hover img[class*="wp-image-"],
a:active img[class*="wp-image-"],
#content .gallery .gallery-icon a:focus img,
#content .gallery .gallery-icon a:hover img,
#content .gallery .gallery-icon a:active img {/* Add some useful style to those fancy borders for linked images ... */
	background: #eee;
	border-color: #bbb;
}
.wp-caption a:focus img,
.wp-caption a:active img,
.wp-caption a:hover img {/* ... including captioned images! */
	background: #fff;
	border-color: #ddd;
}

/* Make sure videos and embeds fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}
.entry-content .twitter-tweet-rendered {
	max-width: 100% !important; /* Override the Twitter embed fixed width */
}

/* Password Protected Posts */
.post-password-required .entry-header .comments-link {
	margin: 1.625em 0 0;
}
.post-password-required input[type=password] {
	margin: 0.8125em 0;
}
.post-password-required input[type=password]:focus {
	background: #f7f7f7;
}

/* Author Info */
#author-info {
	font-size: 12px;
	overflow: hidden;
}
.singular #author-info {
	background: #f9f9f9;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin: 2.2em -35.6% 0 -35.4%;
	padding: 20px 35.4%;
}
.archive #author-info {
	border-bottom: 1px solid #ddd;
	margin: 0 0 2.2em;
	padding: 0 0 2.2em;
}
#author-avatar {
	float: left;
	margin-right: -78px;
}
#author-avatar img {
	background: #fff;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 2px #bbb;
	-moz-box-shadow: 0 1px 2px #bbb;
	box-shadow: 0 1px 2px #bbb;
	padding: 3px;
}
#author-description {
	float: left;
	margin-left: 108px;
}
#author-description h2 {
	color: #000;
	font-size: 15px;
	font-weight: bold;
	margin: 5px 0 10px;
}

/* Comments link */
.entry-header .comments-link a {
	background: #eee url(images/comment-bubble.png) no-repeat;
	color: #666;
	font-size: 13px;
	font-weight: normal;
	line-height: 35px;
	overflow: hidden;
	padding: 0 0 0;
	position: absolute;
	top: 1.5em;
	right: 0;
	text-align: center;
	text-decoration: none;
	width: 43px;
	height: 36px;
}
.entry-header .comments-link a:hover,
.entry-header .comments-link a:focus,
.entry-header .comments-link a:active {
	background-color: #1982d1;
	color: #fff;
	color: rgba(255,255,255,0.8);
}
.entry-header .comments-link .leave-reply {
	visibility: hidden;
}

/*
Post Formats Headings
To hide the headings, display: none the ".entry-header .entry-format" selector,
and remove the padding rules below.
*/
.entry-header .entry-format {
	color: #666;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 2.6em;
	position: absolute;
	text-transform: uppercase;
	top: -5px;
}
.entry-header hgroup .entry-title {
	padding-top: 15px;
}
article.format-aside .entry-content,
article.format-link .entry-content,
article.format-status .entry-content {
	padding: 20px 0 0;
}
article.format-status .entry-content {
	min-height: 65px;
}
.recent-posts .entry-header .entry-format {
	display: none;
}
.recent-posts .entry-header hgroup .entry-title {
	padding-top: 0;
}

/* Singular content styles for Posts and Pages */
.singular .entry-header .entry-meta {
	position: absolute;
	top: 0;
	left: 0;
}
blockquote.pull {
	font-size: 21px;
	font-weight: bold;
	line-height: 1.6125em;
	margin: 0 0 1.625em;
	text-align: center;
}
.singular blockquote.pull {
	margin: 0 -22.25% 1.625em;
}
.pull.alignleft {
	margin: 0 1.625em 0 0;
	text-align: right;
}
.singular .pull.alignleft {
	margin: 0 1.625em 0 -22.25%;
}
.pull.alignright {
	margin: 0 0 0 1.625em;
	text-align: left;
}
blockquote.pull.alignleft,
blockquote.pull.alignright {
	width: 33%;
}
.singular .pull.alignright {
	margin: 0 -22.25% 0 1.625em;
}
.singular blockquote.pull.alignleft,
.singular blockquote.pull.alignright {
	width: 33%;
}
.singular .entry-meta .edit-link a {
	bottom: auto;
	left: 50px;
	position: absolute;
	right: auto;
	top: 80px;
}


/* =Aside
----------------------------------------------- */

.format-aside .entry-title,
.format-aside .entry-header .comments-link {
	display: none;
}
.singular .format-aside .entry-title {
	display: block;
}
.format-aside .entry-content {
	padding: 0;
}
.singular .format-aside .entry-content {
	padding: 1.625em 0 0;
}


/* =Link
----------------------------------------------- */

.format-link .entry-title,
.format-link .entry-header .comments-link {
	display: none;
}
.singular .format-link .entry-title {
	display: block;
}
.format-link .entry-content {
	padding: 0;
}
.singular .format-link .entry-content {
	padding: 1.625em 0 0;
}


/* =Gallery
----------------------------------------------- */

.format-gallery .gallery-thumb {
	float: left;
	display: block;
	margin: .375em 1.625em 0 0;
	max-width: 100%;
}


/* =Status
----------------------------------------------- */

.format-status .entry-title,
.format-status .entry-header .comments-link {
	display: none;
}
.singular .format-status .entry-title {
	display: block;
}
.format-status .entry-content {
	padding: 0;
}
.singular .format-status .entry-content {
	padding: 1.625em 0 0;
}
.format-status img.avatar {
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 2px #ccc;
	-moz-box-shadow: 0 1px 2px #ccc;
	box-shadow: 0 1px 2px #ccc;
	float: left;
	margin: 4px 10px 2px 0;
	padding: 0;
}


/* =Quote
----------------------------------------------- */

.format-quote blockquote {
	color: #555;
	font-size: 17px;
	margin: 0;
}


/* =Image
----------------------------------------------- */

.indexed.format-image .entry-header {
	min-height: 61px; /* Prevent the comment icon from colliding with the image when there is no title */
}
.indexed.format-image .entry-content {
	padding-top: 0.5em;
}
.indexed.format-image .entry-content p {
	margin: 1em 0;
}
.indexed.format-image .entry-content p:first-child,
.indexed.format-image .entry-content p:first-child a,
.indexed.format-image .entry-content p:first-child img {
	display: block;
	margin: 0;
}
.indexed.format-image .entry-content .wp-caption .wp-caption-text {
	margin: 0;
	padding-bottom: 1em;
}
.indexed.format-image footer.entry-meta {
	background: #ddd;
	overflow: hidden;
	padding: 4%;
	max-width: 96%;
}
.indexed.format-image div.entry-meta {
	display: inline-block;
	float: left;
	width: 35%;
}
.indexed.format-image div.entry-meta + div.entry-meta {
	float: none;
	width: 65%;
}
.indexed.format-image .entry-meta span.cat-links,
.indexed.format-image .entry-meta span.tag-links,
.indexed.format-image .entry-meta span.comments-link {
	display: block;
}
.indexed.format-image footer.entry-meta a {
	color: #444;
}
.indexed.format-image footer.entry-meta a:hover {
	color: #fff;
}
#content .indexed.format-image img {
	border: none;
	max-width: 100%;
	padding: 0;
}
.indexed.format-image .wp-caption {
	background: #111;
	margin-bottom: 0;
	max-width: 96%;
	padding: 2% 2% 0;
}
.indexed.format-image .wp-caption .wp-caption-text {
	color: #ddd;
}
.indexed.format-image .wp-caption .wp-caption-text:before {
	color: #444;
}
.indexed.format-image a:hover img {
	opacity: 0.8;
}


/* 404ページ
----------------------------------------------- */

#content-404{
  width:980px;
  background-color:#FFFFFF;
}

.area-404{ padding:50px;}

h2.title-404{
  background: url(images/title-404.gif) no-repeat top left scroll transparent;
  width:756px;
  height:64px;
  text-indent:-9999px;
  margin:0 auto;
  text-align:center;
}

.contents-404{
  margin-top:50px;
  line-height:150%;
}

h3.h3-title-404{
  font-size:1.4em;
  font-weight:bold;
  padding-bottom:10px;
}

h3.h3-title-404 a{ color:#000000;}

.glay-area{
  color:#838383;
  font-size:0.8em;
}

/* =Showcase
----------------------------------------------- */

h1.showcase-heading {
	color: #666;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 2.6em;
	text-transform: uppercase;
}

/* Intro */
article.intro {
	background: #f9f9f9;
	border-bottom: none;
	margin: -1.855em -8.9% 1.625em;
	padding: 0 8.9%;
}
article.intro .entry-title {
	display: none;
}
article.intro .entry-content {
	color: #111;
	font-size: 16px;
	padding: 1.625em 0 0.625em;
}
article.intro .edit-link a {
	background: #aaa;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #fff;
	font-size: 12px;
	padding: 0 8px;
	position: absolute;
	top: 30px;
	right: 20px;
	text-decoration: none;
}
article.intro .edit-link a:hover,
article.intro .edit-link a:focus,
article.intro .edit-link a:active {
	background: #777;
}

/* Featured post */
section.featured-post {
	float: left;
	margin: -1.625em -8.9% 1.625em;
	padding: 1.625em 8.9% 0;
	position: relative;
	width: 100%;
}
section.featured-post .hentry {
	border: none;
	color: #666;
	margin: 0;
}
section.featured-post .entry-meta {
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}

/* Small featured post */
section.featured-post .attachment-small-feature {
	float: right;
	height: auto;
	margin: 0 -8.9% 1.625em 0;
	max-width: 59%;
	position: relative;
	right: -15px;
}
section.featured-post.small {
	padding-top: 0;
}
section.featured-post .attachment-small-feature:hover,
section.featured-post .attachment-small-feature:focus,
section.featured-post .attachment-small-feature:active {
	opacity: .8;
}
article.feature-image.small {
	float: left;
	margin: 0 0 1.625em;
	width: 45%;
}
article.feature-image.small .entry-title {
	line-height: 1.2em;
}
article.feature-image.small .entry-summary {
	color: #555;
	font-size: 13px;
}
article.feature-image.small .entry-summary p a {
	background: #222;
	color: #eee;
	display: block;
	left: -23.8%;
	padding: 9px 26px 9px 85px;
	position: relative;
	text-decoration: none;
	top: 20px;
	width: 180px;
	z-index: 1;
}
article.feature-image.small .entry-summary p a:hover {
	background: #1982d1;
	color: #eee;
	color: rgba(255,255,255,0.8);
}

/* Large featured post */
section.feature-image.large {
	border: none;
	max-height: 288px;
	padding: 0;
	width: 100%;
}
section.feature-image.large .showcase-heading {
	display: none;
}
section.feature-image.large .hentry {
	border-bottom: none;
	left: 9%;
	margin: 1.625em 9% 0 0;
	position: absolute;
	top: 0;
}
article.feature-image.large .entry-title a {
	background: #222;
	background: rgba(0,0,0,0.8);
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #fff;
	display: inline-block;
	font-weight: 300;
	padding: .2em 20px;
}
section.feature-image.large:hover .entry-title a,
section.feature-image.large .entry-title:hover a {
	background: #eee;
	background: rgba(255,255,255,0.8);
	color: #222;
}
article.feature-image.large .entry-summary {
	display: none;
}
section.feature-image.large img {
	display: block;
	height: auto;
	max-width: 117.9%;
	padding: 0 0 6px;
}

/* Featured Slider */
.featured-posts {
	border-bottom: 1px solid #ddd;
	display: block;
	height: 328px;
	margin: 1.625em -8.9% 20px;
	max-width: 1000px;
	padding: 0;
	position: relative;
	overflow: hidden;
}
.featured-posts .showcase-heading {
	padding-left: 8.9%;
}
.featured-posts section.featured-post {
	background: #fff;
	height: 288px;
	left: 0;
	margin: 0;
	position: absolute;
	top: 30px;
	width: auto;
}
.featured-posts section.featured-post.large {
	max-width: 100%;
	overflow: hidden;
}
.featured-posts section.featured-post {
	-webkit-transition-duration: 200ms;
	-webkit-transition-property: opacity, visibility;
	-webkit-transition-timing-function: ease;
	-moz-transition-duration: 200ms;
	-moz-transition-property: opacity, visibility;
	-moz-transition-timing-function: ease;
}
.featured-posts section.featured-post {
	opacity: 0;
	visibility: hidden;
}
.featured-posts #featured-post-1 {
	opacity: 1;
	visibility: visible;
}
.featured-post .feature-text:after,
.featured-post .feature-image.small:after {
	content: ' ';
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
	width: 100%;
	height: 45px;
	position: absolute;
	top: 230px;
}
.featured-post .feature-image.small:after {
	top: 253px;
}
#content .feature-slider {
	top: 5px;
	right: 8.9%;
	overflow: visible;
	position: absolute;
}
.feature-slider ul {
	list-style-type: none;
	margin: 0;
}
.feature-slider li {
	float: left;
	margin: 0 6px;
}
.feature-slider a {
	background: #3c3c3c;
	background: rgba(60,60,60,0.9);
	-moz-border-radius: 12px;
	border-radius: 12px;
	-webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
	-moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
	box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
	display: block;
	width: 14px;
	height: 14px;
}
.feature-slider a.active {
	background: #1982d1;
	-webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
	-moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
	box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
	cursor: default;
	opacity: 0.5;
}

/* Recent Posts */
section.recent-posts {
	padding: 0 0 1.625em;
}
section.recent-posts .hentry {
	border: none;
	margin: 0;
}
section.recent-posts .other-recent-posts {
	border-bottom: 1px solid #ddd;
	list-style: none;
	margin: 0;
}
section.recent-posts .other-recent-posts li {
	padding: 0.3125em 0;
	position: relative;
}
section.recent-posts .other-recent-posts .entry-title {
	border-top: 1px solid #ddd;
	font-size: 17px;
}
section.recent-posts .other-recent-posts a[rel="bookmark"] {
	color: #373737;
	float: left;
	max-width: 84%;
}
section.recent-posts .other-recent-posts a[rel="bookmark"]:after {
	content: '-';
	color: transparent;
	font-size: 11px;
}
section.recent-posts .other-recent-posts a[rel="bookmark"]:hover {
}
section.recent-posts .other-recent-posts .comments-link a,
section.recent-posts .other-recent-posts .comments-link > span {
	border-bottom: 2px solid #999;
	bottom: -2px;
	color: #444;
	display: block;
	font-size: 10px;
	font-weight: 500;
	line-height: 2.76333em;
	padding: 0.3125em 0 0.3125em 1em;
	position: absolute;
	right: 0;
	text-align: right;
	text-transform: uppercase;
	z-index: 1;
}
section.recent-posts .other-recent-posts .comments-link > span {
	border-color: #bbb;
	color: #888;
}
section.recent-posts .other-recent-posts .comments-link a:hover {
	color: #1982d1;
	border-color: #1982d1;
}
section.recent-posts .other-recent-posts li:after {
	clear: both;
	content: '.';
	display: block;
	height: 0;
	visibility: hidden;
}


/* =Attachments
----------------------------------------------- */

.image-attachment div.attachment {
	background: #f9f9f9;
	border: 1px solid #ddd;
	border-width: 1px 0;
	margin: 0 -8.9% 1.625em;
	overflow: hidden;
	padding: 1.625em 1.625em 0;
	text-align: center;
}
.image-attachment div.attachment img {
	display: block;
	height: auto;
	margin: 0 auto 1.625em;
	max-width: 100%;
}
.image-attachment div.attachment a img {
	border-color: #f9f9f9;
}
.image-attachment div.attachment a:focus img,
.image-attachment div.attachment a:hover img,
.image-attachment div.attachment a:active img {
	border-color: #ddd;
	background: #fff;
}
.image-attachment .entry-caption p {
	font-size: 10px;
	letter-spacing: 0.1em;
	line-height: 2.6em;
	margin: 0 0 2.6em;
	text-transform: uppercase;
}


/* =Navigation
-------------------------------------------------------------- */

#nav-above {
	padding: 0 0 1.625em;
}
#nav-above {
	display: none;
}
.paged #nav-above {
	display: block;
}
.nav-previous {
	float: left;
	width: 50%;
}
.nav-next {
	float: right;
	text-align: right;
	width: 50%;
}
#content nav .meta-nav {
	font-weight: normal;
}

/* Singular navigation */
#nav-single {
	float: right;
	position: relative;
	top: -0.3em;
	text-align: right;
	z-index: 1;
}
#nav-single .nav-previous,
#nav-single .nav-next {
	width: auto;
}
#nav-single .nav-next {
	padding-left: .5em;
}
#nav-single .nav-previous {
	padding-right: .5em;
}


/* =Widgets
----------------------------------------------- */

.widget-area {
	font-size: 12px;
}
.widget {
	word-wrap: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
	clear: both;
	margin: 0 0 2.2em;
}
.widget-title {
	color: #666;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 2.6em;
	text-transform: uppercase;
}
.widget ul {
	font-size: 15px;
	margin: 0;
}
.widget ul ul {
	margin-left: 1.5em;
}
.widget ul li {
	color: #777;
	font-size: 13px;
}
.widget a {
	font-weight: bold;
	text-decoration: none;
}
.widget a:hover,
.widget a:focus,
.widget a:active {
	text-decoration: underline;
}

/* Search Widget */
.widget_search form {
	margin: 0 0 1.625em;
}
.widget_search #s{
	width: 77%;
}
.widget_search #searchsubmit {
	background: #ddd;
	border: 1px solid #ccc;
	-webkit-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
	-moz-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
	box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
	color: #888;
	font-size: 13px;
	line-height: 25px;
	position: relative;
	top: -2px;
}
.widget_search #searchsubmit:active {
	background: #1982d1;
	border-color: #0861a5;
	-webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
	box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
	color: #bfddf3;
}

/* Ephemera Widget */
section.ephemera ol,
.widget_twentyeleven_ephemera ol {
	list-style: square;
	margin: 5px 0 0;
}
.widget_twentyeleven_ephemera .widget-entry-title {
	font-size: 15px;
	font-weight: bold;
	padding: 0;
}
.widget_twentyeleven_ephemera .comments-link a,
.widget_twentyeleven_ephemera .comments-link > span {
	color: #666;
	display: block;
	font-size: 10px;
	font-weight: 500;
	line-height: 2.76333em;
	text-transform: uppercase;
}
section.ephemera .entry-title .comments-link a:hover,
.widget_twentyeleven_ephemera .entry-title .comments-link a:hover {
}
section.ephemera .entry-title a span {
	color: #29628d;
}

/* Twitter */
.widget_twitter li {
	list-style-type: none;
	margin-bottom: 14px;
}
.widget_twitter .timesince {
	display: block;
	font-size: 11px;
	margin-right: -10px;
	text-align: right;
}

/* Widget Image */
.widget_image img {
	border: 0;
	padding: 0;
	height: auto;
	max-width: 100%;
}

/* Calendar Widget */

.widget_calendar #wp-calendar {
	color: #555;
	width: 95%;
	text-align: center;
}
.widget_calendar #wp-calendar caption,
.widget_calendar #wp-calendar td,
.widget_calendar #wp-calendar th {
	text-align: center;
}
.widget_calendar #wp-calendar caption {
	font-size: 11px;
	font-weight: 500;
	padding: 5px 0 3px 0;
	text-transform: uppercase;
}
.widget_calendar #wp-calendar th {
	background: #f4f4f4;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-weight: bold;
}
.widget_calendar #wp-calendar tfoot td {
	background: #f4f4f4;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}


/* =Comments
----------------------------------------------- */

#comments-title {
	color: #666;
	font-size: 10px;
	font-weight: 500;
	line-height: 2.6em;
	padding: 0 0 2.6em;
	text-transform: uppercase;
}
.nopassword,
.nocomments {
	color: #aaa;
	font-size: 24px;
	font-weight: 100;
	margin: 26px 0;
	text-align: center;
}
.commentlist {
	list-style: none;
	margin: 0 auto;
	width: 68.9%;
}
.content .commentlist,
.page-template-sidebar-page-php .commentlist {
	width: 100%; /* reset the width for the one-column and sidebar page layout */
}
.commentlist > li.comment {
	background: #f6f6f6;
	border: 1px solid #ddd;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 0 0 1.625em;
	padding: 1.625em;
	position: relative;
}
.commentlist .pingback {
	margin: 0 0 1.625em;
	padding: 0 1.625em;
}
.commentlist .children {
	list-style: none;
	margin: 0;
}
.commentlist .children li.comment {
	background: #fff;
	border-left: 1px solid #ddd;
	-moz-border-radius: 0 3px 3px 0;
	border-radius: 0 3px 3px 0;
	margin: 1.625em 0 0;
	padding: 1.625em;
	position: relative;
}
.commentlist .children li.comment .fn {
	display: block;
}
.comment-meta .fn {
	font-style: normal;
}
.comment-meta {
	color: #666;
	font-size: 12px;
	line-height: 2.2em;
}
.commentlist .children li.comment .comment-meta {
	line-height: 1.625em;
	margin-left: 50px;
}
.commentlist .children li.comment .comment-content {
	margin: 1.625em 0 0;
	word-wrap: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
}
.comment-meta a {
	font-weight: bold;
}
.comment-meta a:focus,
.comment-meta a:active,
.comment-meta a:hover {
}
.commentlist .avatar {
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 2px #ccc;
	-moz-box-shadow: 0 1px 2px #ccc;
	box-shadow: 0 1px 2px #ccc;
	left: -102px;
	padding: 0;
	position: absolute;
	top: 0;
}
.commentlist > li:before {
	content: url(images/comment-arrow.png);
	left: -21px;
	position: absolute;
}
.commentlist > li.pingback:before {
	content: '';
}
.commentlist .children .avatar {
	background: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	left: 2.2em;
	padding: 0;
	top: 2.2em;
}
a.comment-reply-link {
	background: #eee;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #666;
	display: inline-block;
	font-size: 12px;
	padding: 0 8px;
	text-decoration: none;
}
a.comment-reply-link:hover,
a.comment-reply-link:focus,
a.comment-reply-link:active {
	background: #888;
	color: #fff;
}
a.comment-reply-link > span {
	display: inline-block;
	position: relative;
	top: -1px;
}

/* Post author highlighting */
.commentlist > li.bypostauthor {
	background: #ddd;
	border-color: #d3d3d3;
}
.commentlist > li.bypostauthor .comment-meta {
	color: #575757;
}
.commentlist > li.bypostauthor .comment-meta a:focus,
.commentlist > li.bypostauthor .comment-meta a:active,
.commentlist > li.bypostauthor .comment-meta a:hover {
}
.commentlist > li.bypostauthor:before {
	content: url(images/comment-arrow-bypostauthor.png);
}

/* Post Author threaded comments */
.commentlist .children > li.bypostauthor {
	background: #ddd;
	border-color: #d3d3d3;
}

/* sidebar-page.php comments */
/* Make sure we have room for our comment avatars */
.page-template-sidebar-page-php .commentlist > li.comment,
.page-template-sidebar-page-php.commentlist .pingback {
	margin-left: 102px;
	width: auto;
}
/* And a full-width comment form */
.page-template-sidebar-page-php #respond {
	width: auto;
}

/* Comment Form */
#respond {
	background: #ddd;
	border: 1px solid #d3d3d3;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto 1.625em;
	padding: 1.625em;
	position: relative;
	width: 68.9%;
}
#respond input[type="text"],
#respond textarea {
	background: #fff;
	border: 4px solid #eee;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: inset 0 1px 3px rgba(204,204,204,0.95);
	-moz-box-shadow: inset 0 1px 3px rgba(204,204,204,0.95);
	box-shadow: inset 0 1px 3px rgba(204,204,204,0.95);
	position: relative;
	padding: 10px;
	text-indent: 80px;
}
#respond .comment-form-author,
#respond .comment-form-email,
#respond .comment-form-url,
#respond .comment-form-comment {
	position: relative;
}
#respond .comment-form-author label,
#respond .comment-form-email label,
#respond .comment-form-url label,
#respond .comment-form-comment label {
	background: #eee;
	-webkit-box-shadow: 1px 2px 2px rgba(204,204,204,0.8);
	-moz-box-shadow: 1px 2px 2px rgba(204,204,204,0.8);
	box-shadow: 1px 2px 2px rgba(204,204,204,0.8);
	color: #555;
	display: inline-block;
	font-size: 13px;
	left: 4px;
	min-width: 60px;
	padding: 4px 10px;
	position: relative;
	top: 40px;
	z-index: 1;
}
#respond input[type="text"]:focus,
#respond textarea:focus {
	text-indent: 0;
	z-index: 1;
}
#respond textarea {
	resize: vertical;
	width: 95%;
}
#respond .comment-form-author .required,
#respond .comment-form-email .required {
	color: #bd3500;
	font-size: 22px;
	font-weight: bold;
	left: 75%;
	position: absolute;
	z-index: 1;
}
#respond .comment-notes,
#respond .logged-in-as {
	font-size: 13px;
}
#respond p {
	margin: 10px 0;
}
#respond .form-submit {
	float: right;
	margin: -20px 0 10px;
}
#respond input#submit {
	background: #222;
	border: none;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
	color: #eee;
	cursor: pointer;
	font-size: 15px;
	margin: 20px 0;
	padding: 5px 42px 5px 22px;
	position: relative;
	left: 30px;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
#respond input#submit:active {
	background: #1982d1;
	color: #bfddf3;
}
#respond #cancel-comment-reply-link {
	color: #666;
	margin-left: 10px;
	text-decoration: none;
}
#respond .logged-in-as a:hover,
#respond #cancel-comment-reply-link:hover {
	text-decoration: underline;
}
.commentlist #respond {
	margin: 1.625em 0 0;
	width: auto;
}
#reply-title {
	color: #373737;
	font-size: 24px;
	font-weight: bold;
	line-height: 30px;
}
#cancel-comment-reply-link {
	color: #888;
	display: block;
	font-size: 10px;
	font-weight: normal;
	line-height: 2.2em;
	letter-spacing: 0.05em;
	position: absolute;
	right: 1.625em;
	text-decoration: none;
	text-transform: uppercase;
	top: 1.1em;
}
#cancel-comment-reply-link:focus,
#cancel-comment-reply-link:active,
#cancel-comment-reply-link:hover {
	color: #ff4b33;
}
#respond label {
	line-height: 2.2em;
}
#respond input[type=text] {
	display: block;
	height: 24px;
	width: 75%;
}
#respond p {
	font-size: 12px;
}
p.comment-form-comment {
	margin: 0;
}
.form-allowed-tags {
	display: none;
}



/* =Responsive Structure
----------------------------------------------- */
@media (max-width: 1200px) {
  .wrap_main {
    background-size: cover;
  }

  #wf_main .c-flex_col,
  .top_point.c-flex_col {
    flex-direction: column;
  }

  .wrap_main .btn_main {
    margin: 0 auto 20px;
  }
  .btn_content {
      width: 300px;
  }

   .btn_top.top {
      height: 60px;
      width: 300px;
  }
  .top_point.c-flex_col {
    align-items: center;
  }

  .c-list_col2 {
    margin: 20px 0 20px;
  }

  .c-inner {
    padding: 0 10px;
  }

  .top_cta .c-title_large,
  .top_cta .c-title_small {
    margin-bottom: 30px;
  }

  #wf_customers img {
    width: 80%;
  }

}


@media (max-width: 800px) {
    #nav-below {
        border-bottom: 1px solid #ddd;
        margin-bottom: 1.625em;
    }
    #main #secondary {
        float: none;
        margin: 0 7.6%;
        width: auto;
    }

    /* Simplify the showcase template */
    .page-template-showcase-php .featured-posts {
        min-height: 280px;
    }
    .featured-posts section.featured-post {
        height: auto;
    }
    .page-template-showcase-php section.recent-posts {
        float: none;
        margin: 0;
        width: 100%;
    }
    .page-template-showcase-php #main .widget-area {
        float: none;
        margin: 0;
        width: auto;
    }
    .page-template-showcase-php .other-recent-posts {
        border-bottom: 1px solid #ddd;
    }
    /* Simplify the showcase template when small feature */
    section.featured-post .attachment-small-feature,
    .one-column section.featured-post .attachment-small-feature {
        border: none;
        display: block;
        float: left;
        height: auto;
        margin: 0.625em auto 1.025em;
        max-width: 30%;
        position: static;
    }
    article.feature-image.small {
        float: right;
        margin: 0 0 1.625em;
        width: 64%;
    }
    .one-column article.feature-image.small .entry-summary {
        height: auto;
    }
    article.feature-image.small .entry-summary p a {
        left: 0;
        padding-left: 20px;
        padding-right: 20px;
        width: auto;
    }
    /* Remove the margin on singular articles */
    .singular .entry-header,
    .singular .entry-content,
    .singular footer.entry-meta,
    .singular #comments-title {
        width: 100%;
    }
    /* Simplify the pullquotes and pull styles */
    .singular blockquote.pull {
        margin: 0 0 1.625em;
    }
    .singular .pull.alignleft {
        margin: 0 1.625em 0 0;
    }
    .singular .pull.alignright {
        margin: 0 0 0 1.625em;
    }
    .singular .entry-meta .edit-link a {
        left: 0;
        position: absolute;
        top: 40px;
    }
    .singular #author-info {
        margin: 2.2em -8.8% 0;
        padding: 20px 8.8%;
    }
    /* Make sure we have room for our comment avatars */
    .commentlist {
        width: 100%;
    }
    .commentlist > li.comment,
    .commentlist .pingback {
        margin-left: 102px;
        width: auto;
    }
    /* And a full-width comment form */
    #respond {
        width: auto;
    }
    /* No need to float footer widgets at this size */
    #colophon #supplementary .widget-area {
        float: none;
        margin-right: 0;
        width: auto;
    }
    /* No need to float 404 widgets at this size */
    .error404 #main .widget {
        float: none;
        margin-right: 0;
        width: auto;
    }

    .gathering .c-price table {
        display: table !important;
        width: 90%;
    }

    .gathering .c-price table td, .gathering .c-price table th {

    }

    /* 202104 */
    body#wf_top {
      min-width: auto;
    }

    #wf_about .c-flex_col,
    #wf_point .c-flex_col,
    #wf_sample .c-flex_col,
    #wf_case .c-flex_col,
    .func_list.c-flex_col {
      flex-direction: column;
    }

    .wrap_table {
      overflow-x: auto;
    }

    .wrap_table table {
      table-layout: fixed;
      width: 1000px !important;
      overflow-x: inherit;
      display: table;
    }

    #top_list .c-inner.medium {
      width: 80%;
    }

    #top_footer {
      padding: 0 20px;
    }

    #top_footer ul li {
      display: block;
      padding-bottom: 20px;
    }

    .set_800 {
      display: block;
    }

    .none_800 {
      display: none;
    }


    /* 800以下でハンバーガー表示 */
    #top_header {
      background: #FFFFFF;
      width: 100%;
      padding: 0 20px;
      box-sizing: border-box;
    }

    .menuHumburger {
      background: url(images/webfile/icon_menu.svg)no-repeat;
      display: block;
      background-size: cover;
      width: 30px;
      height: 25px;
    }

    .nav_list {
      display: none;
    }

    input.nav_800:checked ~ .menuHumburger {
      background: url(images/webfile/icon_close.svg)no-repeat;
      display: block;
      background-size: cover;
      width: 30px;
      height: 30px;
      z-index: 100;
    }

    input.nav_800:checked ~ .nav_list {
      display: block;
      width: 100%;
      background: #FFFFFF;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 99;
      opacity: 0.9;
    }

    .nav_list li {
      padding: 20px 30px;
    }

    .nav_list li a {
      color: #2ca2d8;
    }

    .c-list_col2,
    .c-list_col4 {
      width: 90%;
    }

    .c-top_card {
      margin-top: 40px;
    }

    .wf_about_body {
      width: auto;
    }

}
@media (max-width: 650px) {
    /* @media (max-width: 650px) Reduce font-sizes for better readability on smaller devices */
    body, input, textarea {
        font-size: 13px;
    }
    #site-title a {
        font-size: 24px;
    }
    #site-description {
        font-size: 12px;
    }
    #access ul {
        font-size: 12px;
    }
    article.intro .entry-content {
        font-size: 12px;
    }
    blockquote {
        margin: 0;
    }
    blockquote.pull {
        font-size: 17px;
    }
    /* Reposition the site title and description slightly */
    #site-title {
        padding: 5.30625em 0 0;
    }
    #site-title,
    #site-description {
        margin-right: 0;
    }
    /* Make sure the logo and search form don't collide */
    #branding #searchform {
        top: 1.625em !important;
    }
    /* Floated content doesn't work well at this size */
    .alignleft,
    .alignright {
        display: block;
        float: none;
        margin-left: 0;
        margin-right: 0;
    }
    /* Make sure the post-post navigation doesn't collide with anything */
    #nav-single {
        display: block;
        position: static;
    }
    .singular.page .hentry {
        padding: 1.625em 0 0;
    }
    /* Talking avatars take up too much room at this size */
    .commentlist > li.comment,
    .commentlist > li.pingback {
        margin-left: 0 !important;
    }
    .commentlist .avatar {
        background: transparent;
        display: block;
        padding: 0;
        position: static;
    }
    .commentlist .children .avatar {
        background: none;
        left: 2.2em;
        padding: 0;
        position: absolute;
        top: 2.2em;
    }
    /* Use the available space in the smaller comment form */
    #respond input[type="text"] {
        width: 95%;
    }
    #respond .comment-form-author .required,
    #respond .comment-form-email .required {
        left: 95%;
    }
    #content .gallery-columns-3 .gallery-item {
        width: 31%;
        padding-right: 2%;
    }
    #content .gallery-columns-3 .gallery-item img {
        width: 100%;
        height: auto;
    }

    .notice-question a { 
          display: block; 
      }

        /* 一時的なニュース */
        .topic-temporary {
            padding: 20px 0;
            font-size: 0.8em;
        }

        .topic-temporary > a {
            padding: 10px;
        }
    
        /* スライドショー
    -------------------------------------------------------------- */
    .slide-main{
      /* width:100%; */
      width: 300px;
      padding:15px 0px 0px;
    }

    .slides_container {
      /* width:100%;
      height:100%; */
      width: 300px;
      height: 150px;
      overflow:hidden;
      position:relative;
      display:none;
      margin:0 auto;
    }

    .slides_container a {
      width:100%;
      height:100%;
      display:block;
    }

    .slides_container a img {
      display:block;
      width:100%;
      /* height:100%; */
    }

    .slides_control{
      left:50% !important;
      margin-left:-150px;
    }

    .slides_control a {
      left:0 !important;
    }

    #slides .next,#slides .prev {
      display:block;
      z-index:101;
      cursor:pointer;
    }

    #slides .next {
      left:585px;
      _left:0px;
    }

    .btn-left{
      position:absolute;
      top:50%;
      z-index:102;
    }

    .btn-right{
      position:absolute;
      top:50%;
      z-index:102;
    }


    .pagination {
      width:100px;
      margin:10px auto 0px;
      padding-bottom:0px;
      padding-top:0px;
    }

    .pagination li {
      list-style:none;
      float:left;
      margin-left:10px;
    }

    .pagination li a{
      display:block;
      background-position:0 0;
      overflow:hidden;
      text-indent:-9999px;
      float:left;
      cursor:pointer;
      background: url(images/pagination.png) left top no-repeat;
      width:8px;
      height:8px;
      background-size: cover;
    }

    .pagination li.current a {
      background: url(images/pagination.png) 0px -8px no-repeat;
      background-size: cover;
    }

        /* 4.1紹介ページ
    -------------------------------------------------------------- */
    .bigWrap_410 {
        width: 95%;
        margin: 0 auto;
    }
    
    .ctaArea_mini_410 {
        display: inherit;
        text-align: center;
    }
    
    .dFlex {
        display: inherit;
    }
    
    .imgWrap_410 {
        display: none;
    }
    
    .titleWrap_mini_410 .right {
        width: inherit;
    }

    .read-text-410 {
        padding-right: 0;
    }

    /* 機能詳細 : 一斉収集ページ */
    .gathering { width: 96%; }
    .gathering .c-title {
        background-color: rgba(255,255,255,0.6);
    }
    
    .gathering .c-title div {
        width: 100%;
        padding: 0px;
    }

    .gathering .c-title p {
        font-size: 0.9em;
        text-align: left;
    }
    
    .gathering .l-horizontal {
        display: block;
        padding: 10px;
    }
    
    .gathering .l-horizontal section {
        width: auto;
        margin: 0px 20px 10px 20px;
    }

    .gathering .c-price table {
        width: 90% !important;

    }

    .gathering .c-contact .l-flex-item {
        width: 98%;
    }

    .ppap .ppap_solve {
      display: block;
    }

    .ppap .ppap_solve .text {
      width: auto;
    }

    .f-sms .scene_wrap {
      display: block;
    }

    .f-sms .scene_wrap .scene_card {
      margin: 10px auto;
    }

    #wf_case .c-top_card {
      width: 300px;
    }
}

@media (max-width: 450px) {
    #content .gallery-columns-2 .gallery-item {
        width: 45%;
        padding-right: 4%;
    }
    #content .gallery-columns-2 .gallery-item img {
        width: 100%;
        height: auto;
    }

    
    .notice-question a { 
          display: block; 
      }

    /* 202104 */
    #wf_about img, .img_point {
       width: 80%;
       margin: 0 auto;
       display: block;
    }

    .wf_about_body { width: auto; }

    .point_link {
      margin-bottom: 10px;
    }

    .top_cta .c-flex_col {
      flex-direction: column;
    }

    .btn_top.cta.white {
      margin-bottom: 10px;
    }

    #wf_price .btn_top_small {
      margin-bottom: 10px;
    }

    .c-top_card_body,
    .wf_about_body,
    .point_link,
    .func_list,
    #container_wf li,
    .btn_top.cta,
    .btn_top_small,
    .c-top_table,
    #top_news,
    #top_footer {
      font-size: 16px;
    }

    .top_cta .c-title_large,
    .top_cta .c-title_small,
    .wf_main_title {
      line-height: 1.2;
    }


}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
    body {
    padding: 0;
    }
    #page {
        margin-top: 0;
    }
    #branding {
        border-top: none;
    }

    #access {
         height: 60px;
     }
     #access li {
          width: 19%;
      } 
      #access li.li-max {
          width: 27% !important;
      } 
      .notice-question { 
          padding: 20px; 
      } 
      .notice-question a { 
          display: block; 
     }
     .function-up-flex {
         display: inherit;
     } 
     .function-up-card {
         width: inherit;
     }

     .set_320 { display: block; }
      
}


/* =Print
----------------------------------------------- */

@media print {
    body {
        background: none !important;
        font-size: 10pt;
    }
    footer.entry-meta a[rel=bookmark]:link:after,
    footer.entry-meta a[rel=bookmark]:visited:after {
        content: " [" attr(href) "] "; /* Show URLs */
    }
    #page {
        clear: both !important;
        display: block !important;
        float: none !important;
        max-width: 100%;
        position: relative !important;
    }
    #branding {
        border-top: none !important;
        padding: 0;
    }
    #branding hgroup {
        margin: 0;
    }
    #site-title a {
        font-size: 21pt;
    }
    #site-description {
        font-size: 10pt;
    }
    #branding #searchform {
        display: none;
    }
    #branding img {
        display: none;
    }
    #access {
        display: none;
    }
    #main {
        border-top: none;
        box-shadow: none;
    }
    #primary {
        float: left;
        margin: 0;
        width: 100%;
    }
.singular #content {
        margin: 0;
        width: 100%;
    }
    .singular .entry-header .entry-meta {
        position: static;
    }

    #content nav {
        display: none;
    }
    .singular .entry-header,
    .singular .entry-content,
    .singular footer.entry-meta,
    .singular #comments-title {
        margin: 0;
        width: 100%;
    }
    .entry-title,
    .singular .entry-title {
        font-size: 21pt;
    }
    .entry-meta {
        font-size: 10pt;
    }
    .entry-header .comments-link {
        display: none;
    }
    .page-link {
        display: none;
    }
    .singular #author-info {
        background: none;
        border-bottom: none;
        border-top: none;
        margin: 2.2em 0 0;
        padding: 0;
    }
    #respond {
        display: none;
    }
    .widget-area {
        display: none;
    }
    #colophon {
        display: none;
    }

    /* Comments */
    .commentlist > li.comment {
        background: none;
        border: 1px solid #ddd;
        -moz-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        margin: 0 auto 1.625em;
        padding: 1.625em;
        position: relative;
        width: auto;
    }
    .commentlist .avatar {
        height: 39px;
        left: 2.2em;
        top: 2.2em;
        width: 39px;
    }
    .commentlist li.comment .comment-meta {
        line-height: 1.625em;
        margin-left: 50px;
    }
    .commentlist li.comment .fn {
        display: block;
    }
    .commentlist li.comment .comment-content {
        margin: 1.625em 0 0;
    }
    .commentlist .comment-edit-link {
        display: none;
    }
    .commentlist > li::before,
    .commentlist > li.bypostauthor::before {
        content: '';
    }
    .commentlist .reply {
        display: none;
    }

    /* Post author highlighting */
    .commentlist > li.bypostauthor {
        color: #444;
    }
    .commentlist > li.bypostauthor .comment-meta {
        color: #666;
    }
    .commentlist > li.bypostauthor:before {
        content: none;
    }

    /* Post Author threaded comments */
    .commentlist .children > li.bypostauthor {
        background: #fff;
        border-color: #ddd;
    }
    .commentlist .children > li.bypostauthor > article,
    .commentlist .children > li.bypostauthor > article .comment-meta {
        color: #666;
    }

}


/* =IE7
----------------------------------------------- */

#ie7 article.intro {
    margin-left: -7.6%;
    margin-right: -7.6%;
    padding-left: -7.6%;
    padding-right: -7.6%;
    max-width: 1000px;
}
#ie7 section.featured-post {
    margin-left: -7.6%;
    margin-right: -7.6%;
    max-width: 850px;
}
#ie7 section.recent-posts {
    margin-right: 7.6%;
}

/* =IE8
----------------------------------------------- */

#ie8 section.feature-image.large img {
    width: 100%;
}


/* よく使う
----------------------------------------------- */
.clear{ clear:both;}
.cc{ text-align:center !important;}
.rr{ text-align:right;}
.fLeft{ float:left;}
.fRight{ float:right;}

.none{ display: none; }

.bold{ font-weight:bold;}
.blue{ color:#0861B2;}
.green{ color:#249809;}
.mgreen{ color:#249809;}
.orange{ color:#DB7D00;}
.error{ color:#EB1111;}
#error{ color:#EB1111;}

.marginTop10{ margin-top:10px !important;}
.marginTop12{ margin-top:12px !important;}
.marginTop20{ margin-top:20px !important;}
.marginTop30{ margin-top:30px;}
.marginBottom5{ margin-bottom:5px;}
.marginBottom20{ margin-bottom:20px;}
.marginBottom60 { margin-bottom: 60px; }
.marginLeft20{ margin-left:20px;}

.margin50{ margin: 50px 0; }

.height400{ height:400px;}

.lineHeight200{ line-height:200%;}
.lineHeight150{ line-height:150%;}

.vSub{ vertical-align:sub;}

.font-x-small{ font-size:x-small;}
.fSmall{ font-size:small;}
.font-13-em { font-size: 1.3em; }
.space-around { justify-content: space-around !important; }

.comment{
  font-size:small;
  margin-top:5px;
  margin-bottom:5px;
  line-height:140%;
}

.vm{ vertical-align:middle;}

.option{
  color:#747474;
  font-size:0.85em;
}

.center{
  width:980px;
  margin:0 auto;
}

.font-kiyaku{
  color:#5B5B5B;
  line-height:150%;
}

.dotbottom{
  border-bottom: 1px dotted #000000;
  padding-bottom:20px;
}

.btn-back {
  border-top:1px dotted #000000;
  font-family:"ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  font-weight:bold;
  text-align:right;
  font-size:0.8em;
  margin-top:40px;
  padding-top:15px;
}

.btn-back a{
  color:#000000;
  padding-left:10px;
  background:url(images/ico-ya.gif) no-repeat scroll left center #FFFFFF;
}

.btn-link{
  font-family:"ヒラギノ角ゴ Pro", Helvetica, Arial, sans-serif;
  font-weight:bold;
  text-align:right;
  font-size:1.0em;
  margin-top:20px;
}

.btn-link a{
  padding-left:10px;
  background:url(images/ico-ya.gif) no-repeat scroll left center #FFFFFF;
}

/* 上に戻る */
.backtop{
  width:980px;
  margin:0 auto;
}

.backtop a{
  background:url(images/webfile/btn-goback.gif) no-repeat scroll top right #FFFFFF;
  width:121px;
  height:28px;
  text-indent:-9999px;
  display:block;
  float:right;
}
/* News一覧へボタン */
.news-list-button {
    width: 100%;
    text-align: right;
    font-size: 0.8em;
    margin-top: 10px;
}

.news-list-button a {
    padding: 6px 10px;
}


/*===============================================
● 画面の横幅が320pxまで(スマートフォン)6
===============================================*/
@media screen and (min-width: 300px) and (max-width:479px){

  #branding hgroup {
    width:320px;
    margin:0 auto;
  }

  .submenu{
    width:320px;
    margin: 0 auto;
    margin-bottom:-1px;
  }

  /* 検索フォーム*/
  .header-right-area{
    display:none;
  }

  #page {
    margin: 0 auto;
    width: 320px;
  }

  #content{ background-color:#FFFFFF; }

  .eye-logo{
    background: url(images/title-eye-companylogo-3.gif) no-repeat scroll top left;
    height:250px;
    width:282px;
    text-indent:-9999px;
  }

  #sidebar{
   width:auto;
   float:none;     
  }
  .side-banner{
    width:auto;
    padding:30px;
  }

  .side-link-banner{
    width:auto;
    padding:30px;
  }

  .ptext{
    margin-top:5px;
    margin-left:5px;
    line-height:120%;
    float:left;
  }

  /* フッター */
  #colophon {
    /* margin-top: 50px; */
    line-height: 130%;
  }

  ul.mainLink li {
    float: none;
    height: auto;
    border-left:none;
  }

  ul.mainLink li.last{ border-right:none;}

  .footer-top{ width:320px;}

  .ohter-link{ width:320px;}

  /* 上に戻る */
  .backtop{
    width:320px;
    margin:0 auto;
  }

  .sub-link{
    display:block;
    line-height:130%;
  }

  .side-banner2{
    width:242px;
    margin:20px 30px;
  }


}


/* = max-width: 768px size 201504
----------------------------------------------- */
@media screen and (max-width:768px){

    #branding hgroup {width:auto}
    .footer-top {width:auto}
    body {min-width: 320px;}
    .header-right-area {display: none !important;}
    .wp_social_bookmarking_light  {display: none;}
    .wp_social_original {padding-top:10px !important}
    .center{width:100%;}
    #content{width:100%;font-size:1.2em !important;}
    #page {width: auto;}
    #page-wf h2 {margin-top: 20px}
    #page-wf h3 {margin-top: 20px}
    #page-wf {background: none; padding-top:0;}
    .lineup-entry-btn {padding: 20px 0;}

    #primary:after{
      content: "."; 
      display: block; 
      height: 0; 
      font-size:0;    
      clear: both; 
      visibility:hidden;
    }

    .wf-wrapper h3 {width:auto;}
    h3.title-h3-wf {
      background: none;
      font-weight:bold;
      padding:14px 0px 14px 10px;
      border-top:4px #cccccc solid;
      border-bottom:2px #cccccc dotted;
    }

    /* アイキャッチ内
    -------------------------------------------------------------- */

    .eye-catch{
      background: url(images/webfile/bg-eye.gif) repeat-x scroll top center;
      padding-top:25px;
      padding-bottom:12px;
      background-size: 100% 180px;
    }

    .main-eye {
      background-size: 100%;
      width: 100%;
    }

    /* トップトピック
    ----------------------------------------------- */

    .top-topic-area{
      width: auto;
      padding: 35px 35px 18px;
    }

    .topic{
      background: none;
      width:auto;
      height:300px;
    }

    .topic .fLeft{float:none;}

    .topic-title{
    /*  font-size:1.2em;*/
      font-weight:bold;
      color:#535353;
      margin-bottom:10px;
      width:auto;
      padding: 10px 0;
    }

    .topic-com-1{
    /*  width:auto;*/
      width:auto;
      background-position: top center;
      padding-left:0;
      padding-top:90px;
      margin-left:0;
      height:70px;
    }

    .topic-com-2{
    /*  width:auto;*/
      width:auto;
      background-position: top center;
      padding-left:0;
      padding-top:90px;
      margin-left:0;
      height:70px;
    }

    .topic-com-3{
    /*  width:auto;*/
      width:auto;
      background-position: top center;
      padding-left:0;
      padding-top:90px;
      margin-left:0;
      height:70px;
    }

    .topic-link{
      float:none;
      padding: 40px 0 20px 0;
    }

    .topic-link a{
      display:block;
      background: none;
      width:auto;
      height:15px;
      text-indent:0px;
    }

    /* 導入事例
    ----------------------------------------------- */
    .case-area {
      margin-left: 0!important;
      margin-right: 10px!important;
      width: auto;
    }

    .koyaku-data-text {
      width:auto !important;
    }
    .koyaku-data-img {
      float: none;
    }
    
    
    /* サイドバー
    ----------------------------------------------- */
    #sidebar {
      float:none;
      width: auto;
    }
    
    .side-banner {
      width: auto;
      padding: 0px 0px;
      margin: 0;
      float: left;
      display: block;
    }

    .basic-list {
      margin: 48px 30px;
      width: 227px;
    }

    .basic-list2{
      clear: both;
    }

    ul.lineup-list li.title {
        background: url(images/webfile/nav-side-lineup.gif) no-repeat -241px 0px transparent;
        margin: 0 30px;
        width: 242px;
    }

    ul.lineup-list li {
        display: block;
        margin: 0 30px;
    }

    #sidebar .read ul {
      margin-top: 0;
      list-style: none;
    }
    

    #sidebar .read  {
      float: left;
      display:block;
      margin-top: 0;
      width: 242px;
      clear: none !important;
    }

    .side-banner2 {
      width: 242px;
      padding: 20px 0px 0px;
      float: left;
    }
    
    
    /* 料金表
    ----------------------------------------------- */
    table {
      overflow-x: scroll !important;
      width: 85% !important;
      white-space: nowrap;
      display:block;
      margin: 0 auto
    }
    
    
    /* 上に戻る */
    .backtop{
      width: 90%;
      margin:0 auto;
    }

    /* 機能詳細:一斉収集 */
    .gathering .c-price table {
        display: table !important;
    }

    .gathering .notes {
        width: auto;
    }
}/* End 768 */



/* = max-width: 480px size 201504
----------------------------------------------- */
@media screen and  (max-width: 480px) {


    /* 画像動画
    ----------------------------------------------- */
    .main-wrapper2 img,
    .function-up-wrapper img {
        width: 100%;
        height: auto;
    }
    .main-wrapper2 img.vm {
        width: auto;
        height: auto;
    }

    /* アイキャッチ内
    -------------------------------------------------------------- */

    .eye-catch{
      background-size: cover;
    }

    .main-eye {
      background-size: contain;
      height: 60px;
    }

    .eye-nav ul{ list-style:none;}
    .eye-nav ul li{
      float:none;
    }

    .eye-nav ul li a{
      margin:0 auto;
      background-position: top center !important;
    }



    /* お知らせ
    ----------------------------------------------- */
    .news-main dt {float:none;}
    .news-main dd {
      padding-top: 7px;
      margin:auto;
      line-height:150%;
    }
    .news-main dl {
      margin:5px auto 15px auto;
      padding: 0;
    }

    /* 製品概要 WebFileのしくみ
    ----------------------------------------------- */
    .what-webfile{
      background:url(images/webfile/img-what-webfile.jpg) no-repeat scroll top left transparent;
      width: auto;
      height: auto;
      position: relative;
      margin-top:14px;
      margin-bottom:10px;
      -webkit-background-size: 100% auto;
           -o-background-size: 100% auto;
              background-size: 100% auto;
    }

    .what-webfile:before {
      content:"";
      display: block;
      padding-top:75%;
    }

    .what-webfile a{
      position: absolute;
      left: 0;
      top: 0;
    }

    .btn-admin,.btn-share,.btn-security,.btn-send,.btn-collect { /* webfileの仕組み 各種ボタン隠す */
      display:none;
    }

    /* 製品概要
    ----------------------------------------------- */
    .img-send, .img-collect, .img-security, .img-share, .img-admin {
      display: none;
    }

    .function-area {
      margin: 10px 0px 50px;
    }

    .title-send, .title-collect, .title-security, .title-share, .title-admin{
      float:none;
      height:75px;
    }

    /* 導入事例
    ----------------------------------------------- */
    .case-area {
      margin-left: 0!important;
      width: auto;
    }
  
    .koyaku-data-text {
      width:auto !important;
    }
    .koyaku-data-img {
      float: none;
    }

    /* 料金表
    ----------------------------------------------- */
    table {
      overflow-x: scroll !important;
      width: 320px !important;
      white-space: nowrap;
      display:block;
    }


    /* オプション料金テーブル
    ----------------------------------------------- */
    
    table.price_table-option{
      font-size: 100% !important;
    }
    
    table.price_table-option th{
      font-size: 80% !important;
    }
    table.price_table-option th div{
      font-size: 80% !important;
    }
    table.price_table-option td{
      font-size: 80% !important;
    }
    table.price_table-option td div{
      font-size: 80% !important;
    }

    .font-s-ex {
      font-size: 80% !important;
    }

    /* 料金
    ----------------------------------------------- */

    /* lite */
    .title-lite{
      background-size: 100%;
      height: 40px;
      width: 100%;
    }


    /* How to WebFile
    ----------------------------------------------- */
    ul.howtoList li a {
      white-space: normal;
    }

    /* ファイル共有のよくある間違い */
    .eye-sharesmistake-title{
      background: none;
      text-indent:0px;
      height:auto;
      border-top:4px solid #7C8891;
      margin-left:0px;
      padding:10px 5px;
      line-height: 150%;
      font-size: 1.3em;
      font-weight: bold;
    }

    /* 情報漏洩の原因から考える事故防止策と安全なファイル共有 */
    .eye-incidentsurvey-title{
      background: none;
      text-indent:0px;
      height:auto;
      border-top:4px solid #7C8891;
      margin-left:0px;
      padding:10px 5px;
      line-height: 150%;
      font-size: 1.3em;
      font-weight: bold;
    }

    /* 企業が恐れる情報漏えい事故を防ぐための多角的かつ多重なファイル送信セキュリティ */
    .eye-sendsecurity-title{
      background: none;
      text-indent:0px;
      height:auto;
      border-top:4px solid #7C8891;
      margin-left:0px;
      padding:10px 5px;
      line-height: 150%;
      font-size: 1.3em;
      font-weight: bold;
    }

    /* サイドバー
    ----------------------------------------------- */
    .side-banner {
      width: 242px;
      padding: 0px 0px;
      margin: 0 auto;
      float: none;
      display: block;
    }

    .basic-list {
      margin: 48px 30px;
      width: 227px;
    }

    .basic-list2{
      clear: both;
    }

    ul.lineup-list {
      width: 242px;
      margin: 0 auto;
    }
    
    ul.lineup-list li.title {
        background: url(images/webfile/nav-side-lineup.gif) no-repeat -241px 0px transparent;
        margin: 0 auto;
        width: 242px;
    }

    ul.lineup-list li {
        display: block;
        margin: 0 auto;
    }

    #sidebar .read {
      margin: 30px auto;
      float: none;
      display: block;
      width: 242px;
      clear: none !important;
    }
    
    .side-banner2 {
      margin: 30px auto;
      float: none;
      display: block;
    }
    

}/* End 480 */

/* トップページリライトによる整形-2024/03/15-
----------------------------------------------- */
.m-copy-add .wf_main_title { font-feature-settings:"palt"; padding:0px 20px; }
.m-copy-add .wrap_main { background:url(images/webfile/wf_topmv_pc.webp)no-repeat right #c8e1f1; background-size:contain; }
.m-copy-add #wf_main { padding:10px 0 50px; }
.m-copy-add .cta-area { background:rgba(255,255,255,0.5); padding:30px 0px; border-radius:2%; align-items:center; justify-content:center; box-shadow:0px 5px 15px 0px rgba(0, 0, 0, 0.15); }
.m-copy-add a.cta_alink { text-decoration-color:#2e89d0; }
.m-copy-add a.cta_alink:hover { text-decoration-color:#c6e6ff; }
.m-copy-add .cta_alink span { color:#2e89d0; font-size:180%; font-weight:bold; }
.m-copy-add .a-white, .a-blue { justify-content:center; align-items:center; text-decoration:none; box-shadow:0px 5px 15px 0px rgba(0, 0, 0, 0.15); position:relative; text-decoration:none; text-align:center; }
.m-copy-add .a-white::after, .a-blue::after { content:''; position:absolute; top:0; bottom:0; right:15px; width:9px; height:9px; margin:auto; transform:rotate(45deg); box-sizing:border-box; }
.m-copy-add .a-white::after { border-top:2px solid #fff; border-right:2px solid #fff; }
.m-copy-add .a-blue::after { border-top:2px solid #2e89d0; border-right:2px solid #2e89d0; }
.m-copy-add .btn_top.key { background:#e78d00; border:2px solid #e78d00; }
.m-copy-add p.m-copy-t { color:#232323; font-size:100%; padding:0px 0px 5px; }
.m-copy-add p.m-copy-b { color:#232323; font-size:90%; padding:10px 0px 20px; }
.m-copy-add .c-space50 { padding:50px; }
.m-copy-add .B-copy { clear:both; font-weight:bold; text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF, -2px 2px 0 #FFF, 2px -2px 0 #FFF, 0px 2px 0 #FFF,  0-2px 0 #FFF, -2px 0 0 #FFF, 2px 0 0 #FFF; padding-top:27%; padding-right:3%; }
.m-copy-add .B-copy h3 { width:100%; font-size:320%; background:linear-gradient(transparent 70% , #2e89d0 70%); }
.m-copy-add .B-copy ul { width:100%; height:auto; justify-content:center; display:flex; flex-wrap:wrap; padding:20px 0 10px; }
.m-copy-add .B-copy li { width:50%; display:flex; align-items:center; padding:0 0 0px; }
.m-copy-add .B-copy li img { padding-right:10px; }
.m-copy-add .c-top_card_body p { font-size:100%; color:#232323; }
.m-copy-add .btn_top_small { background-color:#2e89d0; border:1px solid #2e89d0; border-radius:10px; color:#FFFFFF; font-weight:bold; width:220px; height:60px; display:flex; justify-content:center; align-items:center; text-decoration:none; box-shadow:0px 5px 15px 0px rgba(0, 0, 0, 0.15); position:relative; text-decoration:none; text-align:center; }
.m-copy-add .btn_top_small::after { content:''; position:absolute; top:0; bottom:0; right:15px; width:9px; height:9px; margin:auto; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg); box-sizing:border-box; }
.m-copy-add .c-copy { width:80%; margin:0 auto; padding:0 0 30px; }
.m-copy-add .c-copy h3 { width:100%; position:relative; padding:1.5rem 1rem 1.3rem 1rem; border-radius:50px; background-color:#dd658a; color:white; font-weight:bold; font-size:200%; text-align:center; line-height:130%; font-feature-settings:"palt"; }
.m-copy-add .c-copy h3:before { position:absolute; top:100%; left:50%; height:0; width:0; border-style:solid; border-color:transparent; border-top-color:#dd658a; border-width:8px; content:""; }
.m-copy-add .point_number { width:140px; position:relative; padding:1rem 1rem 0.8rem 0.5rem; border-radius:50px; background-color:#dd658a; color:white; font-weight:bold; font-size:130%; text-align:center; }
.m-copy-add .point_number:before { position:absolute; top:100%; left:30px; height:0; width:0; border-style:solid; border-color:transparent; border-top-color:#dd658a; border-width:8px; content:""; }
.m-copy-add .c-text_primary { color:#dd658a; }
.m-copy-add .pageArea { display:flex; background:none; box-shadow:none; padding:0; letter-spacing:0.02em; }
.m-copy-add .pageArea .m-b0 { margin-bottom:10px; }
.m-copy-add .pageArea p { color:#fff; }
.m-copy-add .pageArea div { padding:10px 10px 20px; }
.m-copy-add .pageArea .btn_content { padding:30px 0px; }
.m-copy-add .pageArea .m-copy-b { padding:0; margin:0; }
.m-copy-add .point-cmark { position:relative; padding:10px 0px 10px 2em; margin:20px 0px 0px; font-size:110%; color:#232323; border-bottom:none; }
.m-copy-add .point-cmark::before, .point-cmark::after { position:absolute; top:50%; height:1em; content:""; }
.m-copy-add .point-cmark::before { left:0px; transform:translateY(-50%); width:1em; border:1px solid #2e89d0; }
.m-copy-add .point-cmark::after { left:0.5em; transform:translateY(-75%) rotate(45deg); width:0.5em; border-bottom:3px solid #e78d00; border-right:3px solid #e78d00; }
.m-copy-add #wf_about h3 { font-size:170%; font-weight:bold; text-align:center; padding:0 0 20px; }
.m-copy-add .point_link { position:relative; color:#2e89d0; padding-right:15px; border-bottom:2px solid #2e89d0; margin-bottom:15px; }
.m-copy-add .point_link::before, .point_link::after { content:""; width:10px; height:2px; display:inline-block; border-radius:2px; background:#2e89d0; position:absolute; right:0px; }
.m-copy-add .point_link::before { top:calc(35% - 2px); transform:rotate(45deg); }
.m-copy-add .point_link::after { bottom:calc(50% - 2px); transform:rotate(-45deg); }
@media (max-width:1200px) {
  .m-copy-add .wrap_main { background:url(images/webfile/wf_topmv_mb.webp)no-repeat center #c8e1f1; background-size:cover; }
  .m-copy-add .wf_main_title { padding:0px 10px; }
  .m-copy-add p.m-copy-b { padding:0px 0px 20px; }
  .m-copy-add .cta-area { background:rgba(255,255,255,0.9); }
  .m-copy-add .B-copy {  padding-top:10%; padding-right:0%; }
  .m-copy-add .pageArea { background:none; }
  .m-copy-add .point-cmark { font-size:120%; }
}
@media screen and (max-width:768px){
  .m-copy-add #wf_main { padding:35px 0 20px; }
  .m-copy-add p.m-copy-t { font-size:130%;}
  .m-copy-add p.m-copy-b { font-size:110%; margin-top:0; }
  .m-copy-add .c-copy { width:90%; padding:0; margin:0 auto; }
  .m-copy-add .c-copy h3 { font-size:150%; padding:1rem 0rem 1rem 0rem; line-height:160%; letter-spacing:0.05em; }
  .m-copy-add .B-copy h3 { font-size:300%; }
  .m-copy-add .pageArea { display:block; }
  .m-copy-add .btn_top_small { font-weight:bold; width:300px; height:60px; font-size:110%; margin-bottom:10px; }
  .m-copy-add #wf_about h3 { font-size:180%; line-height:140%; padding:0; }
  .m-copy-add .wf_about_title { font-size:140%; }
  .m-copy-add .c-space100 { padding:0px 0 0px; }
  .m-copy-add .c-space80 { padding:40px 0 20px; }
  .m-copy-add .c-space50 { padding:50px 0px; }
  .m-copy-add .img_point { padding:0; margin:0; }
  .wf_main_title { font-size:300%; margin:0 15px 25px; letter-spacing:0.05em; }
  .m-copy-add  .c-title_medium { font-size:150%; }
  .m-copy-add .c-title_large { letter-spacing:0.05em; line-height:140%; }
  .m-copy-add .C-pd0 .c-flex_col { padding-bottom:25px; }
  .m-copy-add .top_point h4 { font-size:190%; }
  .m-copy-add .pageArea { background:none; }
  .m-copy-add .point-cmark { font-size:110%; }
  .m-copy-add a.point_link { font-size:100%; }
  .m-copy-add #wf_price { padding-top:40px; padding-bottom:30px; }
  .m-copy-add #wf_price table.c-top_table th { font-size:160%; height:auto; padding:20px 0px; }
  .m-copy-add #wf_price table.c-top_table td { font-size:100%; height:auto; padding:20px 15px; }
  .m-copy-add .btn_top_small { margin-top:20px; font-size:130%; }
  .m-copy-add .c-top_card_body { margin-bottom:0; }
  .m-copy-add h3.marginBottom60 { margin-bottom:0; }
  .m-copy-add .top_cta { padding:40px 0 40px; }
  .m-copy-add #wf_point .c-list_col4 { display:flex; }
  .m-copy-add #wf_point .c-list_col4 img { padding:0 20px 0px 10px; }
  .m-copy-add #wf_point .c-title_small { text-align:left; }
  .m-copy-add #wf_point .c-top_card img { width:15%; }
  .m-copy-add #wf_point .c-top_card_title { clear:both; width:100%; }
  .m-copy-add #wf_case { padding-top:40px; padding-bottom:30px; }
  .m-copy-add #wf_case img { width:50%; }
  .m-copy-add #wf_customers img { width:100%; }
  .m-copy-add #top_news { padding:20px 0 30px; }
  .m-copy-add #top_news dt { padding-bottom:5px; }
  .m-copy-add #top_news dd { line-height:140%; }
  #top_footer .c-space80 { padding-top:30px; }
}