@charset "utf-8";


/************************************
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
************************************/

/*要素のフォントサイズやマージン・パディングをリセットしています*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/*行の高さをフォントサイズと同じにしています*/
body {
    line-height:1;
}

/*新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています*/
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

/*nav要素内ulのマーカー（行頭記号）を表示しないようにしています*/
nav ul {
    list-style:none;
}

/*引用符の表示が出ないようにしています*/
blockquote, q {
    quotes:none;
}

/*blockquote要素、q要素の前後にコンテンツを追加しないように指定しています*/
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

/*a要素のフォントサイズなどをリセットしフォントの縦方向の揃え位置を親要素のベースラインに揃えるようにしています*/
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* ins要素のデフォルトをセットし、色を変える場合はここで変更できるようにしています */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* mark要素のデフォルトをセットし、色やフォントスタイルを変える場合はここで変更できるようにしています
また、mark要素とは、文書内の検索結果で該当するフレーズをハイライトして、目立たせる際に使用するようです。*/
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

/*テキストに打ち消し線が付くようにしています*/
del {
    text-decoration: line-through;
}

/*IEではデフォルトで点線を下線表示する設定ではないので、下線がつくようにしています
また、マウスオーバー時にヘルプカーソルの表示が出るようにしています*/
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

/*隣接するセルのボーダーを重ねて表示し、間隔を0に指定しています*/
table {
    border-collapse:collapse;
    border-spacing:0;
}

/*水平罫線のデフォルトである立体的な罫線を見えなくしています*/
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

/*縦方向の揃え位置を中央揃えに指定しています*/
input, select {
    vertical-align:middle;
}

/*画像を縦に並べたときに余白が出てしまわないように*/
img {
　　　vertical-align: top;
　　　font-size:0;
　　　line-height: 0;
}

/************************************
End: html5doctor.com Reset Stylesheet
*************************************/

* {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;
  letter-spacing: 1px;
  line-height: 1.8em;
  color: #333;
}
body{
  background-color:#231815;
  -webkit-text-size-adjust: 100%;/*文字サイズの自動調整をオフ*/
  overflow: hidden;
}
html {
  overflow: auto;
  height: 100%;
}

.alt {
  text-indent: -9999px;
  font-size: 0px;
  line-height: 0;
}
.clear {
  clear: both;
}
.center {
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
}
.clear {
  clear:both;
}

.clearfix:after {  
    content: ".";  
     display: block;       
   visibility: hidden;  
    height: 0.1px;  
    font-size: 0.1em;  
     line-height: 0;  
   clear: both;  
 }

.shadow {
  -webkit-box-shadow:0px 0px 10px 0px #999; /* Safari, Chrome逕ｨ */
  -moz-box-shadow:0px 0px 10px 0px #999; /* Firefox逕ｨ */
  box-shadow:0px 0px 10px 0px #999; /* CSS3 */
}

.blackshadow {
  -webkit-box-shadow:0px 0px 10px 0px #333; /* Safari, Chrome逕ｨ */
  -moz-box-shadow:0px 0px 10px 0px #333; /* Firefox逕ｨ */
  box-shadow:0px 0px 10px 0px #333; /* CSS3 */
}

.smallround {
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  border-top-right-radius: 4px;
  -webkit-border-top-left-radius: 4px;
  -moz-border-radius-topleft: 4px;
  border-top-left-radius: 4px;  
  -webkit-border-bottom-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-bottom-left-radius: 4px;
}
div{box-sizing: border-box;}


div.wrapper{
  width:100%;
  background: #fff;
  /*overflow:hidden visible;*/
}

div.container{
  width:100%;
  max-width: 980px;
  position: relative;
  margin-right: auto;
  margin-left: auto;
}

div.dblWrapper{}
div.dblWrapper div.left{
  float: left;
}
div.dblWrapper div.right{
  float: right;
}

@media screen and (max-width: 479px) {
  br.show_sm{display: inline-block;}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
  br.show_sm{display: none;}
}

@media screen and (min-width: 768px){
   br.show_sm{display: none;}
}

a:hover{
  color: #009FE8;
}

/*
lozad animations
*/

.lozad{
  opacity: 0;
}

.fade {
  animation-name: fade;
  animation-duration: 1s;
}

@keyframes fade {
  from {
    opacity: 0;

  }
  to {
    opacity: 1;

  }
}/*fade*/

.fadeUp {
  animation-name: fadeUp;
  animation-duration: 1s;
}

@keyframes fadeUp {
  from {
    position: relative;
    top:20px;
    opacity: 0;

  }
  to {
    position: relative;
    top:0px;
    opacity: 1;

  }
}/*fadeUp*/

.fadeDown {
  animation-name: fadeDown;
  animation-duration: 1s;
}

@keyframes fadeDown {
  from {
    position: relative;
    top:-20px;
    opacity: 0;

  }
  to {
    position: relative;
    top:0px;
    opacity: 1;

  }
}/*fadeDown*/

.gradient_blue {
  background: linear-gradient(70deg, #00B0E3, #94C465);
}

/*/////// HEADER AREA /////////////*/

div.headerArea{
}
div.header{
  position: relative;
  height:120px;
}
a.logo_sp{
  display: none;
  width:266px;
  position: relative;
  top:10px;
  left:15px;
}
a.logo{
  display: block;
  width:160px;
  position: relative;
  top:17px;
  left:15px;
}
a.logo img{
  width:100%;
}
a.headerTel{
  width:180px;
  position: absolute;
  top:10px;
  right:200px;
}
a.headerFormLink{
  display: inline-block;
  padding:8px 23px;
  border-radius: 45px;
  color: white;
  text-decoration: none;
  position: absolute;
  top:14px;right:8px;
  box-sizing: border-box;
  font-size: 72%;
  font-weight: bold;
}
a.headerFormLink:hover{
  background:none;
  background-color: #000;
}
a.headerFormLink span{
  display: inline-block;
  width:20px;
  margin-right:8px;
  position: relative;
  top:4px;
}
a.headerFormLink span img{
  width: 100%;
}
ul.mainmenu{
  list-style: none;
  position: absolute;
  right:10px;
  bottom:10px;
}
ul.mainmenu li{
  display: inline-block;
  border-right: #DBDAD9 solid 1px;
  min-height: 45px;
  vertical-align: bottom;
}
ul.mainmenu li:last-child{
  border:none;
}
ul.mainmenu li a{
  display: inline-block;
  text-decoration: none;
  font-size: 85%;
  text-align: center;
  padding:3px 16px;
  line-height: 1.5;
  vertical-align: bottom;

}
ul.mainmenu li a.padding_top{
  padding-top:12px;
}
ul.mainmenu li a br{
  
}
ul.mainmenu li a:hover{
  color: #0097D7;
}

div.sp_header_button{
  position: absolute;
  right:5%;
  top:22px;
  z-index: 8000;
  display: none;
}
div.sp_header_button.active{
  position: fixed;
}

@media screen and (max-width: 479px) {
  a.headerTel{display: none;}
  ul.mainmenu{display: none;}
  a.headerFormLink{display: none;}
  a.logo_sp{display: block;}
  a.logo{display: none;}
  div.header{height: 65px;}
  div.sp_header_button{display: block;}
}
@media screen and (min-width: 480px) and (max-width: 850px) {
  a.headerTel{display: none;}
  ul.mainmenu{display: none;}
  a.headerFormLink{display: none;}
  a.logo_sp{display: block;}
  a.logo{display: none;}
  div.header{height: 65px;}
  div.sp_header_button{display: block;}
}
@media screen and (min-width: 851px){
}


/*/// SP MENU AREA /////*/

div.sp_menuArea{
  z-index: 6000;
  display: none;
  width:100%;
  height:100%;
  position: fixed;
  top:0;
  left:0;
  background: linear-gradient(70deg, #89C6BA, #91D2E5);
  overflow-y: none;
  text-align: center;
}

a.spMenuLogo{
  position: relative;
  top:30px;
}
a.spMenuLogo img{
  max-width:320px;
}
ul.sp_menuList{
  text-align: center;
  width:80%;
  margin:80px auto 30px auto;
  list-style: none;
}
ul.sp_menuList li{
  padding:8px 0;
}
ul.sp_menuList li a{text-align: center;font-size: 95%;}
ul.sp_menuList li a:hover{
  opacity: 0.7;
}
ul.sp_menuList li a{
  font-weight: bold;
  text-decoration: none;
  color:#fff;
  letter-spacing: 2px;
  text-align: center;
}

a.sp_menuTel{
  width:76%;
  display: block;
  margin:45px auto 15px auto;
}

/*humberger menu Button*/
.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-trigger {
  position: relative;
  width: 30px;
  height: 25px;
}
.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #000;
  border-radius: 1px;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 12px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}

/*action*/
.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(12px) rotate(-45deg);
  transform: translateY(12px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-12px) rotate(45deg);
  transform: translateY(-12px) rotate(45deg);
}

/*MainImageArea*/

div.mainimageArea{
  width:100%;
  background-color: #fff;
}
div.mainimageArea img{
  width: 100%;
  display: block;
}
div.toppageBxslider{

}
div.toppageBxslider img.slideImage{
  position: absolute;
  opacity: 0;
}
div.toppageBxslider img.slideImage:first-child{
  position: relative;
  opacity: 1;
}
div.bx-wrapper div.toppageBxslider img.slideImage{
   opacity: 1;
}

@media screen and (max-width: 479px) {
  div.spMainimageArea{display: block;}
  div.mainimageArea{display: none;}
}
@media screen and (min-width: 480px) and (max-width: 640px) {
  div.spMainimageArea{display: block;}
  div.mainimageArea{display: none;}
}
@media screen and (min-width: 641px){
  div.spMainimageArea{display: none;}
  div.mainimageArea{display: block;}
}

/* /// toppage .////*/

div.toppage{
  background:url('../img/common/noiz.gif')top center repeat;
  min-height: 400px;
}
h3.toppageLead{
  font-size: 136%;
  letter-spacing: 3px;
  text-align: center;
  padding:30px 0;
}
div.toppageNewsArea{
  width:90%;
  margin-left:5%;
  min-height: 300px;
  margin-top:30px;
  background:url(../img/common/news_release_title.svg) top left no-repeat;
  background-size: 20px;
  position: relative;
}
.toppageVideoArea {
  width:90%;
  margin-left:5%;  
  padding:0px 0 50px 0;
  margin-top:30px;
}
.toppageVideoArea iframe {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16 / 9;
  margin-top: 40px;
}
ul.newsRelease.toppage{
  list-style: none;
  width:90%;
  margin-left:10%;
}
ul.newsRelease li{
  padding:10px 0;
  border-bottom:#ccc dotted 1px;
}
ul.newsRelease li span.date{
  font-size: 80%;
  color: #009FE8;
  min-width:110px;
  display: inline-block;
}
ul.newsRelease li a{
  font-size: 90%;
  text-decoration: none;
}
ul.newsRelease li a:hover{
  text-decoration: underline;
}
div.newsIndexLinkArea{
  width:100%;
  text-align: right;
  padding:30px 0;
}
a.newsIndexLink{
  display: inline-block;
  padding:10px 20px;
  color:#fff;
  font-size: 80%;
  text-decoration: none;
  border-radius: 80px;
  font-weight: bold;
  background: linear-gradient(70deg, #89C6BA, #91D2E5);
 
}
a.newsIndexLink:hover{
  background:none;
  background-color: #000;
}
a.newsIndexLink span.arrow{
  color: #fff;
  margin-left:15px;
}

div.wrapper.white{
  background-color: #fff;
  min-height: 200px;
  text-align: center;
}
div.wrapper.blue{
  background-color: #F2F9FD;
  min-height: 200px;
}

div.topDetailAreaWrapper{
  width:90%;
  margin:0 auto;
  display: flex;
  flex-wrap: wrap;
  padding-bottom:50px;
  padding-top:40px;
}

h2.service_title{
  padding:60px 0 10px 0;
  max-width: 280px;
  width:50%;
}

div.topDetailArea{
  width: 45%;
  text-align: left;
}
div.topDetailArea h4{
  font-size: 150%;
  letter-spacing: 2px;
  font-weight: normal;
}
div.topDetailArea h5{
  font-size: 110%;
  padding:10px 0;
}
div.topDetailArea p.des{
  font-size: 90%;
  margin-bottom:20px;
  text-align: left;
}
div.topDetailImageArea{
  width: 55%;
  padding-top:20px;
}

img.photoImage{
  width:80%;
  border:#fff solid 4px;
  -webkit-box-shadow:0px 0px 5px 0px #ccc; /* Safari, Chrome逕ｨ */
  -moz-box-shadow:0px 0px 5px 0px #ccc; /* Firefox逕ｨ */
  box-shadow:0px 0px 5px 0px #ccc; /* CSS3 */
}

@media screen and (max-width: 479px) {
  div.topDetailArea{width: 100%;text-align: center;}
  div.topDetailArea p.des{width:96%;margin:0 auto 20px auto;text-align: center;}
  div.topDetailImageArea{width:100%;text-align: center;padding-bottom:20px;}
  img.photoImage{width:94%;}
  ul.newsRelease.toppage{margin-left:20%;width:80%;}
  ul.newsRelease li span.date{display: block;}
  div.newsIndexLinkArea{text-align: center;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.topDetailArea{width: 100%;text-align: center;}
  div.topDetailArea p.des{width:85%;margin:0 auto 20px auto;text-align: center;}
  div.topDetailImageArea{width:100%;text-align: center;padding-bottom:20px;}
  img.photoImage{width:94%;}
}

@media screen and (min-width: 851px){
}

.top-greenplaza-bnr {
  display: block;
  max-width: 445px;
  margin-inline: auto;
}
.top-greenplaza-bnr img {
  width: 100%;
}


/*//// ProjectPage /////*/

h2.project_title{
  padding:60px 0 10px 0;
  max-width: 200px;
  width:50%;
}
h3.nakapageLead.project1{
  width: 90%;
  margin:60px auto 0 auto;
  font-size: 150%;
  font-weight: normal;
  color: #595757;
  letter-spacing: 2px;
  text-align: left;
}
div.nakapage.projectPage{
  text-align: left;
}
div.dblWrapper.project{
  text-align: left;
  padding:0 5%;
  margin:3% 0;
}
div.dblWrapper.project div.left{
  width:50%;
}
div.dblWrapper.project div.right{
  width:50%;
}
div.dblWrapper.project div.right p.des{
  padding:0;
  margin-bottom:20px;
}


div.aboutProjectArea{
  width:100%;
  display: flex;
  flex-wrap: wrap;
  padding:3% 5%;
  border-top: #ccc solid 1px;
}
div.aboutProjectTitle{
  width:50%;
}
div.aboutProjectTitle h3{
  font-weight: normal;
  font-size: 150%;
  text-align: left;
  position: relative;
  margin-left:40px;
  padding-top:120px;
}
img.blueStamp{
  width:110px;
  position: absolute;
  left:-40px;
  bottom:-30px;
}
div.aboutProjectSlide{
  width:50%;
}
div.aboutProjectSlide{
  width:50%;
  position: relative;
  margin-top:30px;
}
div.aboutProjectSlide img{
  width:100%;
}
div.aboutProjectSlide div.slideArea{
  width:100%;
  position: relative;
  z-index: 1000;
}
div.aboutProjectSlide div.colorBg{
  width:100%;
  height: 100%;
  background: linear-gradient(70deg, #89C6BA, #91D2E5);
  opacity: 0.3;
  position: absolute;
  top:-20px;left:20px;
}
div.aboutProjectDetail{
  width: 100%;
  min-height: 300px;
  display: flex;
  flex-wrap: wrap;
  padding:70px 0;
  font-size:90%;
}
div.aboutProjectDetail div.left{
  background-color: #F1F9FB;
  width:30%;
  padding:3%;
  letter-spacing: 4px;
  border-bottom:#fff solid 3px;
}
div.aboutProjectDetail div.left span{
  font-size: 110%;
  font-weight: bold;
}
div.aboutProjectDetail div.right{
  background-color: #F4F9F6;
  width:70%;
  padding:3% 5%;
  border-left:#fff solid 3px;
  border-bottom:#fff solid 3px;
}
div.aboutProjectDetail ol,div.aboutProjectDetail ul{
  text-align: left;
  width:95%;
  padding-left:5%;
}
div.aboutProjectDetail ol li{
  
}
div.aboutProjectDetail ul li.large{
  font-size: 110%;
  font-weight: bold;
  list-style: none;
  padding:10px 0 5px 0;

}

@media screen and (max-width: 479px) {
  div.dblWrapper.project div.left p.des{padding:10px 0px;}
div.dblWrapper.project div.left{width:100%; padding:0;}
div.dblWrapper.project div.right{width:100%; padding:0;}
div.aboutProjectTitle{width:100%;}
div.aboutProjectTitle h3{padding-top:40px;padding-bottom:40px;}
div.aboutProjectSlide{width:100%;}
img.blueStamp{left:-40px;bottom:0px;}
div.aboutProjectDetail div.left{width:100%;}
div.aboutProjectDetail div.right{width:100%;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.dblWrapper.project div.left p.des{padding:10px 0px;}
div.dblWrapper.project div.left{width:100%; padding:0;}
div.dblWrapper.project div.right{width:100%; padding:0;}
div.aboutProjectTitle{width:100%;}
div.aboutProjectTitle h3{padding-top:40px;padding-bottom:40px;}
div.aboutProjectSlide{width:100%;}
img.blueStamp{left:-40px;bottom:0px;}
div.aboutProjectDetail div.left{width:100%;}
div.aboutProjectDetail div.right{width:100%;}
}

@media screen and (min-width: 851px){
}


/* ///footerLinkArea ////*/


div.footerLinkArea{
  width:100%;

  background-color: #000;
  display: flex;
  flex-wrap: wrap;
}
div.footerLinkArea div.bannerLink{
  width:50%;
  display: block;
  overflow: hidden;
  position: relative;
}

div.footerLinkArea div.bannerLink:hover img.bannerBg{
  transform: scale(1.2);
}
div.footerLinkArea div.bannerLink img.bannerBg{
  width: 100%;    
  display: block;
  transition: all .5s;
  transform-origin: bottom;
}
div.footerLinkArea div.bannerLink img.bannerTitle{
  width:36%;
  position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transition: all .5s;
}
div.footerLinkArea div.bannerLink:hover img.bannerTitle{
  background-color: #009FE8;
}

@media screen and (max-width: 479px) {
  div.footerLinkArea div.bannerLink{width:100%;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.footerLinkArea div.bannerLink{width:100%;}
}

@media screen and (min-width: 851px){
}

/* /// Footer //// */

div.footerArea{
  background-color: #352D27;
  width:100%;
  min-height: 100px;
}
div.container.footer{
  width:100%;
  max-width: 1024px;
  margin: 0px auto;
}
div.footerInner{
  width:100%;
  display: flex;
  flex-direction:row-reverse;
  flex-wrap: wrap;
}
div.footerBox{
  width: 25%;
  min-height: 200px;
}

a.footerLogo{
  display: block;
  width: 90%;
  max-width:160px;
  opacity: 0.65;
  margin:45px 0 0 5%;
}
a.footerLogo:hover{
  opacity: 1;
}
a.footerLogo img{
  width: 100%;
}

ul.footerLink{
  list-style: none;
  padding:40px 0 30px 0;
}
ul.footerLink li{

}
ul.footerLink li.show_sm{
  display: none;
}
ul.footerLink li a{
  color: #B9BAB8;
  text-decoration: none;
  font-size: 80%;
  display: block;
  padding:4px 0;
}
ul.footerLink li a:hover{
  color: #fff;
}

div.pagetopLinkArea{
  background-color: #473D36;
  text-align: center;

}
a.pagetopLink{
  display: inline-block;
  width:66px;
  height:66px;
  margin-bottom: 30px;
  transition: all .5s;
}
a.pagetopLink:hover{
  background:none;
  background-color: #000;
}
a.pagetopLink img{
  width: 30px;
  display: block;
  margin: 15px auto 0 auto;
}
a.footerTel{
  width:90%;
  display: block;
  margin: 10px auto 0 auto;
}
a.footerTel img{
  width: 100%;
  max-width: 320px;
}
p.footerAddress{
  font-size: 65%;
  color: #B9BAB8;
  margin-bottom:20px;
}


div.copyrightArea{
  background-color: #231815;
  min-height: 40px;
  text-align: center;
}
p.copyright{
  font-size: 65%;
  color: #CDCECE;
  padding:10px 0;
}

@media screen and (max-width: 479px) {
  div.footerBox{width: 100%; min-height:unset;}
  div.sp_half{width:50%;}
  ul.footerLink{padding:0;}
  ul.footerLink li a{padding:10px 0 10px 5%;width:100%;box-sizing: border-box;
    border-bottom: #444 solid 1px;border-left:#444 solid 1px;}
  ul.footerLink li a:hover{background-color:#000;}
  a.footerLogo{margin:25px auto 25px auto;}
  ul.footerLink li.show_sm{display: block;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.footerBox{width: 100%; min-height:unset;}
  div.sp_half{width:50%;}
  ul.footerLink{padding:0;}
  ul.footerLink li a{padding:10px 0 10px 5%;width:100%;box-sizing: border-box;
    border-bottom: #444 solid 1px;border-left:#444 solid 1px;}
  ul.footerLink li a:hover{background-color:#000;}
  a.footerLogo{margin:25px auto 25px auto;}
  ul.footerLink li.show_sm{display: block;}
}

@media screen and (min-width: 851px){
}


/* //// nakapage //// */

div.nakapageHeader{
  width:100%;
  background:url('../img/common/nakaheader.jpg')top center no-repeat;
  background-size: cover;
	height: 550px;
}
div.nakapageHeader img{
  width: 100%;
}

div.nakapageWrapper{
  width: 100%;
  background:url('../img/common/noiz.gif')top center repeat;
  position: relative;
}

div.container.nakapage{
  width: 100%;
  max-width: 980px;
  background-color: #fff;
  position: relative;
  top:-60px;
  left:0;
  -webkit-box-shadow:0px 0px 5px 0px #ccc; /* Safari, Chrome逕ｨ */
  -moz-box-shadow:0px 0px 5px 0px #ccc; /* Firefox逕ｨ */
  box-shadow:0px 0px 5px 0px #ccc; /* CSS3 */
  text-align: center;
  padding-bottom:60px;
  border-radius: 4px;
}

div.breadArea{
  width:100%;
  padding:3% 5%;
  font-size: 80%;
  text-align: left;
}
div.breadArea a{
  display: inline-block;
}


h2.nakapageTitle{
  display: inline-block;
}
h2.nakapageTitle img{
  width:100%;
}

@media screen and (max-width: 479px) {
  div.container.nakapage{top:0px;left:0;border-radius: none;}
	div.nakapageHeader{
		height: 400px;
		}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.container.nakapage{top:0px;left:0;border-radius: none;}
	div.nakapageHeader{
		height: 400px;
		}
}

@media screen and (min-width: 851px){
}

/* //// AboutPage ////*/

h2.about_title{
  max-width: 230px;
  width:50%;
  margin-top:30px;
}

table.aboutTable{
  width:80%;
  border-top:#666 solid 2px;
  border-bottom:#666 solid 2px;
  display: block;
  margin:60px auto;
}
table.aboutTable tr{
  border-bottom:#ccc solid 1px;
  width:100%;
  font-size: 90%;
}
table.aboutTable td.left{
  width:20%;
  font-weight: bold;
  text-align: center;
}
table.aboutTable td{
  text-align: left;
  width:80%;
  padding:15px 10px;

}

@media screen and (max-width: 479px) {
table.aboutTable{width:96%;}
table.aboutTable td.left{width:25%;}
table.aboutTable td{width:75%;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.container.nakapage{}
  table.aboutTable{width:96%;}
table.aboutTable td.left{}
table.aboutTable td{}
}

@media screen and (min-width: 851px){
}

/* //// conceptPage ////*/

h2.concept_title{
  max-width: 230px;
  width:50%;
  margin-top:30px;
}

h3.nakapageLead{
  width: 90%;
  margin:60px auto 0 auto;
  font-size: 120%;
  color: #595757;
  letter-spacing: 2px;
}
div.dblWrapper{
  margin-top:50px;
  display: flex;
  flex-wrap: wrap;
}
div.dblWrapper div.left{
  width: 40%;
  position: relative;
}
div.stampWrapper{
  width: 70%;
  position: relative;
  margin:0 auto;
}
img.concept_image{
  width:100%;
  border:#fff solid 4px;
  -webkit-box-shadow:0px 0px 5px 0px #ccc; /* Safari, Chrome逕ｨ */
  -moz-box-shadow:0px 0px 5px 0px #ccc; /* Firefox逕ｨ */
  box-shadow:0px 0px 5px 0px #ccc; /* CSS3 */
}
img.concept_stamp{
  display: block;
  position: absolute;
  bottom:-20px;
  left:-30px;
  width:100px;
}
div.dblWrapper div.right{
  width: 60%;
}
div.dblWrapper p.des{
  font-size: 85%;
  line-height: 1.7;
  text-align: left;
  padding:0 10% 15px 0;
}

div.surviceIndexArea{
  width:90%;
  margin:0 auto;
  display: flex;
  flex-wrap: wrap;
  padding-bottom:50px;
  padding-top:80px;
  border-bottom: #ccc solid 1px;
}
div.surviceIndexArea.reverse{
  flex-direction: row-reverse;
}
div.surviceIndexArea:last-child{
  border-bottom:none;
}

div.serviceLinkArea{
  width: 45%;
  text-align: center;
}
div.serviceIndexImageArea{
  width: 55%;
}
div.serviceLinkArea img.num{
  width:80px;
  margin-bottom:15px;
}
div.serviceLinkArea h4{
  letter-spacing: 2px;
}
div.serviceLinkArea p.des{
  width:85%;
  display: block;
  margin:20px auto;
  box-sizing: border-box;
  text-align: left;
  font-size:90%;
}
a.serviceIndexLink{
  color: white;
  font-size: 80%;
  font-weight: bold;
  display: inline-block;
  padding:10px 30px;
  border-radius: 80px;
  text-align: center;
  background: linear-gradient(70deg, #89C6BA, #91D2E5);
  text-decoration: none;
}
a.serviceIndexLink span.arrow{
  margin-left:15px;
  color: white;
  font-weight: bold;
}
a.serviceIndexLink:hover{
  background:none;
  background-color: #000;
}

div.serviceImage{
  width:90%;
  margin:0 auto;
  position: relative;
}
div.serviceImage div.colorBg{
  width:100%;
  height: 100%;
  background: linear-gradient(70deg, #89C6BA, #91D2E5);
  opacity: 0.3;
  position: absolute;
  top:0;left:0;
}
div.serviceImage img{
  width:100%;
  display: block;
  position: relative;
  top:-15px;
  left:-15px;
}

@media screen and (max-width: 479px) {
  div.stampWrapper{width:70%;}
  div.dblWrapper{margin-top:10px;}
  div.dblWrapper div.left{width:100%;padding:3%;}
  div.dblWrapper div.right{width:100%;padding:3%;}
  div.dblWrapper div.right p.des{padding:10px 3%;}
  div.serviceImage{width:100%;}
div.serviceLinkArea{width: 100%;top:-50px;position: relative;}
div.serviceIndexImageArea{width: 100%;}
div.surviceIndexArea{padding-bottom:20px;padding-top:40px;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
  div.stampWrapper{width:50%;}
  div.dblWrapper{margin-top:10px;}
  div.dblWrapper div.left{width:100%;padding:3%;}
  div.dblWrapper div.right{width:100%;padding:3%;}
  div.dblWrapper div.right p.des{padding:10px 3%;}
  div.serviceImage{width:100%;}
div.serviceLinkArea{width: 100%;top:-50px;position: relative;}
div.serviceIndexImageArea{width: 100%;}
div.surviceIndexArea{padding-bottom:20px;padding-top:40px;}
}

@media screen and (min-width: 851px){
}


/* //// NewsPage ////*/

h2.news_title{
  max-width: 330px;
  width:50%;
  margin-top:30px;
}

div.newsIndexArea{
  width:90%;
  margin-left:5%;
  min-height: 300px;
  padding:0px 0 30px 0;
  margin-top:60px;
  background-size: 20px;
  position: relative;
  text-align: left;
}

ul.newsRelease{
  list-style: none;
  width:90%;
  margin-left:5%;
}

@media screen and (max-width: 479px) {
h2.news_title{max-width: 380px;width:70%;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
h2.news_title{}
}

@media screen and (min-width: 851px){
}

/*// News Article ///*/

div.container.article{
  text-align: left;
  width:80%;
  margin:30px auto;
}

div.article div.date{
  font-size: 80%;
  color:#009FE8;
  padding-bottom:10px;
}
div.article h2{
  font-size: 130%;
  font-weight: normal;
  letter-spacing: 2px;
  padding-bottom:5px;
}
div.articleContent{
  border-top: #ccc solid 1px;
  padding:20px 0;
}

div.articleContent p{
  font-size: 90%;
  padding-bottom:15px;
}
div.articleContent ul, div.articleContent ol{
  font-size: 90%;
  padding:3%;
}
div.articleContent img{
  width:100%;
  height:auto;
  margin:15px 0;
  display: block;
}
div.articleContent a{
  color: #009FE8;
  font-size: 90%;
}
div.articleContent a:hover{
  color: #000;
}

/* //// ContactPage ////*/

h2.contact_title{
  max-width: 230px;
  width:50%;
  margin-top:30px;
  margin-bottom: 60px;
}

div.formBox{
  width:70%;
  text-align: left;
  padding:10px 3%;
  margin:0 auto;
}
div.formBox.center{
  text-align: center;
}
div.formBox p.label{
  font-size: 90%;
  margin-bottom:5px;
}
div.formBox p.label span.red{
  color:red;
}
div.formBox p.label span.small{
  font-size: 80%;
}
div.formBox p.caution{
  font-size: 80%;
  color:#666;
}

input[type="text"],input[type="tel"],input[type="email"]{
  width:100%;
  padding:6px 3px 5px 8px;
  border:#ccc solid 1px;
  border-radius: 4px;
  background-color: #F6F7F7;
  box-sizing: border-box;
}
textarea{
  width:100%;
  padding:6px 3px 5px 8px;
  border:#ccc solid 1px;
  border-radius: 4px;
  background-color: #F6F7F7;
  box-sizing: border-box;
  min-height: 180px;
}

input[type="submit"]{
  box-sizing: border-box;
  background-color: #000;
  color:white;
  padding: 12px 35px;
  font-size: 95%;
  font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif;
  border:none;
  cursor: pointer;
  font-weight: normal;
  margin:30px 0;
}
input[type="submit"]:disabled{
  background-color: #ccc;
  opacity: 0.8;
}
input[type="submit"]:hover{
  background-color: #009FE8;
}

input[type="text"]:invalid,textarea:invalid{
  /*border:red solid 1px;*/
}
input[type="text"]:valid,textarea:valid{
  /*border:#72A951 solid 2px;*/
}

@media screen and (max-width: 479px) {
div.formBox{width:96%;}
}

@media screen and (min-width: 480px) and (max-width: 850px) {
div.formBox{width:96%;}
}

@media screen and (min-width: 851px){
}



/* //// PAGENATION  paginate_links ///// */
div.pagenationArea{
text-align: center;
margin:50px 0;
width:100%;
}
div.pagenationArea a{
  text-decoration: none;
  display: inline-block;
  font-size: 80%;
  padding:5px 10px;
  border:#ccc solid 1px;
  background-color: #fff;
}
div.pagenationArea a:hover{
  background-color: #009FE8;
  color:white;
}
a.page-numbers{
}
ul.page-numbers{
  list-style: none;
}
ul.page-numbers li{
  display: inline-block;
}
span.page-numbers.current{
text-decoration: none;
  display: inline-block;
  font-size: 80%;
  padding:5px 10px;
  background-color: #009FE8;
  color:white;
}
a.next{

}
a.prev{

}

@media screen and (max-width: 479px) {
  div.newsbox{margin:0;border-bottom:#ccc solid 1px;}
  div.newsTextArea p.news_short_des{display: none;}
  div.newsTextArea{width:62%;}
  div.newsTextArea a{font-size: 85%;line-height: 1.5;}
  img.newsThumb{width:35%;}
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  div.newsbox{margin:0;border-bottom:#ccc solid 1px;}
  div.newsTextArea p.news_short_des{display: none;}
  div.newsTextArea{width:67%;}
  div.newsTextArea a{font-size: 90%;line-height: 1.5;}
  img.newsThumb{}

}
@media screen and (min-width: 768px){

}


/* //// PREV_NEXT //////*/

div.prevNextArea{
  max-width:800px;
  box-sizing:border-box;
  margin-left:auto;
  margin-right:auto;
}
ul#pagenavi{
  width:100%;
  list-style: none;
  margin:0;
  padding:0;
  margin-top:10px;
  text-align: center;
}
li.prev{
  width:48%;
  display: inline-block;
  box-sizing:border-box;
  padding:3%;
  background-color: #F2F9FD;
  text-align: left;
}
li.prev a{
  display: inline;
  font-size: 80%;
  color:#009FE8;
  text-decoration: none;
}
li.prev a:hover{
  text-decoration: underline;
}
li.next{
  width:48%;
  margin-left:1%;
  display: inline-block;
  box-sizing:border-box;
  text-align: right;
  padding:3%;
  background-color: #F2F9FD;
}
li.next a{
  display: inline;
  text-align: right;
  font-size: 80%;
  color:#009FE8;
  text-decoration: none;
}
li.next a:hover{
  text-decoration: underline;
}

/*indexLinkArea*/

div.indexLinkArea{
  width:100%;
  text-align: center;
  padding:40px 0;
}

div.indexLinkArea a.indexLink{
  display: inline-block;
  padding:15px 45px;
  color: #fff;
  background-color: #009FE8;
  font-size: 80%;
  text-decoration: none;
}
div.indexLinkArea a.indexLink:hover{
  background-color: #000;
}


@media screen and (max-width: 479px) {
li.next{margin-left:0%;padding:4%;}
li.prev{padding:4%;}
div.indexLinkArea{padding:30px 0;}
}
@media screen and (min-width: 480px) and (max-width: 767px) {
li.next{margin-left:0%;}
}
@media screen and (min-width: 768px){

}

span.display-name{
  color: #fff;
}


/*nakapage_ttl*/
.nakapage_ttl{
	padding: 60px 0;
}
.nakapage_ttl h2{
	font-size: 1.4rem;
    background: #fff;
    display: inline;
    padding: 5px 10px;
}
.nakapage_ttl ul{
	/*padding-left: 30px;*/
	padding-top: 15px;
}
.nakapage_ttl li{
	background: #fff;
    display: table;
    padding: 2px 10px;
    font-weight: 900;
    font-size: 0.8rem;
	margin-top: 5px;
	margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
	.nakapage_ttl{
	padding: 30px 15px;
}
	.nakapage_ttl h2{
		font-size: 1.0rem;
	}
	.nakapage_ttl li{
		font-size: 0.7rem
	}
}