﻿@charset "utf-8";
/*-------------------------------------
	画像下端/リンク透過
-------------------------------------*/
img { vertical-align: bottom; }
a:hover img {opacity: 0.8;filter: alpha(opacity=80);}

/*-------------------------------------
	     Header
-------------------------------------*/
header { width:100%;text-align:center;margin:0px auto 0px auto;
         background-color: rgba(255,255,255,1.0);position: relative;z-index: 10; }
#header-inner { max-width:1150px;margin:0px auto 0px auto;padding:0px; }
.company-logo { float:left;padding:0px;margin:0;max-height:110px;width:35%;}
.company-logo img { max-width:100%; }
#titleGroup { float:right;width:65%;margin:0px 0 0 0;text-align:center; }
h1  { float:left;font-size:20px;color:#ffffff;padding:25px 0 0px 0;margin:0px;width:50%;
	width: -webkit-calc(100% - 302px) ;	width: calc(100% - 302px) ;
      text-shadow: 2px 2px 2px #006699, -2px 2px 2px #006699,2px -2px 2px #006699,-2px -2px 2px #006699,
             0px 2px 2px #006699, -2px 0px 2px #006699, 2px 0px 2px #006699, 0px -2px 2px #006699,
             5px 5px 6px #006699;}
#header-inner .subTitle { float:left;max-width:302px;max-height:90px;padding-top:10px; }
#header-inner .subTitle img { max-width:100%; }

  @media screen and (max-width : 1000px) { 
       h1{  font-size:2vmin; padding-top:5px; }
       #header-inner .subTitle { padding-top:5px; }
  }
  @media screen and (max-width : 768px){ 
       #header-inner { width:100%; }
       .company-logo { width:100%;float:none;text-align:center; }
       #titleGroup { float:none;width:100%;margin:0px auto;text-align:center; }
       h1{ float:none;width:100%;font-size :1.3em;} 
       #header-inner .subTitle { max-width:none;float:none;width:100%; }
  }
  @media screen and (max-width : 480px) { 
       h1{  float:none;width:100%;font-size : 20px;padding:5px 0;}
  }

/*-------------------------------------
          GLOBAL NAVIGATION 
-------------------------------------*/
#fixedBox {  }
#fixedBox.nav { width:100%;clear:both;height:47px;position:relative;z-index:10;
          background-color: rgba(0,153,204,0.7); }
#fixedBox.fixed { position: fixed;top: 0;left: 0;width: 100%; }
  @media screen and (min-width : 769px){
     #openList{ max-width:1150px;margin:0px auto 0px auto; }
     #openList .open img, #openList .close img { display:none; }
     #openList ul { width:100%; z-index:10;margin:0px auto 0px auto;}
     #openList li { float: left;margin:0;padding:12px 0;width:16.6%; font-weight:bold;
                     margin-top:0;text-align:center; }
     #openList a { font-weight:bold;display: block;font-size:14px;color:#eee; }
     #openList li.active a { color:#33ff33; }
     #openList a:hover { color:#33ff33;text-decoration:none; }
  }
  @media screen and (max-width : 768px){
     #fixedBox.nav { background:none; }
     #openList{ display:block;width:50px;height:47px;cursor:pointer;z-index:10;}
     li.menu-item{ position: relative;padding-left:8px;z-index:3; }
     li.menu-item a{ display:block;padding:20px;   color: #FFFFFF;    text-decoration: none; }
     #openList div.open { -webkit-transition: .5s linear; 	transition: .5s linear;  }
     #openList div.close { height:100%;margin-left:300px; -webkit-transition: .5s linear; transition: .5s linear; }
     #openList ul { list-style:none; padding:0px;
                margin:-53px 0px 0px -316px; }
     #openList ul li { font-size: 16px;font-weight: bold;
              background: #323333 none repeat scroll 0% 0%;
             width: 300px;border-bottom: 1px solid #FFF;}
  }
  @media screen and (max-width : 480px) {
     #openList div.close { margin-left:260px; }
     #openList ul { margin:-53px 0px 0px -264px; }
     #openList ul li { width: 250px; }
     .openIcon { position:relative;z-index:10;}
  }
/*-------------------------------------
	   Main Contents
-------------------------------------*/
article { width:100%; }
section { width:100%; }
#top-contents { width:100%;position:relative;top:-50px; }
#top-contents img { width:100%;margin:0 auto; }
  @media screen and (max-width : 768px){
      #top-contents { clear:both;width:100%;margin-top:-20px; }
      #top-contents img { max-width:100%; } 
  }
  @media screen and (max-width : 480px) {
      #top-contents { margin-top:0px; }
  }

#topCon { clear:both;width:100%;margin-bottom:20px;position:relative;top:-50px;text-align:center; }
#topConInner { max-width:1150px;margin:0 auto; }
#topCon h2 { font-size:20px;max-width:1000px;margin:0px auto;color:#555;padding:20px 0 0; }
#onSale { float:left;width:45%;margin:10px 2%;border:1px #ccc solid;border-radius:5px; }
#salePic { width:96%;margin:2%;position:relative; }
#salePic img { width:100%; }

  @media screen and (max-width : 768px){
      #topConInner { width:100%; }
      #topCon h2 { width:100%;padding:20px 0; }
  }
  @media screen and (max-width : 480px) {
      #onSale { float:none;width:98%;margin:10px 0; }
  }
#salePic h3 { font-size:16px;color:#fff;margin:0px;padding:0px;border:none;
             position:absolute;top:0;left:0;padding:1%;
             display:block;background-color:rgba(50,50,50,0.5); }
#salePic h3 a:link, #salePic h3 a:visited { color:#fff; }
#salePic .condoPic { height:100%;overflow:hidden; }
#salePic .salePrice { font-size:14px;color:#fff;border:none;
             position:absolute;bottom:0;left:0;padding:1% 2%;
             display:block;background-color:rgba(50,50,50,0.5); }
#salePic .salePlace { font-size:14px;color:#fff;border:none;
             position:absolute;bottom:0;right:0;padding:1% 2%;
             display:block;background-color:rgba(50,50,50,0.5); }
.condoPicThumb { width:18%;float:left;margin:1%; }
.condoPicThumb img { width:100%; }

#stage { position: relative;max-width: 100%;margin: 0 auto;}
#thumbs {  }

#thumbs label { width:18%; }
#thumbs label img { width:14%;	cursor: pointer;margin:1%;}
#r1, #r2, #r3, #r4, #r5, #r6, #r7, #r8, #r9, #r10, #r11, #r12 {display: none;}
.photo { position: absolute;left: 0;top: 0;width:100%; }
.photo img { opacity: 0;width:100%;
	-webkit-transition: opacity 1s ease;
	transition: opacity 1s ease;}
#r1:checked ~ #photo1 img, #r2:checked ~ #photo2 img, #r3:checked ~ #photo3 img, #r4:checked ~ #photo4 img, #r5:checked ~ #photo5 img, #r6:checked ~ #photo6 img #r7:checked ~ #photo7 img, #r8:checked ~ #photo8 img, #r9:checked ~ #photo9 img, #r10:checked ~ #photo10 img, #r11:checked ~ #photo11 img, #r12:checked ~ #photo12 img { opacity: 1;}

#onSale .saleConText { font-weight:bold;text-align:left;font-size:12px;
              padding:0 2% 2%; }

  @media screen and (max-width : 1100px) { 
       #onSale .saleConText p { height:54px; overflow:hidden; }
  }
  @media screen and (max-width : 768px) { 
       #onSale .saleConText p { height:70px;  }
  }
  @media screen and (max-width : 480px) {
       #salePic .condoPic { height:auto;overflow:hidden; }
       #onSale .saleConText p { height:auto;  }
  }
#service { padding:30px 0px;margin-top:-50px;color:#fff;position:relative;
	background:url(/image/top002.jpg);
	-webkit-background-size:cover;	-moz-background-size:cover;
	-o-background-size:cover;	background-size:cover;
	background-attachment:fixed; }
#service:before { content:"";width:100%;height:100%;position:absolute;top:0px;left:0px;
	display:block;background-color:rgba(0,153,204,0.7);z-index:0; }

#midCon { clear:both;width:100%;margin:20px 0;text-align:center;position:relative;  } 
#midConInner { max-width:1150px;margin:0 auto; }

h3 { color:#fff;margin:10px auto; }

.midConImage { float:left;width:19%;margin:30px 3%; }
.midConImage img { max-width:150px; }
.midConImage a { float:left;text-align:center;width:100%;height:150px;
               border:none;border-radius:50px;
               -webkit-transition: .3s linear; transition: .3s linear;background-color:none; }
.midConImage a:hover  {  background-color: #555; }
.midConImage a:hover img {opacity: 1.0;filter: alpha(opacity=100);}
h4 { font-size:16px;width:100%; }
.midConText { font-size:12px;width:100%; }

  @media screen and (max-width : 768px){
      #midConInner {  max-width:100%; } 
      .midConImage { width:21%;margin:30px 2%; }
      .midConImage img { max-width:150px; width:100%; }
  }
  @media screen and (max-width : 480px) {
      .midConImage { float:none;width:100%;margin:0; }
      .midConImage a { float:none;border:none; }
      .midConImage a:hover  {  background:none; }
      #midConInner {  max-width:100%; } 
      .midConText { padding-left:0px; }
  }
/*-------------------------------------
	           DMCIの魅力
-------------------------------------*/
#charm  { clear:both;width:100%;margin:20px 0;text-align:center;position:relative;  } 
.charmConInner { max-width:900px;margin:0 auto; }
.charmConInner h3 { color:#009900; margin:10px auto 30px; }
.charmBox { float:left;width:43%;margin:10px 1%;padding:3% 2% 1%; 
              position:relative; border:1px #99ff99 solid;border-radius:15px; }
.charmBoxL { clear:both; width:93%;margin:10px 1%;padding:3% 2% 1%; 
              position:relative; border:1px #99ff99 solid;border-radius:15px; }
h4.charmTitle { position:absolute; top:-30px; left:-30px; width:40px; height:40px;padding:10px; 
              background:#0000ff50; border:1px #99ff99 solid; border-radius:40px; font-size:26px;
              color:#fff; }
.charmText { color:#555;padding:1%;text-align:left; }

  @media screen and (max-width : 768px) {
      #charm  { width:94%;margin:20px 0 20px 6%;  } 
  }
  @media screen and (max-width : 480px) {
      .charmBox { float:none;width:95%; }
  }
/*-------------------------------------
	          Q&A
-------------------------------------*/
#QA  { clear:both;width:100%;margin:20px 0;text-align:center;position:relative;
               background:#f2f3fe;  } 
.qaConInner { max-width:900px;margin:0 auto; padding:40px 0; }
.qaConInner h3 { color:#009900; margin:10px auto 30px; }
.qaBoxLeft { float:left;width:63%;margin:20px 1% 25px;padding:1%; 
              position:relative; border:1px #0000ff solid;border-radius:15px; }
.qaBoxRight { float:right; width:63%;margin:0px 1% 20px;padding:1%; 
              position:relative; border:1px #ff0000 solid;border-radius:15px; }
h4.qaTitleQ { position:absolute; top:-20px; left:-50px; width:40px; height:40px;padding:10px; 
              background:rgba(0,0,255,0.5); border:1px #0000ff solid; border-radius:40px; font-size:26px;
              color:#fff; }
h4.qaTitleA { position:absolute; top:-20px; left:-50px; width:40px; height:40px;padding:10px; 
              background:rgba(255,0,0,0.5); border:1px #ff0000 solid; border-radius:40px; font-size:26px;
              color:#fff; }
.qaText { color:#555;padding:1%;text-align:left; }

  @media screen and (max-width : 768px) {
      #QA  { width:92%;padding-left:8%;  } 
      .qaBoxRight {width:83%; }
  }
  @media screen and (max-width : 480px) {
      #QA  { width:90%;padding-left:10%;  } 
       h4.qaTitleQ { width:7vmin; height:7vmin;padding:5px 10px 15px;  }
h4.qaTitleA { width:7vmin; height:7vmin;padding:5px 10px 15px;  }
  }
/*-------------------------------------
	        VOICE
-------------------------------------*/
.voice { float:left;width:45%;margin:10px 1%;padding:1%; border:1px #ccc solid;border-radius:5px; }
h4.voiceTitle { text-align:right;border-bottom:1px #99ff99 solid;margin:5px 0;padding-bottom:10px; }
.voiceText { color:#555;padding:1%;text-align:left; }
.voiceText:before { font-family:'FontAwesome';font-weight:bold;color:#6793ea;content:"“";} 
.voiceText:after { font-family:'FontAwesome';font-weight:bold;color:#6793ea;content:"”";}
  @media screen and (max-width : 480px) {
      .voice { float:none;width:95%; }
  }

#aboutUs { padding:30px 0px;margin-top:0px;color:#fff;position:relative;
	background:url(/image/top003.jpg);
	-webkit-background-size:cover;	-moz-background-size:cover;
	-o-background-size:cover;	background-size:cover;
	background-attachment:fixed; }
#aboutUs:before { content:"";width:100%;height:100%;position:absolute;top:0px;left:0px;
	display:block;background-color:rgba(0,153,204,0.7);z-index:0; }
#aboutCon { float:left;width:45%;margin:10px 2%; }
#aboutCon img {  }
#aboutCon .aboutConText { font-weight:bold;text-align:left;font-size:14px;
              padding:3% 3%;line-height:40px; }
#aboutCon .aboutConText a { color:#fff; }
#aboutCon .aboutConText a:visit { color:#fff; }
  @media screen and (max-width : 480px) {
      #aboutCon { float:none;width:100%;margin:10px 0; }
  }
/*-------------------------------------
	      Blog Mura
-------------------------------------*/
.blogMura { margin:40px 0 20px; }
.muraLeft { width:auto; float:left; Margin-right:5%; }
.muraRight { width:120px; float:left; }
  @media screen and (max-width : 480px) {
      .muraLeft { width:auto; float:none; Margin:0 5%; text-align:center;}
      .muraRight { width:100%; margin:0 auto; text-align:center; padding-top:20px;}
  }
/*-------------------------------------
	   Single Post
-------------------------------------*/
.mainContent { margin:20px 0;font-size:16px;font-weight:bold;color:#555; }
#singleDetail { font-size:16px;font-weight:bold; }
#singleDetail .salePlace { width:90%;margin:10px 3px;padding:2%;
            border:#ccc 2px solid;border-radius:5px;background-color:#eaeaff; }
#singleDetail .salePrice { width:90%;margin:10px 3px;padding:2%;
            border:#ccc 2px solid;border-radius:5px; }
#singleDetail .floorPlan { width:90%;margin:10px 3px;padding:2%;
            border:#ccc 2px solid;border-radius:5px;background-color:#eaeaff; }
#singleDetail .squareMeter { width:90%;margin:10px 3px;padding:2%;
            border:#ccc 2px solid;border-radius:5px; }
#singleDetail .squareMeterPrice { width:90%;margin:10px 3px;padding:2%;
            border:#ccc 2px solid;border-radius:5px;background-color:#eaeaff; }
#singleDetail .kind { clear:left;width:90%;margin:10px 3px;padding:2%;
            border:#ccc 2px solid;border-radius:5px; }
.googleMap { position: relative;padding-bottom: 50%;
            padding-top: 30px;height: 0;overflow: hidden;margin-bottom:30px; }
.googleMap iframe, .googleMap object, .googleMap embed { position: absolute;
            top: 0;left: 0;width: 100%;height: 100%;}
/*-------------------------------------
	   SALE
-------------------------------------*/
#onSaling { float:left;margin:10px 1%;text-align:left;
          border:1px #ccc solid;border-radius:10px;width:30.8%;
         width : -webkit-calc(31% - 2px) ;width : calc(31% - 2px) ;  }
#onSaling h3 { font-size:15px;margin:5px auto; }
#onSaling h3 a:link { color:#0000ff; }
#salingPic { width:96%;margin:2%;position:relative; }
.salingcondoPic { height:150px; overflow:hidden;border-radius:10px; }
.salingcondoPic img { width:100%; }
#salingPic .salePrice, #salingPic .saleKind { background:#feeaea;padding:5px 0 5px 10px; }
#salingPic .salePlace, #salingPic .salePlan { background:#eafefd;padding:5px 0 5px 10px; }
  @media screen and (max-width : 768px){
      .salingcondoPic { height:auto; overflow:hidden; }
        }
  @media screen and (max-width : 480px) {
      #onSaling { float:none;width:98%;margin:5px 0; }
  }
/*-------------------------------------
	   SCHEDULE
-------------------------------------*/
#scheduleInner { width:900px;margin:0 auto; }
#scheduleCon { float:left;width:41%;margin:10px 2%; }
#scheduleCon.leftText { width:45%;margin:0;text-align:left;padding-left:50px; }
#scheduleCon.leftText p { padding:10px 0; }
#scheduleCon.rightText { width:55%;margin:0;text-align:left; }
#scheduleConMid { width:100%;margin:0 0 0 40px;text-align:left; }
.schedulePic { width:100%;margin:0 auto 10px; }
#scheduleCon img { width:100%;border:1px #0099cc solid; }
#scheduleCon .scheduleConText { font-size:14px;
              padding:3% 3%;line-height:25px; }
#scheduleCon .scheduleConText a { color:#00ffff; }
#scheduleCon .scheduleConText a:visit { color:#00ffff; }

  @media screen and (max-width : 768px){
      #scheduleInner { width:100%; }
      .schedulePic { width:100%;margin:0 auto 10px; }
      #scheduleCon .scheduleConText { line-height:1.5em; }
      #scheduleConMid { width:100%;margin:0; }
        }
  @media screen and (max-width : 480px) {
      #scheduleInner { width:100%; }
      #scheduleCon { float:none;width:100%;margin:10px 0; }
      #scheduleCon.leftText { width:100%;padding:0; }
      #scheduleCon.rightText { width:100%; }
      #scheduleConMid { width:100%;margin:0; }
  }
#scheduleInner h2 { clear:both;border-top:2px #0099cc solid;padding:20px 0 0 0;margin:20px 0 0 0; }
#scheduleInner h3 { color:#009966; }
#scheduleInner h4 { margin:10px 0; }
#scheduleInner h5 { color:#009966;margin:10px 0; }
#scheduleInner ul.shortcode-list { width:90%;color:#555;margin:10px 0 10px 10px; }
#scheduleInner ul li { border-bottom:#ccc 1px solid;line-height:1.6em; }
#scheduleInner p { color:#555; }
table.scheduleTable { width:100%; border-collapse: separate; border-spacing:0;
               border-top: 1px solid #ccc;border-left: 1px solid #ccc; }
table.scheduleTable th { padding: 5px;color: #444;background-color: #ccc;
border-top: 1px solid #fff;border-left: 1px solid #fff;border-right: 1px solid #ccc;border-bottom: 1px solid #ccc;}
table.scheduleTable td { padding: 4px;background-color: #fafafa;border-right: 1px solid #ccc;border-bottom: 1px solid #ccc;}
/*-------------------------------------
	   ABOUT US
-------------------------------------*/
.aboutLeft { height:200px; }
.aboutLeft h3 { color:#777; }
.awardPic { height:auto; border-radius:10px; }
.awardPic img { width:100%; }
  @media screen and (max-width : 768px){
      
        }
  @media screen and (max-width : 480px) {
      .aboutLeft { height:auto; }
  }
/*-------------------------------------
	   CONTACT
-------------------------------------*/
#box-contents { width:70%;margin:10px 15%;text-align:left; }
.contactConLeft { float:left;width:50%; }
.contactText { padding: 20px 20px 10px 50px; }
.contactConRight { float:right;width:50%; }
h3.contactTitle { }
#contactForm { margin:20px 0px 20px 50px; }
.contactLeft { width:200px;float:left;margin:3px;}
.contactRight { margin:5px 14px; }
.contactRight input, .contactRight textarea { width:400px;}
.submitBtn { margin-left:200px;}
#contactForm table { table-layout:fixed; }
#contactForm .formTable { width:80%;margin:10px auto 10px auto;
         border-spacing:0;border-collapse:collapse; }
#contactForm .formTable td { width:70%;padding:5px 20px 5px 20px;word-wrap:break-word; }
#contactForm .formTable th { width:30%;padding:5px 20px 5px 20px; }

.location { padding: 10px 10px 10px 40px; }
.location ol  { counter-reset:li; padding:0; list-style:none; margin:0 0 20px 50px; }
.location ol li {  position:relative;    margin:10px 0 0px 50px;     padding:0px 8px;
         border-bottom:1px solid #999;   background:#f6f6f6; }
.location ol li:before { content:counter(li);  counter-increment:li;   position:absolute;
        left:-18px;    width:18px;    padding:2px 0 2px 0;    border-top:1px solid #999;border-bottom:1px solid #999;
        color:#fff;    background:#999;    font-weight:bold;    font-family:"Helvetica Neue", Arial, sans-serif;
        text-align:center; }

  @media screen and (max-width : 768px) {
     #contactForm { margin:30px 0px 20px 0px; }
     h3.contactTitle { margin-left:0px; }
     .contactText { padding: 20px 20px 10px 0px; }
     .contactRight input, .contactRight textarea { width:100%;}
     .submitBtn { margin-left:40%;}
  }
  @media screen and (max-width : 480px) {
     .contactConLeft { float:none;width:100%; }
     .contactText { padding: 20px 20px 10px 10px; }
     .contactConRight { float:none;width:100%; }
     h3.contactTitle { margin-left:0px; }
     .contactRight input, .contactRight textarea { width:100%;}
     .history ol { margin-left:10px; }
     .location { padding: 10px 10px 10px 10px; }
     .location ol  { margin-left:0px; }
     .location ol li { margin:10px 0 0px 10px; }
  }

.outlineLeft { float:left;width:25%;padding-left:10%; }
.outlineText { padding: 20px 20px 10px 0px; }
.outlineRight { float:right;width:65%; }
.outlineLeft li { margin-left:20px; }
.organization { text-align:center; }
  @media screen and (max-width : 768px) {
     .outlineLeft { clear:both;width:25%; }
     .organization img { width:100%; }
  }
  @media screen and (max-width : 480px) {
     .outlineLeft { clear:both;float:none;width:100%;padding-left:0; }
     .outlineText { padding: 20px 20px 10px 0px; }
     .outlineRight { float:none;width:90%;padding-left:10%; }
  }

/*-------------------------------------
	    Page Top
-------------------------------------*/
#page-top { display: block;  position: fixed;  z-index: 9999;  bottom: 10px;
  right: 10px;  width: 100px;  padding: 20px 10px;  background:#555;
  color: #fff;  text-align: center;  text-decoration: none; }
#page-top:hover{   background: rgba(0,0,0,.8); }
  @media screen and (max-width : 480px) {
      #pageTop { display: none; }
  }

/*-------------------------------------
	    BLOG
-------------------------------------*/
#leftCon { width:30%;float:left;text-align:left; }
#leftCon > h3 { background-color: rgba(0,153,204,0.7);margin:0px;padding:10px 0 10px 2%;
           border-left:4px #ff0000 solid; }
.latestNews { border:1px #ccc solid;padding:2%;margin:0 0 20px 0; }
.proFile { padding:10px; }
.proFile img { width:50px; vertical-align: middle;}
.proFilePic { text-align:center; }
.proFilePic img { width:200px;margin:5px auto; border-radius:100px;
             box-shadow: 2px 2px 2px #ccc;}
.backNum {  }
div.backNum li.latestTitle { list-style-type:square;margin:8px 0 8px 20px;color:#0099cc; } 
div.backNum li.latestTitle a:link　{ color:#333; }
div.backNum li.cat-item { list-style-type:square;margin:8px 0 8px 20px;color:#0099cc; } 
div.backNum li.cat-item a:link　{ color:#333; }

.widget_search { padding:10px 0; }
#deskTop h3 { background-color: rgba(0,153,204,0.7);margin:0px;padding:10px 0 10px 2%;
           border-left:4px #ff0000 solid; }
#wp-calendar { width:80%;margin:10px 10%; }

  @media screen and (max-width : 768px) {
      .proFilePic img { width:100%;}
  }
  @media screen and (max-width : 480px) {
      #leftCon { width:100%;float:none; }
      #deskTop { display: none; }
      .proFilePic img { width:60%; margin:5px 20%; }
  }

#rightCon { width:66%;float:right;text-align:left;padding:0 2%; }
#rightCon article > h3.blog { color:#fff;font-size:16px;background-color: rgba(0,153,204,0.7);
             margin:0px;padding:10px 0 10px 2%;border-left:4px #ff0000 solid; }
#rightCon h3.blog a:link { color:#fff; }
#rightCon h3.blog a:visited { color:#fff; }
.rightConInner { margin:0 auto;padding:0 2% 20px 2%;border:1px #ccc solid; }
.rightConInner > .date { text-align:right;padding:10px 10px 0; }
#rightCon #mainPost { text-align:left; }
#rightCon .entries_list { word-break: break-all;  }
#rightCon .entries_list img { max-width:96%; height:auto; }

  @media screen and (max-width : 480px) {
      #rightCon { width:100%;float:none;padding:0%; }
      #rightCon entries_list img { width:100%; }
  }

#mainPost > h2 { color:#fff;font-size:16px;background-color: rgba(0,153,204,0.7);
             margin:0px;padding:10px 0 10px 2%;border-left:4px #ff0000 solid; }
#mainPost .bottomEntryLlist { clear:both;border-bottom:2px solid #0099cc;margin:5px 0; }
#mainPost .entryLeft { float:left;padding:15px 5px 5px 5px;width:100px; }
#mainPost .entryRight { float:left;width:70%;
               	width: -webkit-calc(100% - 110px) ;	width: calc(100% - 110px) ; }
#mainPost h3 { margin:10px 0 0 0; }
#mainPost .postdateTop { text-align:right; }
#mainPost .read-more { text-align:right;font-weight:bold; }
#mainPost .read-more a:link, a:visited { color:#0000ff; }

#wp-calendar a:link { color: #0000ff; font-weight: bold; font-size: 1.1em; }
#wp-calendar a:visited { color: #9900cc; font-weight: bold; font-size: 1.0em; }

/*-------------------------------------
	      BLOG COMMENT
-------------------------------------*/
h3#comments {background-color: rgba(0,153,204,0.7);margin:0px;padding:10px 0 10px 2%; 
            border-left:4px #ff0000 solid;  }
h3#comments span { font-weight:normal; font-size:12px; color:#eee; margin-left:20px;}
div.comment { padding:10px;  border: 1px #ccc solid; margin:5px; line-height:1.5em; }
#commentF { margin-top:20px; }
#commentform textarea { width:400px; }
.commentform input { width:300px; }

  @media screen and (max-width : 768px) {
         #commentform textarea { width:95%; }
         .commentform input { width:95%; }
  }
  @media screen and (max-width : 480px) {
         #commentform textarea { width:95%; }
         .commentform input { width:95%; }
  }
/*-------------------------------------
	     Footer
-------------------------------------*/
footer { width:100%;text-align:center;margin:0px auto 0px auto;padding:10px 0 30px 0;
         background:#006699;}

#footer-inner { max-width:1150px;margin:0px auto 0px auto;padding:0; }
#footerGroup { width:250px;float:left;padding:0 1%; }
#footerGroupB { width:70% ; float:left;padding:0 1%;
         width : -webkit-calc(100% - 250px - 4%) ;width : calc(100% - 250px - 4%) ; }


footer li { color:#fff; }
footer li a { display:block;text-decoration:none;}
footer li a:link { color:#66ff66;}
footer li a:visited{ color:#66ff66;text-decoration:none;}
footer li a:hover{ color:#ff0000;text-decoration: none;}

#footerGroup ul { text-align:left;font-size:12px; }
#footerGroup li { padding:5px 0px; }

#footerGroupB ul { text-align:left;font-size:12px; }
#footerGroupB li { float:left;width:20%;padding:5px 0px;text-align:center; }

  @media screen and (max-width : 768px){
      #footer-inner { max-width:100%; } 
      #footerGroup { width:25%;float:left; }
      #footerGroupB { width:70% ; float:left;padding:0 1%;
         width : -webkit-calc(100% - 25% - 4%) ;width : calc(100% - 25% - 4%) ; }
  }
  @media screen and (max-width : 480px) {
      #footer-inner { width:98%;margin:0 1%; } 
      #footerGroup {  width:100%; }
      #footerGroupB {  display:none; }
  }
