
.hpt, .portMenuMob { display:none }

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {    position: absolute;    bottom: -20px;    width: 96px;    right: 67px; }
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {    background: #fff; }
.bx-wrapper .bx-pager.bx-default-pager a {     background: #bfbebe;   }


.contactAddress, .feed-back { float:left; width:calc(50% - 0px);  } .feed-back { padding-left:60px; border-left:1px solid #737373 }
.contactAddress { padding-top:50px }
.clear { clear:both; float:none }


.scrlBtns {    top: auto;  right: 0;  bottom: 75px;  left: 0;  margin: auto;  width :10px;  height: 25px;  z-index:12000; position:absolute; }
.mousey {  width: 3px;  padding: 5px 8px;  height: 15px;  border: 2px solid #fff;  border-radius: 25px;  opacity: 0.75;  box-sizing: content-box; }
.scrollerBtn {  width: 3px;  height: 10px;  border-radius: 25%;  background-color: #fff;  animation-name: scroll;  animation-duration: 2.2s;  animation-timing-function: cubic-bezier(.15,.41,.69,.94);  animation-iteration-count: infinite; }
.fp-viewing-ashely .mousey {
  width: 3px;   padding: 10px 11px;  height: 25px;  border: 2px solid #000;
  border-radius: 25px;   opacity: 0.75;   box-sizing: content-box; }
.fp-viewing-ashely  .scrollerBtn {  width: 3px;  height: 10px;  border-radius: 25%;  background-color: #000;  animation-name: scroll;  animation-duration: 2.2s;  animation-timing-function: cubic-bezier(.15,.41,.69,.94);  animation-iteration-count: infinite; }
@keyframes scroll {  0% { opacity: 0; }  10% { transform: translateY(0); opacity: 1; }  100% { transform: translateY(15px); opacity: 0;} }
.slides { position:absolute; left:0; top:0; width:100%; height:100%;  }
.flexslider { height:100%; width:100%; position:absolute }
.slides li { height:100vh !important;  background-size:cover; background-position:center center }
.flex-control-thumbs { position:absolute  !important; right:-400px; top:0  !important; z-index:20000 !important; width:400px; height:100vh !important; background-color:#fff; padding:5px; overflow:scroll; transition:all 0.5s ease  }
.slides li span { opacity:0 !important; display:none }
.flex-control-thumbs li {    width: 33% !important;    float: left;    margin: 0; }
.hider, .closer {   transform: rotateZ(180deg); content:""; display:block; width:45px; height:100vh; position:absolute; z-index:1000;/* left:100px; */ left:auto; right:40px;
    }   
.closer  {  transform: rotateZ(0deg);}

.closer {  z-index:1000; right:-100px; transition:all 0.5s ease } 
.hider a:link, .hider a:visited,.closer a:link, .closer a:visited { display:block;  width:100%; height:100px; background-color:rgba(255,255,255,0.5);   position: absolute;  top: 50%;  -ms-transform: translateY(-50%);  transform: translateY(-50%);    }

.portMenu { position:fixed; top:55px; left:115px; z-index:1000; border:1px solid #8e8e8e  }
.portMenu .ddsmoothmenu a:link, .portMenu .ddsmoothmenu a:visited { display:block; padding:15px 30px; color:#fff; font-size:11pt;  }
.portMenu .ddsmoothmenu ul li ul li  a:link, .portMenu .ddsmoothmenu ul li ul li a:visited {
	background-color:rgba(0,0,0,0.5); font-size:10pt !important; padding:10px 15px; border-bottom:1px solid #373737 }
	.portMenu .ddsmoothmenu ul li ul { background-color:transparent !important }
.portMenu .ddsmoothmenu ul li ul li  a { width:160px }
.flex-direction-nav { opacity:0.5 }

@media only screen and (max-width: 1333px) {

}
@media only screen and (max-width: 1100px) {
.ml16, .animTitle, .anT01, .anT02, .anT03, .anT04, .anT05 { font-size:19pt }
}

/* Portrait */
@media (max-width: 1024px) 
  and (orientation: portrait) {
	  .port-ind-page li {    width: calc(50% - 0px); height:50vh; border-bottom:1px solid #fff; background-size:100% 100%; transition:all 0.5s ease }
.port-ind-page li:nth-child(2n) { margin-left:50%   }
.port-ind-page li:nth-child(3n), .port-ind-page li:nth-child(4n) { top:50%;  margin-left:0; border-top:1px solid #fff; border-bottom:0px solid #fff }
.port-ind-page li:nth-child(4n) {  margin-left:50% }
.port-ind-page li:hover { width:50%; z-index:1200; margin-left:0   }
.port-ind-page li:hover:nth-child(2n), .port-ind-page li:hover:nth-child(3n) { left:0% }
.portfolio-page .align {    } 
.port-ind-page li:hover:nth-child(2n) { margin-left:50% } .port-ind-page li:hover:nth-child(5n) { margin-left:50%  }
.port-ind-page li:hover { background-size:110% 110%;  }
.hider { display:none }

  }



@media only screen and (max-width: 1080px) {

}
@media only screen and (max-width: 1000px) {
	body.portPage {  width:100%; overflow-y:auto !important; position:relative; height:auto !important }
	
	.hider, .closer { display:none }
 .slides li span { display:block  !Important; opacity:0 !Important
}
#portfolio { padding:55px 30px 30px 100px; background-color:#fff; width:calc(100% - 0px) }
#portfolio li { display:block; width:33.333%; float:left; border:2px solid #fff  }
#portfolio li img {
    aspect-ratio: 3/2;
    object-fit: cover;
}
#portfolio .slides li { height:auto !important }
#portfolio .slides { position:relative }
.expand-icon { display:none }
	
.portPage { }
.portPage:before { content:""; display:block; position:fixed; z-index:100; background-color:#fff; top:0; left:0; height:57px; width:100% }
.portPage .logo { color:#000 } 
.portPage  #nav-icon2 span {
    background: #4e4a4a;
}


.pageTitle, .pageTitleProt {
    position: fixed;
    top: 60px;
    left: 120px;
    z-index: 120200;
    text-transform: uppercase;
    font-size: 22pt;
    color: #000;
    text-shadow: 0px 0px 0px rgb(150 150 150);
    transition: all 0.5s ease;
    border: none;
    padding: 11px ​0px;
    width: 200px;
    text-align: center;
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.pageTitle, .pageTitleProt { padding:10px 0 !important  }

	.menAct  { background-color:#fff }
	
	.portMenu { right:15px; top:5px; border:1px solid #B7B3B3; left:auto; z-index:16000 }
	.portMenu .ddsmoothmenu a:link, .portMenu .ddsmoothmenu a:visited { color:#000 }
	
}
@media only screen and (max-width: 900px) {
	
.contact-page.openPage article {
    width: calc(666px - 0px);
}
.contactAddress { width:calc(300px - 0px) }
.feed-back { width:calc(350px - 0px) }




}


@media only screen and (max-width: 860px) {
	
	.frame-top, .frame-bottom, .frame-right, .frame-navi, .frame-top-index, .frame-bottom-index, .frame-right-index, .frame-navi-index { height:15px } 
.frame-right, .frame-right-index { width:15px; height:100% }
.frame-navi, .frame-navi-index { height:100%; width:55px; }
	
	.frame-top, .frame-top-index, .frame-right, .frame-right-index, .frame-bottom, .frame-bottom-index { height:5px; display:none }	
.frame-navi { width:30px } .frame-right { width:5px }
.menu-block {    position: fixed;    top: 15px;    left: auto ;    transform: translate(0, 0);    -ms-transform: translate(0, 0); right:15px } #nav-icon2 span { background:#fff }
#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) { top:19px }
#nav-icon2.open span:nth-child(5), #nav-icon2.open span:nth-child(6) { top:10px }
.expand-icon {    position: fixed;    top: 16px;    z-index: 10000;    right: 61px; }
.frame-navi, .frame-navi-index { background-color:transparent !important }
.logo { color:#fff;         font-size: 26pt;    padding-top: 12px;    text-align: center; }
.flex-control-thumbs { width:265px !important; }
.scrlBtns, .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto, .nav-foot { bottom:15px }
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { right:15px; bottom:15px !important }
.nav-foot { bottom:8px }
.menu-block p { display:none } 
#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 { width:26px }

.about-page .align, .contact-page .align, .portfolio-page .align {
    width: calc(100% - 0px);
    margin:0px;
    height: calc(100% - 0px);
    opacity: 0;
}


.portPage  .frame-navi { height:60px }
.portPage .nav-foot { display:none }

#portfolio { padding:55px 2px 30px 2px; background-color:#fff }
#portfolio li { display:block; width:33%; }

#portfolio li img {
    aspect-ratio: 4/2;
    object-fit: cover;
}
.portPage .logo { padding:15px 0 0 15px }
.menu-block { top:17px }
	.portMenu  { right:55px }
}

@media only screen and (max-width: 800px) {
.contact-page.openPage article {
    width: calc(600px - 0px);
}
.contactAddress { width:calc(300px - 0px) }
.feed-back { width:calc(300px - 0px) }


.pageTitle {
    position: fixed;
    top: 60px;
    left: 120px;
    z-index: 120200;
    text-transform: uppercase;
    font-size: 16pt;
    color: #000;
    text-shadow: 0px 0px 0px rgb(150 150 150);
    transition: all 0.5s ease;
    border: none;
    padding: 11px ​0p;
    width: 200px;
    text-align: center;
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

}

@media only screen and (max-width: 768px) {


.animTitle, .anT01, .anT02, .anT03, .anT04, .anT05 { font-size:16pt }
.hme-btn a:link, .hme-btn a:visited { padding:10px 0 }
.center-item { width:203px; font-size:14pt }
.ml16, .animTitle, .anT01, .anT02, .anT03, .anT04, .anT05 { font-size:16pt }
.about-text h3 { font-size:20pt; }

.menAct  { z-index:600000      }

.pageTitle, .pageTitleProt { font-size:14pt; padding-top:17px !important }
.portMenu .ddsmoothmenu a:link, .portMenu .ddsmoothmenu a:visited { font-size:10pt }

}


/* Portrait */
@media (max-width: 768px) 
  and (orientation: landscape) { 
  .port-ind-page li { background-size:cover }
  .port-ind-page li:first-child { background-position:center center }
  }

/* Portrait */
@media (max-width: 768px) 
  and (orientation: portrait) { 



}

@media only screen and (max-width: 668px) {


.about-page.openPage article, .contact-page.openPage article, .portfolio-page article { width:90% }

.contact-page.openPage article {
    width: calc(100% - 0px); padding:0 15px; 
}
.contactAddress { width:calc(100% - 0px); padding:0; border:none }
.feed-back { width:calc(100% - 0px); padding:0; border-left:none; border-top:1px solid #DCDCDC; padding-top:5px; margin-top:20px  }



.about-text h3 { font-size:16pt; }
.page-title { font-size:14pt; }
.portMenuMob { position:fixed; z-index:12000; display:block; text-align:center; text-transform:uppercase }
.portMenu, .portMenuMob { top:auto; bottom:0; right:0; width:calc(100% - 0px); left:0; background-color:rgba(255,255,255,0.9);  }
.portMenu { display:none  }
.portMenu .ddsmoothmenu a:link, .portMenu .ddsmoothmenu a:visited, .portMenuMob a:link, .portMenuMob a:visited { padding:10px 15px;  width:calc(100% - 0px); float:none; display:block }
.port-ind-page p { font-size:14pt }
.port-ind-page li p span {    width: calc(150px - 0px); }
.portPage { padding-bottom:30px }
.portMenu .portMenu .ddsmoothmenu ul li ul li a:link, .portMenu .portMenu .ddsmoothmenu ul li ul li a:link   { display:none !important }

}

@media only screen and (max-width: 488px) {

#portfolio li { display:block; width:100%; }
#portfolio li img {
    aspect-ratio: 4/2;
    object-fit: cover;
}
.pageTitle { padding:15px ​0 }

}