@charset "UTF-8";
@media screen and (min-width: 768px),print {
.cc-ttl-01 {  }

/*----------------------------------------- h2 画像 ------------------------------------------*/
  .cc-ttl-Box-01 { background: url('../images/case_newly/h2.jpg') top center no-repeat , url('../images/index/h-bg.jpg') top center ; }
  /* PC用 共通して使える -------------------------------------*/
  /* case_newly -------------------------------------*/
  #case_newly .Box { width: 800px; margin-left: auto; margin-right: auto; padding: 20px 15px; background: url('../images/case_newly/case-bg.jpg') top center; }
  #case_newly .system-list { margin-bottom: 0px; }
  #case_newly .system-list a:hover { text-decoration: none; }
  #case_newly .system-list a:hover .system-ttl { text-decoration: underline; }
  #case_newly .system-list li { width: 240px; margin-right: 20px; margin-bottom: 30px; float: left; background: #fff; padding: 20px 10px; }
  #case_newly .system-list li:nth-child(3n) { margin-right: 0; }
  #case_newly .system-list .system-pic { width: 220px; height: 165px; margin-bottom: 12px; }
  #case_newly .system-list .system-pic img { width: 220px; height: 165px; }
  #case_newly .system-list .system-pic:hover { -ms-filter: "alpha( opacity=80 )"; filter: alpha(opacity=80); opacity: 0.8; }
  #case_newly .system-list .system-customer { color: #333; }
  #case_newly .system-list .system-customer .system-area { display: inline-block; margin-right: 1em; padding-left: 1.3em; text-indent: -1.3em; margin-bottom: 4px; }
  #case_newly .system-list .system-customer .system-name { display: inline-block; margin-bottom: 4px; }
  #case_newly .system-list .system-ttl { color: #010000; font-size: 14px; line-height: 1.85; margin-bottom: 65px; }
  /* case_newly-dl(詳細) -------------------------------------*/
  #case_newly-dl .Box { width: 800px; margin-left: auto; margin-right: auto; text-align: left; background-color: #dcdddd; padding: 20px; }
  #case_newly-dl .Box .ttl { text-align: center; margin-bottom: 16px; }
  #case_newly-dl .Box .color-Box { background-color: #fff; padding: 40px 20px ; }
  #case_newly-dl .Box .system-customer { font-family: Meiryo; color: #333; font-size: 18px; margin-bottom: 3px; }
  #case_newly-dl .Box .system-customer .system-area { display: inline-block; margin-right: 1em; padding-left: 1.3em; text-indent: -1.3em; margin-bottom: 4px; }
  #case_newly-dl .Box .system-customer .system-name { display: inline-block; margin-bottom: 4px; }
  #case_newly-dl .Box .sis-pic { max-width: 720px; max-height: 480px; text-align: center; }
  #case_newly-dl .Box .sis-pic img{ width: auto; max-height: 480px; }
  #case_newly-dl .Box .ttl-02 { color: #000000; font-size: 20px; font-weight: 700; line-height: 40px; padding-bottom: 16px; margin-bottom: 32px; border-bottom: 7px solid #dcdddd; }
  #case_newly-dl .Box .system-date { color: #44a3b8; font-size: 18px; }
  #case_newly-dl .wysiwyg { margin-top: 32px; }
  #case_newly-dl .gallery-Box { margin: 60px auto 0;  background: #eeefef; text-align: center; padding: 25px 20px; }
  #case_newly-dl .gallery-Box h6{ margin-bottom: 20px; }
  #case_newly-dl .gallery-Box li { float: left; width: 150px; overflow: hidden; margin-right: 20px; margin-bottom: 40px; }
  #case_newly-dl .gallery-Box li:nth-child(4n) { margin-right: 0; }
  #case_newly-dl .gallery-Box li .pic { width: 150px; height: 100px; margin-bottom: .4em; overflow: hidden;}
  #case_newly-dl .gallery-Box li .pic:hover { -ms-filter: "alpha( opacity=80 )"; filter: alpha(opacity=80); opacity: 0.8; }
  #case_newly-dl .gallery-Box li .pic img { width: 150px; height: 100px; }
  #case_newly-dl .gallery-Box li .txt { color: #383231; font-size: 14px; line-height: 1.85; } }
@media screen and (max-width: 767px) { /* SP用 共通して使える -------------------------------------*/
  /* case_newly -------------------------------------*/
  #case_newly .Box { width: 90%; margin: 10% auto; }
  #case_newly .system-list { margin-bottom: -6%; }
  #case_newly .system-list a:hover { text-decoration: none; }
  #case_newly .system-list a:hover .system-ttl { text-decoration: underline; }
  #case_newly .system-list li { width: 47%; margin-right: 6%; margin-bottom: 6%;  }
  #case_newly .system-list li:nth-child(2n) { margin-right: 0; }
  #case_newly .system-list .system-pic { height: 112px; margin-bottom: 4%; text-align: center; }
  #case_newly .system-list .system-pic img { height: 112px; width: 100%;  }
  #case_newly .system-list .system-pic:hover { -ms-filter: "alpha( opacity=80 )"; filter: alpha(opacity=80); opacity: 0.8; }
  #case_newly .system-list .system-customer { color: #333; font-size: 1.3rem; }
  #case_newly .system-list .system-customer .system-area { display: inline-block; margin-right: 1em; padding-left: 1.3em; text-indent: -1.3em; margin-bottom: 4px; }
  #case_newly .system-list .system-customer .system-area:before { content: "■"; margin-right: .3em; }
  #case_newly .system-list .system-customer .system-name { display: inline-block; margin-bottom: 4px; }
  #case_newly .system-list .system-ttl { color: #010000; font-size: 1.4rem; line-height: 1.65; }

  /* case_newly-dl(詳細) -------------------------------------*/
  #case_newly-dl .Box { width: 100%; margin-left: auto; margin-right: auto; background-color: #dcdddd; padding: 5% 3% 7%; }
  #case_newly-dl .Box .ttl { text-align: center; margin-bottom: 5%; width: 40%; margin-left: auto; margin-right: auto; }
  #case_newly-dl .Box .color-Box { background-color: #fff; padding: 6% 3% 8%; }
  #case_newly-dl .Box .system-customer { font-family: Meiryo; color: #333; font-size: 1.8rem; }
  #case_newly-dl .Box .system-customer .system-area { display: inline-block; margin-right: 1em; padding-left: 1.3em; text-indent: -1.3em; margin-bottom: 4px; }
  #case_newly-dl .Box .system-customer .system-area:before { content: "■"; margin-right: .3em; }
  #case_newly-dl .Box .system-customer .system-name { display: inline-block; margin-bottom: 4px; }
  #case_newly-dl .Box .ttl-02 { color: #000000; font-size: 1.8rem; font-weight: 700; padding-bottom: 6%; margin-bottom: 7%; border-bottom: 5px solid #dcdddd; line-height: 1.85; }
  #case_newly-dl .Box .system-date { color: #44a3b8; font-size: 18px; }
  #case_newly-dl .Box .system-date:before { content: "■"; margin-right: .3em; }
  #case_newly-dl .wysiwyg { margin-top: 6%; }
  #case_newly-dl .gallery-Box { margin-top: 12%; margin-bottom: -5%; }
  #case_newly-dl .gallery-Box h6{ width: 100%; margin:0 auto 7%;  }
  #case_newly-dl .gallery-Box h6 img{ width: 100%; }
  #case_newly-dl .gallery-Box li { width: 47.5%; margin-right: 5%; margin-bottom: 5%; background: #fff; }
  #case_newly-dl .gallery-Box li:nth-child(even) { margin-right: 0; }
  #case_newly-dl .gallery-Box li .pic { height: 100px; margin-bottom: .4em; width: 100%; }
  #case_newly-dl .gallery-Box li .pic:hover { -ms-filter: "alpha( opacity=80 )"; filter: alpha(opacity=80); opacity: 0.8; }
  #case_newly-dl .gallery-Box li .pic img { height: 100px; width: 100%; }
  #case_newly-dl .gallery-Box li .txt { color: #383231; font-size: 1.2rem; line-height: 1.65; } }