/* CSS Document */

body {	-webkit-text-size-adjust:100%; font-family: 'PT Sans', sans-serif;; overflow-x: hidden; }
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; 
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { margin:0; padding:0; 
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

.content-Box { max-width:1400px; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 17px; line-height:24px; color: #333; padding-top: 120px; letter-spacing: 0.05rem;}
#content p{ padding-bottom: 28px;}

.banner { margin-bottom: 0px;}
.loop .owl-dots { }
.loop .owl-item {position: relative;}
.loop .owl-nav { position: absolute; top:calc(50% - 50px); width: 100%; z-index: 11;}
.loop .owl-prev, .loop .owl-next { position:absolute; z-index:100; top:calc(50% - 40px); background:none !important;}
.loop .owl-prev { left:0px; }
.loop .owl-next { right:0px;}
.loop .owl-prev:before, .loop .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #fff; opacity: 0.3;transition: all 0.4s ease-out 0s;width: 107px; height: 107px; background-size: contain; display: block;}
.loop .owl-prev:before { background-image:url(../images/left-arrow.png); content: ""; }
.loop .owl-next:before { background-image:url(../images/right-arrow.png); content: ""; }
.loop .owl-prev:hover:before, .loop .owl-next:hover:before { opacity: 1;}
.loop .owl-stage-outer {z-index: 2;}
.loop .owl-dots { position: absolute; z-index: 100; bottom: 14px; width: 100%; text-align: center !important; padding: 0 50px; }
.loop .owl-dots .owl-dot span, .loop  .owl-dots .owl-dot span { background: #666666 !important; width: 13px !important; height: 13px !important; border: 0px solid #4c4c4c;}
.loop .owl-dots .owl-dot.active span, .loop  .owl-dots .owl-dot:hover span { background: #ffffff !important; }

.idx-pro-bg { background: #f6f8f7; padding: 50px 20px;}
.idx-pro-list { display: flex; flex-wrap: wrap; margin-right: -5px;}
.idx-pro-list > a { display: block; position: relative; margin: 0 5px 5px 0; overflow: hidden; width: calc(20% - 5px); line-height: 0;}
.idx-pro-list > a img { width: 100%; transition: all 0.2s ease-out 0s;}
.idx-pro-list > a:hover img { transform: scale(1.1); }
.idx-pro-list > a:hover:before { transform: scale(0.9); box-shadow:inset 0px 0px 0px 2px rgba(255,255,255,1);}
.idx-pro-list > a:hover .idx-pro-name { top:8%; padding-left: 15px; padding-right: 15px;}
.idx-pro-list > a:hover .idx-pro-name:before { height: 0;}
.idx-pro-list > a:before { content: ""; position: absolute; width: 100%; height: 100%; box-shadow:inset 0px 0px 0px 0px rgba(255,255,255,1); z-index: 2;transition: all 0.2s ease-out 0s;}
.idx-pro-name { position: absolute; width: 90%; left: 5%; top:45%; padding-top: 20px; color: #fefefe; font-size: 20px; font-weight: bold; transition: all 0.2s ease-out 0s; z-index: 3; line-height: 120%;}
.idx-pro-name:before { content: ""; position: absolute; width: 100%; height: 4px; left: 0; top:0; background: #fefefe;  transition: all 0.2s ease-out 0s; z-index: 3;}

.idx-main-section { padding: 55px 20px 70px 20px;}
.idx-about { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between;}
.idx-about > div { margin-bottom: 35px; width: calc(50% - 15px);}
.idx-about > div:nth-of-type(1) { background: #1e659f; padding: 60px 55px; color: #fff;}
.idx-about > div:nth-of-type(1) h1 { font-size: 24px; padding-bottom: 14px;}
.idx-about > div:nth-of-type(2) { background: url(../images/idx-main-1.jpg) no-repeat top center; background-size: cover;}

.btn01 a { display: block; width: 134px; line-height: 46px; border: 2px solid #fff; text-align: center; color: #fff; font-size: 17px;}

.idx-link { display: flex; flex-direction: row; flex-wrap: wrap; margin-right: -46px;}
.idx-link > div { margin: 0 46px 35px 0; width: calc(33.33% - 46px);}
.idx-link-pto { line-height: 0; margin-bottom: 13px; overflow: hidden;}
.idx-link-pto img { width: 100%;}
.idx-link-name { font-size: 19px; color: #555555;}

@media only screen and (max-width:  1279px) {
	#content { padding-top: 100px;}
	
    .idx-pro-bg {padding: 20px;}
    
}
@media only screen and (max-width: 980px) {
    .idx-pro-list > a { width: calc(33.33% - 5px); }
    .idx-pro-name { font-size: 16px; padding-top: 15px; }
    
    .idx-main-section { padding: 25px 20px 25px 20px;}
    .idx-about { flex-direction: column;}
    .idx-about > div { width: 100%;}
    .idx-about > div:nth-of-type(1) { padding: 35px 25px;}
    .idx-about > div:nth-of-type(2) { display: none;}
    
}
@media only screen and (max-width: 768px) {
    .loop .owl-dots { bottom: 4px; }
    .idx-pro-list > a { width: calc(50% - 5px); }
    
}
@media only screen and (max-width: 640px) {
    .idx-link > div { width: calc(100% - 46px);}
	
}
@media only screen and (max-width: 570px) {
    
	
}

@media only screen and (max-width: 414px) {
	
	

}

@media only screen and (max-width: 320px) {

}