@charset "UTF-8";
/* CSS Document */
.bx-wrapper .bx-viewport {box-shadow: none;  border: 0; left: 0;}

.content{ max-width: 1000px; width:100%; margin:0 auto; padding:0 10px;}
a.comingSoon,
a.comingSoon:hover { cursor:default !important; background:inherit; opacity:0.3 !important; }
/*HEADER
====================================*/
#header{background: #fff; width:100%; border-bottom:3px #000 solid; padding:5px 0;}
#header h1{ float:left; width: 40%;}

#btn{ max-width:471px; width:100%; float:right; margin:10px 0;}
#btn a{ display:block; float:left;}
#btn a:nth-of-type(2){ margin:0 13px 0 6px;}
#btn a:nth-of-type(4){ display:none; float:right;}
#btn a:hover, .btnBox #gnav a:hover{ opacity:0.7;}
#btn a[href^="tel:"]{pointer-events:none;}

/*NAVIGATION
====================================*/
#gnav{ width:471px; float:right;}
#gnav a{ display:block; float:left; font-size:12px; text-decoration:none; color:#000; text-align:center; padding:2.5px 4px; border-right:1px #000 solid; line-height:1;}
#gnav a:nth-of-type(1){ border-left:1px #000 solid;}
#gnav a:hover{ opacity:0.6;}

/*FOOTER
===================================*/
footer{border-top:4px #000 solid; padding:24px 0 49px;}
footer .content{ position:relative;}
footer a{ display:block; float:left;}
footer a:nth-of-type(1){ margin-right:35px;}
footer #pageTop{position:absolute; bottom:5px; right:10px; z-index: 999;}

#footerSpBnr { display:none; background:#00b7ee; position:fixed; bottom:0; left:0; width:100%; margin:0; padding:0; z-index:99999999; }
#footerSpBnr ul { width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; }
#footerSpBnr ul li { margin:0; }
#footerSpBnr ul li:nth-of-type(1)  { flex-grow:0; flex-shrink:1; flex-basis:40%; }
#footerSpBnr ul li:nth-of-type(2)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(3)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(4)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li a,
#footerSpBnr ul li a:hover { display:block;  text-align:center; line-height:1; }
#footerSpBnr ul li a img { width:100%; height:auto; }

.cont-w{width: 100%; max-width: 1100px; margin: 0 0 0 calc((100% - 1000px)/2); padding: 0 10px;}
.familytown a:hover{opacity: 0.8;}



/* MARGIN */
.mt40 { margin-top: 40px;}
.mb40 { margin-bottom: 40px;}




/*common*/
#mainNav {padding: 100px 0 40px; display:flex; flex-wrap:wrap; justify-content:space-between;}
#mainNav a{ display:block; flex-basis:calc( ( 100% - 30px ) / 8 );}
#mainNav a img { width:100%; height:auto; }

.wrap {background: url(../img/top/bg_01.png) repeat-y top left, url(../img/top/bg_02.png) repeat-y top right;  }
.wrap .content {background:#fff;}
.wrap .content h2 {margin: 0 auto 50px; text-align: center;}

.mainVisual2 {position: relative;}
.mainVisual2 .abs {position: absolute; left: 0; right: 0; bottom: -65px; margin: 0 auto; display: block; text-align: center;}

@media only screen and (max-width: 1024px){
  .mainVisual2 .abs {bottom: -35px;}
}
@media only screen and (max-width: 768px){
  #mainNav a { display:none; }
}

/*top*/
#top #mainNav {padding: 40px 0 60px;}
#top #box01 {margin: 0 auto 40px;}
#top #box01 .content {border: 1px solid #f29600; position: relative; padding: 0 0 0 270px; height:92px;}
#top #box01 .content .col01 { width:259px; height:90px; left:0px; top:0px; position:absolute;}
#top #box01 .content .col02 { width:100%; height:100%;}
#top #box01 .content .col02  ul { width:100%; height:100%; overflow:auto; overflow-x:hidden; padding:10px 0; }
#top #box01 .content .col02  ul li { font-size:14px; line-height:1.5em; margin:0 0 0.5em 0; position:relative; padding:0 0 0 7em; }
#top #box01 .content .col02 ul li a { color:#666; text-decoration:none; font-weight:bold; }
#top #box01 .content .col02  ul li time { display:block; position:absolute; width:7em; left:0; top:0; }
.mainVisual { position: relative; background: url("../img/top/img_main_01.jpg") center top / 100% auto no-repeat; padding: 50% 0 0 0;}
.mainVisual img { width: 100%; height: auto;}

#commonInfoBox h3 { background: #f90;}
#commonInfoBox ul { background: #fff;}

#top #box02 {margin: 0 auto 30px;}
#top #box02 ul li { margin:0 auto; width:47.6%;}
/* #top #box02 ul li {float: left; width: 47.6%;}
#top #box02 ul li:nth-of-type(2) {float: right;} */

#top #box03 {margin: 0 auto 50px;}
.infoText { text-align:center; font-size:14px; line-height:2em; margin:2em auto; display:block; }

@media only screen and (max-width: 1920px){
  #top .wrap {background-size: 22% auto, 22% auto;}
}

@media only screen and (max-width: 1024px){

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


  #top #box01 .content {border: 1px solid #f29600; position: relative; padding: 0 0 0 0; height:auto;}
#top #box01 .content .col01 { width:100%; height:90px; left:0px; top:0px; position:static; background:#f39800; }
#top #box01 .content .col02 { width:100%; height:200px;}
#top #box01 .content .col02  ul { padding:20px; }
}

@media only screen and (max-width:767px){
  #top #mainNav {padding: 20px 10px; }
  /* #top #box01 {max-width: 259px; margin: 0 auto 30px;}
  #top #box01 .content .col02 {position: static; -webkit-transform: translateY(0); -moz-transform: translateY(0);  -ms-transform: translateY(0);}
  #top #box01 .content .col02 p {padding: 20px;} */
  #top #box02 ul li {float: none !important; width: 100%; max-width: 461px; margin: 0 auto 20px !important;}
  #top #box02 ul li:last-of-type {margin: 0 auto !important;}
  .wrap h2 {background: none !important;}

}




/*outline*/
#outline .wrap {background-color: #f6bad4;}
#outline #box01 {padding: 0 20px 50px;}
#outline #box01 table tr {border-bottom: 2px dashed #a38b78;}
#outline #box01 table tr td {padding: 10px 0; color: #a38b78; font-size: 16px;}
#outline #box01 table tr td p:nth-of-type(1) {margin: 0 0 16px;}
#outline #box01 table .type2 td {padding: 22px 0;}
#outline #box01 .tb01 {float: left; width: 49%;}
#outline #box01 .tb02 {float: right; width: 49%;}

@media only screen and (max-width: 1920px){
  #outline .mainVisual2 .abs img {width: 11.25%; max-width: 216px;}
}

@media only screen and (max-width: 1024px){
  #outline .mainVisual2 .abs img {max-width: 150px !important;}
}
@media only screen and (min-width: 768px){
	.spOnly { display: none; }
	}
@media only screen and (max-width: 767px){
	.pcOnly { display: none; }
	
  #outline .mainVisual2 .abs img {width: 28%;}
  #outline #box01 .tb01 {float: none; width: 100%; margin: 0 auto 20px;}
  #outline #box01 .tb02 {float: none; width: 100%;}
  #outline #box01 table tr td {font-size: 14px;}
}



/*concepthouse*/
#concepthouse {}
#concepthouse .wrap {background-color: #9ed7dc;}
#concepthouse .wrap .content h2 {background: url(../img/concepthouse/h2_bg.png) repeat-x; background-position: center left;}

@media only screen and (max-width: 1920px){
  #concepthouse .mainVisual2 .abs img {width: 19.3%; max-width: 370px;}
}

@media only screen and (max-width: 767px){
  #concepthouse .mainVisual2 .abs img {width: 45%;}
}

/*construction*/
#construction {}
#construction .wrap .bgW {background: #fff; margin: 0 0 50px;}
#construction .wrap .bgW #mainNav {padding: 100px 10px 40px;}
#construction .wrap .bgW .content {background: #fff;}


#construction .wrap {background-color: #ccb8d8; padding: 0 0 50px; background-repeat: repeat-y, repeat-y;}
#construction .wrap .content {background-color: #ccb8d8;}
#construction .decor {position: relative;}
#construction .decor .flag1 {position: absolute; top: 0; left: 0;}
#construction .decor .flag2 {position: absolute; top: 0; right: 0;}

#construction #box01 {background: url(../img/construction/box01_bg.png) no-repeat; background-size: 100% 100%; padding: 80px 50px 50px; margin: 0 auto 50px;}
#construction #box01 .tit {text-align: center; margin: 0 auto 40px;}
#construction #box01 .col01 {float: left; width: 57%;}
#construction #box01 .col01 p {font-size: 18px; line-height: 2; margin: 0 auto 20px;}
#construction #box01 .col02 {float: right; width: 33%;}
#construction #box01 .btn {text-align: center; margin: 50px 0 0;}

#construction #box02 {background: url(../img/construction/box02_bg.png) no-repeat; background-size: 100% 100%; padding: 80px 50px 50px; margin: 0 auto 50px;}
#construction #box02 .tit {text-align: center; margin: 0 auto 40px;}
#construction #box02 .col01 {float: left; width: 55.5%;}
#construction #box02 .col01 p {font-size: 18px; line-height: 2; margin: 0 auto 30px;}
#construction #box02 .col02 {float: right; width: 34%;}
#construction #box02 .btn {text-align: center; margin: 50px 0 0;}


#construction #box03 {background: url(../img/construction/box03_bg.png) no-repeat; background-size: 100% 100%; padding: 100px 50px 50px;}
#construction #box03 .row01 {margin: 0 auto 30px;}
#construction #box03 .row01 .col01 {float: left; width: 72%;}
#construction #box03 .row01 .col01 .tit {margin: 0 auto 30px; text-align: center;}
#construction #box03 .row01 .col01 p {line-height: 2; font-size: 18px;}
#construction #box03 .row01 .col02 {float: right; width: 25%;}

#construction #box03 .row02 table tr {border-bottom: 1px solid #3498ad;}
#construction #box03 .row02 table tr th {color: #3498ad; width: 30%; text-align: center; padding: 10px 0; font-size: 20px; line-height: 1.6;}
#construction #box03 .row02 table tr td {width: 70%; padding: 10px 0; font-size: 18px; line-height: 1.6;}
#construction #box03 .btn {text-align: center; margin: 50px 0 0;}

@media only screen and (max-width: 1920px){
  #construction .mainVisual2 .abs img {width: 18.4%; max-width: 352px;}
}

@media only screen and (max-width: 1024px){
  #construction.mainVisual2 .abs {bottom: -35px;}
}

@media only screen and (max-width:767px){
  #construction .mainVisual2 .abs img {width: 39%;}

  #construction .decor .flag1 img {width: 120px;}
  #construction .decor .flag2 img {width: 120px;}

  #construction #box01 {padding: 80px 30px 50px;}
  #construction #box01 .col01 {float: none; width: 100%; margin: 0 auto 20px;}
  #construction #box01 .col01 p {font-size: 14px;}
  #construction #box01 .col02 {float: none; width: 100%; max-width: 287px; margin: 0 auto;}

  #construction #box02 {padding: 80px 30px 50px;}
  #construction #box02 .col01 p {font-size: 14px;}
  #construction #box02 .col01 {float: none; width: 100%; margin: 0 auto 20px;}
  #construction #box02 .col02 {float: none; width: 100%; text-align: center;}

  #construction #box03 {padding: 80px 30px 50px;}
  #construction #box03 .row01 .col01 {float: none; width: 100%; margin: 0 auto 20px;}
  #construction #box03 .row01 .col02 {float: none; width: 100%; text-align: center;}

  #construction #box03 .row02 table tr th {display: block; width: 100%; font-size: 16px;}
  #construction #box03 .row02 table tr th br {display: none;}
  #construction #box03 .row02 table tr td {display: block; width: 100%; font-size: 14px;}

}




/*landplan*/
#landplan .wrap {background-color: #a7d28d; background-repeat: repeat-y, repeat-y;}
#landplan .wrap .content h2 {background: url(../img/landplan/h2_bg.png) repeat-x; background-position: center left;}
#landplan .wrap .content ul {padding: 0 30px; margin: 0 auto 80px auto;}
#landplan .wrap .content ul li {margin: 0 auto 50px;}
#landplan .wrap .content ul li:last-of-type {margin: 0 0 0;}
#landplan .wrap .content ul li p {color: #a7d28d; font-size: 22px; text-align: center; margin: 0 0 50px; line-height: 1.6;}
#landplan .wrap .content .planBox { }
#landplan .wrap .content .planBox .specBox { position:relative; padding:0 20px; min-height:150px; margin:0 0 40px 0; }
#landplan .wrap .content .planBox .specBox h3 { border-bottom:#a7d28d dotted 1px; padding:0 220px 10px 0; margin:0 0 10px 0; }
#landplan .wrap .content .planBox .specBox p { padding:0 220px 0 0; }
#landplan .wrap .content .planBox .specBox p span { display:inline-block; margin:0 0.5em 0.5em 0; font-size:14px; }
#landplan .wrap .content .planBox .specBox figure { position:absolute; right:40px; top:calc(50% - 75px); width:200px; }
#landplan .wrap .content .planBox .mapBox { margin:0 0 40px 0; padding:0 20px; }
#landplan .wrap .content .planBox .photoBox { }
#landplan .wrap .content .planBox .photoBox ul  { display:flex; flex-wrap:wrap; justify-content:space-between; padding:0 20px; box-sizing:border-box; }
#landplan .wrap .content .planBox .photoBox ul li  { display:block; flex-grow:0; flex-shrink:1; flex-basis:calc( ( 100% - 40px ) / 3 ); margin:0; }
#landplan .wrap .content .planBox .photoBox ul li figure { margin:0 0 10px 0; padding:0; position:relative; }
#landplan .wrap .content .planBox .photoBox ul li figure img { width:100%; height:auto; }
#landplan .wrap .content .planBox .photoBox ul li h4 { margin:0 0 10px 0; font-size:18px; font-weight:bold; color:#333; }
#landplan .wrap .content .planBox .photoBox ul li p { font-size:14px; line-height:2em; color:#333; text-align:left; }
#landplan .wrap .content .planBox .photoBox ul li figure::after { position:absolute; left:0; bottom:0; z-index:2; display:inline-block; content:'image photo'; color:#fff; line-height:1; background:rgba(0,0,0,0.2); padding:5px; }

#landplan hr { outline: none; padding: 0; background: none; box-shadow: none; border-top: none; border-bottom: #ccc dashed 2px; }


@media only screen and (max-width: 1920px){
  #landplan .mainVisual2 .abs img {width: 24.2%; max-width: 464px;}
}

@media only screen and (max-width:767px){
  #landplan .mainVisual2 .abs img {width: 60%;}
  #landplan .wrap .content ul li p {font-size: 18px; font-weight: bold;}

  #landplan .wrap .content .planBox .specBox h3 { padding:0 0 10px 0; }
  #landplan .wrap .content .planBox .specBox p { padding:0 0 0 0; margin:0 0 20px 0; }
  #landplan .wrap .content .planBox .specBox p span { font-size:10px; }
  #landplan .wrap .content .planBox .specBox figure { position:static; margin:0 auto 0 auto; }
  #landplan .wrap .content .planBox .photoBox ul li { flex-basis:100%; margin:0 0 20px 0; }
  #landplan .wrap .content .planBox .photoBox ul li h4 { font-size:14px; }
  #landplan .wrap .content .planBox .photoBox ul li p { font-size:12px; line-height:1.5em;}
}



/*location_access*/
#location_access {}
#location_access .wrap {background-color: #f6c174; background-repeat: repeat-y, repeat-y;}
#location_access .wrap .content h2 {background: url(../img/location_access/h2_bg.png) repeat-x; background-position: center left;}
#location_access .wrap .content .p30 {margin: 0 auto 30px;}
#location_access .wrap .content > p {font-size: 22px; color: #f6c174; margin: 0 auto 30px; text-align: center; line-height: 1.6;}


#location_access .decor {position: relative;}
#location_access .decor .flag1 {position: absolute; top: 0; left: 0;}
#location_access .decor .flag2 {position: absolute; top: 0; right: 0;}

#location_access #box01 {background: url(../img/location_access/box01_bg.png) no-repeat; background-size: 100% 100%; padding: 80px 50px 50px; margin: 0 auto 50px;}
#location_access #box01 .tit {margin: 0 auto 30px; text-align: center;}
#location_access #box01 .btn {text-align: center; margin: 30px auto 0;}
#location_access #box01 .mapWrap{ position: relative; max-width: 840px; margin: 0 auto;}
#location_access #box01 .mapWrap .btnMap{ position: absolute; bottom: 0; left: 2.3%; width: 48%; max-width: 390px;}

#location_access #box02 ul {margin: 50px 0 0;}
#location_access #box02 ul li {float: left; width: 29.7%; margin: 0 5.45% 5.45% 0; position: relative; box-shadow: 3px 5px 10px #ccc;}
#location_access #box02 ul li:nth-of-type(3n) {margin: 0 0 5.45% 0;}
#location_access #box02 ul li .icon {position: absolute; top: -40px; right: 25px;}

@media only screen and (max-width: 1920px){
  #location_access .mainVisual2 .abs img {width: 21.1%; max-width: 404px;}
}
@media only screen and (max-width:767px){

  #location_access .mainVisual2 .abs img {width: 55%;}

  #location_access .wrap .content > p {font-size: 18px; font-weight: bold;}

  #location_access #box01 { padding: 80px 20px 50px;}
  #location_access #box01 .mapWrap{ position: static;}
  #location_access #box01 .mapWrap .btnMap{ position: static; width: 100%; margin: 30px 0 0; text-align: center; max-width: none;}

  #location_access #box02 ul li {width: 49% !important; margin: 0 2% 40px 0 !important;}
  #location_access #box02 ul li:nth-of-type(2n) {margin: 0 0 40px 0 !important;}
  #location_access #box02 ul li .icon {top: -20px; right: 10px;}
  #location_access #box02 ul li .icon img {width: 30px;}

}




/*facility*/
#facility { }
#facility .wrap {background-color: #f8c4ae; background-position: left center, right center;}
#facility .wrap .bgW {background: #fff; margin: 0 0 50px;}
#facility .wrap .bgW #mainNav {padding: 100px 10px 40px;}
#facility .wrap .bgW .content {background: #fff;}

#facility .wrap #box01 {text-align: center; padding: 50px 10px;}

@media only screen and (max-width: 1920px){
  #facility .mainVisual2 .abs img {width: 18.5%; max-width: 352px;}
}

@media only screen and (max-width: 1024px){
  #facility .mainVisual2 .abs {bottom: -35px;}
}

@media only screen and (max-width:767px){
  #facility .mainVisual2 .abs img {width: 35%;}
}


/*characteristic*/
#characteristic {}
#characteristic .wrap {background-color: #90d2e8; background-repeat: repeat-y, repeat-y;}
#characteristic .wrap #box01 h2 {background: url(../img/characteristic/h2_bg.png) repeat-x; background-position: center left; margin: 0;}
#characteristic .wrap #box02 {max-width: 1400px; width: 100%; margin: 0 auto; background: #90d2e8 url(../img/characteristic/bg.jpg) repeat-y; background-position: center center;}

@media only screen and (max-width: 1920px){
  #characteristic .mainVisual2 .abs img {width: 20%; max-width: 380px;}
}

@media only screen and (max-width: 767px){
  #characteristic .mainVisual2 .abs img {width: 55%;}
}



/* CHARM */
#charm .wrap { background-color:#cce198;background-position: left center, right center; }
#charm img { width:100%; height:auto; }

#charm .charmVisual { margin:0 0 40px 0; }
#charm .bnrBox1 { margin:0 0 40px 0;}
#charm .bnrBox1 ul {display:flex; flex-wrap:wrap; justify-content:space-between; }
#charm .bnrBox1 ul li { flex-grow:0; flex-shrink:1; flex-basis:calc( ( 100% - 20px ) / 3 ); margin:0 0 10px 0; }
#charm .bnrBox1 ul li a { display:block; text-align:center; font-size:16px; color:#333; text-decoration:none; line-height:2em; font-weight:bold; }
#charm .bnrBox1 ul li a:hover { opacity:0.7; color:#333 ; text-decoration:none; }
#charm .bnrBox1 ul li a img { margin:0 0 10px 0; }

#charm .bnrBox2 { }
#charm .bnrBox2 ul { display:flex; flex-wrap:wrap; justify-content:space-between; }
#charm .bnrBox2 ul li { flex-grow:0; flex-shrink:1; flex-basis:calc(50% - 10px); margin:0 0 10px 0; }
#charm .bnrBox2 ul li a { display:block;  }
#charm .bnrBox2 ul li a:hover { opacity:0.7; }

#charm .subTitle::before,
#charm .subTitle::after { width:calc(50% - 5em); }

@media only screen and (max-width: 1920px){
  #charm .mainVisual2 .abs img {width: 11.25%; max-width: 216px;}
}

@media only screen and (max-width: 1024px){
  #charm .mainVisual2 .abs img {max-width: 150px !important;}
}

@media only screen and (max-width: 767px){
  #charm .mainVisual2 .abs img {width: 28%;}
}
@media screen and (max-width:768px) {
#charm .bnrBox1 ul li { flex-basis:75%; margin:0 12.5% 20px 12.5% ; }
#charm .bnrBox1 ul li a { font-size:4vw; }
#charm .bnrBox2 ul li { flex-basis:100%; }

}




.posRel{position:relative;}
.posAbs{position:absolute; top:0; left: 0; width:100%;}
/*===============================
             MEDIA
================================*/
@media only screen and (max-width:1200px){
.cont-w{margin: 0 auto;}
}

@media only screen and (max-width:1100px){
}

@media screen and (min-width:0\0) and (min-width:1000px){  /* IE */

}

@media only screen and (max-width:950px){
  #header{padding:10px 0 !important; }
  #header h1{ width:45.4%;}
  #header h1 img{ width:100%;}

  #btn, #gnav{ width:50.6%;}
  #btn{ margin:10px 0 5px 0;}
  #btn a:nth-of-type(1), #btn a:nth-of-type(2){ width:21%;}
  #btn a:nth-of-type(2){ margin:0 3% 0 1%;}
  #btn a:nth-of-type(3){ width:54%;}

  footer{ padding:4% 0 6% 0; background-size: auto 100%;}
  footer a{ width:38%;}
  footer a:nth-of-type(1){ margin-right:3%;}
  footer #pageTop{ width:17%;}
}

@media only screen and (max-width: 768px){
  #gnav a {min-width: 50px; margin: 0 0 5px 0;}
}

@media only screen and (max-width:767px){
  #header{ position:fixed; z-index:9999;}
  #header .content{ padding:0;}
  #header h1{ width:50%; padding-left:10px;}

  #btn{ width:45%; margin:2% 0 0 0; padding-right:10px;}
  #btn a:nth-of-type(3){ display:none;}
  #btn a:nth-of-type(4){ width:17%; display:block;}
  #btn a:nth-of-type(1), #btn a:nth-of-type(2){ width:39%; margin:0 2.5% 0 0;}
  #btn a[href^="tel:"]{pointer-events:auto;}

  #gnav{ width:100%; position:fixed; display:none; z-index:999;}
  #gnav a{ width:50%; border-left:none !important; border-right:1px #fff solid; border-bottom:1px #fff solid; padding:4% 0; font-size:4vw; background:#828080; color:#fff; min-width: auto; margin: 0;}
  #gnav a:nth-of-type(2n){ border-right:none;}
  #gnav .active, #gnav a:hover{ background:#000; color:#fff;}
  #gnav a:hover{ opacity:1;}

  footer{ padding:6% 0 18% 0; text-align:center;}
  footer .content{ padding-bottom:12%;}
  footer a{ display:block; margin:0 auto 4% !important; float:none;}
  footer a:nth-of-type(1){ max-width:375px; width:85%;}
  footer a:nth-of-type(2){ max-width:700px; width:90%; margin-bottom:0 !important;}
  footer #pageTop{ width:148px; position:fixed; right:5px; bottom:21vw; margin:0 !important;}
  #footerSpBnr { display:block; }

  #mainNav{width: 100%; max-width: 534px; margin: 0 auto;}
  #mainNav a{width: 31.1%; margin: 0 3.35% 3.35% 0;}
  #mainNav a:first-of-type{margin: 0 3.35% 3.35% 0;}
  #mainNav a:nth-of-type(3n){margin: 0 0 3.35% 0;}

}

@media only screen and (max-width:480px){
  footer #pageTop{ width:105px;}
}