
/* =================================== */
/*	Basic Style 
/* =================================== */

body {
background-color: #fff;
font-family: "STHeitiTC-Light", "メイリオ", serif;
line-height: 21px;
font-size: 14px;
color: #6a737b;
}

ol, ul {
margin: 0;
padding: 0;
list-style: none;
}

figure, p {
margin: 0;
}

a {color: #fff;
-webkit-transition: all .3s ease-in 0s;
-moz-transition: all .3s ease-in 0s;
-ms-transition: all .3s ease-in 0s;
-o-transition: all .3s ease-in 0s;
transition: all .3s ease-in 0s;
}

iframe {
border: 0;
}

a, a:focus, a:hover {
text-decoration: none;
outline: 0;
}

a:focus, a:hover {
color: #000;
}

h1,  h3,
h4, h5, h6 {
font-weight: bold;
margin: 0px 0px 10px 0px;
}
h2{margin-top: 20px;}

.clear:before,
.clear:after {
content: " ";
display: table;
}
 
.clear:after {
clear: both;
}
 
.clear {
*zoom: 1;
}

span.color {
color: #007199;
}

body > section,
.footer {
padding: 10px 0;
}

.sec-title {}

.sec-title h2 {
color: #7e5402;
font-size: 28px;
font-weight: 800;
text-transform: uppercase;
}

.sec-sub-title {
margin: 35px 0 45px;
}

.sec-sub-title p {
font-weight: 600;
line-height: 28px;
font-size: 18px;
color: #5b646e;
}

.sec-sub-title a {
font-weight: 600;
line-height: 24px;
font-size: 18px;
color: #ff0000;
}

.devider {
margin-top: 30px;
}

.devider i {
color: #cccccc;
}

.devider:before,
.devider:after {
content: "______________________";
color: #e6e8ea;
position: relative;
bottom: 6px;
}

.devider:before {
right: 10px;
}

.devider:after {
left: 10px;
}

.mb50 {
margin-bottom: 50px;
}

#preloader {
background-color: #fff;
height: 100%;
position: fixed;
width: 100%;
z-index: 1100;
}

#preloader > img {
position: absolute;
top: -100%;
left: -100%;
right: -100%;
bottom: -100%;
margin: auto;
}

.inline-block_ozn {
display:  inline-block; 
padding:  10px; 
vertical-align:  middle; 
text-align: left;
}

.inline-block_ozn a{color: #ff0000;}
/*=========================================
	Header
==========================================*/

#navigation {
background-color: #000;
border: 0 none;
margin: 0;
-webkit-transition: background-color 800ms linear;
-moz-transition: background-color 800ms linear;
-ms-transition: background-color 800ms linear;
-o-transition: background-color 800ms linear;
transition: background-color 800ms linear;
}

.navbar-toggle i {
color: #fff;
}

.navbar-brand {
padding: 0;
}

.navbar-nav li a {
border-top: 1px solid transparent;
font-weight: 700;
}

.navbar-nav li a.current,
.navbar-nav li a:focus,
.navbar-nav li a:hover {
background-color: transparent;
border-top: 2px solid #FFF;
color: #fff;
}



/*=========================================
 Slider
==========================================*/

#slider {
	padding: 0;
}

#slider .carousel-inner .item {
  background-size: cover;
}

.carousel-caption {
  top: 40%;
}

.carousel-caption h2 {
  font-size: 50px;
  font-weight: 300;
}

.carousel-caption h2 span {
  font-weight: 800;
}

.carousel-caption h3 {
  font-size: 40px;
  font-weight: 300;
  margin: 6px 0 20px;
}

.carousel-caption p {
  color: #fff;
  font-size: 18px;
  font-weight: 300;
}

.carousel-caption p:before,
.carousel-caption p:after {
color: #007199;
content: "___";
position: relative;
top: -8px;
}

.carousel-caption p:before {
  right: 20px;
}

.carousel-caption p:after {
  left: 20px;
}

.social-links {
  margin-top: 5%;
}

.social-links li {
	display: inline-block;
}

.social-links li a {
  color: rgba(255, 255, 255, 0.9);
  display: block;
  margin: 0 6px;
}

.social-links li a:hover {
  color: #fff;
}

.carousel-indicators {
  bottom: 10px;
  left: inherit;
  margin: 0;
  right: 30px;
  top: 49%;
  width: 0;
}

.carousel-indicators li {
  border: 1px solid rgba(255, 255, 255, 0.3);
  height: 8px;
  width: 8px;
}

.carousel-indicators .active {
  height: 8px;
  width: 8px;
}



/*=========================================
	Topics
==========================================*/

.topics {
background-color: #f9f8f4;
background-image : url(img/ph_back01_0003m.jpg);
}

.owl-controls {
  bottom: 5px;
  margin-top: 10px;
  position: relative;
  text-align: center;
}

.owl-controls .owl-page {
  display: inline-block;
}

.owl-controls .owl-page span {
  border: 1px solid #C7CED3;
  border-radius: 20px;
  display: block;
  height: 8px;
  margin: 5px 4px;
  width: 8px;
}

.owl-controls .owl-page.active span {
  background: #062033;
  border: 0;
}

.service-icon {
  border: 1px solid #b40e0e;
  border-radius: 5px;
  color: #b40e0e;
  float: left;
  padding: 10px;
}

.service-desc {
  margin-left: 70px;
  position: relative;
  top: 5px;
margin-bottom: 50px;
}

.service-desc h3 {
  color: #062033;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 25px;
}




/*=========================================
	Photo
==========================================*/

.photo-filter {
  margin-bottom: 35px;
}

.photo-filter ul li {
    display: inline-block;
}

.photo-filter ul li a {
  color: #062033;
  display: block;
  font-size: 14px;
  font-weight: 700;
  padding: 5px 17px;
  border-radius: 6px;
  text-transform: capitalize;
}

.photo-filter ul li a:hover,
.photo-filter ul li a.active {
  background-color: #007199;
  border-radius: 5px;
  color: #fff;
  padding: 5px 17px;
}

.mix {
    display: none;
}

.photo-item {
    float: left;
    width: 25%;
    position: relative;
}

.photo-item > img {
  display: block;
  height: auto;
  max-width: 100%;
}

.overlay {
	background-color: rgba(0,0,0,.1);
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	color: #fff;
	
	opacity: 0;
	filter: alpha(opacity=0);
	
	-webkit-transition: all 450ms ease-out 0s;	
	   -moz-transition: all 450ms ease-out 0s;
		 -o-transition: all 450ms ease-out 0s;
		    transition: all 450ms ease-out 0s;
		  

}

.photo-item:hover .overlay {
	opacity: 1;
	filter: alpha(opacity=100);
	

}

.photo-item .overlay a {
  display: inline-block;
margin-top: 20%;
margin-bottom: 20%;
  padding: 0px 0px;
}

.photo-item .overlay a:hover {
  color: #fff;
}

/*=========================================
	System
==========================================*/
.system{padding: 10px;}
.system h3{margin: 10px 0px 10px 0px;}
.system h4{font-size: 22px;color:#000;}

.table1{
width: 100%;
font-size: 18px;
border-collapse: collapse;
margin: 10px 0px 10px 0px;
}
.table1 th{
width: 25%;
padding: 10px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #eee;
border: 1px solid #b9b9b9;
}
.table1 td{
padding: 10px;
background-color: #fff;
border: 1px solid #b9b9b9;
}

.table2{
width:60%;
font-size: 18px;
border-collapse: collapse;
margin: 10px 0px 10px 0px;
}
.table2 th{
width: 25%;
padding: 10px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #eee;
border: 1px solid #b9b9b9;
}
.table2 td{
padding: 10px;
background-color: #fff;
border: 1px solid #b9b9b9;
}

.boxsys{
width:60%;
line-height: 24px;
margin: 10px 0px 20px 0px;
padding: 10px;
border: 1px solid #b9b9b9;
border-radius: 5px;
}
.osusume{color: #FFFFFF; margin: 20px 0px 20px 0px; padding: 10px;background-color: #005920; border-radius: 5px;}

/*=========================================
	Some
==========================================*/

#facts {
	background-image: url("../img/parallax/city.jpg");
	background-attachment: fixed !important;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0;
}

.facts .devider:before,
.facts .devider:after {
	color: #737C85;
}

.facts .devider i {
	color: #fff;
}

.parallax-overlay {
	background-color: rgba(6,32,51,.4);
	padding: 70px 0;
}

.counters-item {
  color: #fff;
}

.counters-item i {
  border: 1px solid #737C85;
  border-radius: 50%;
  color: #fff;
  display: inline-block;
  height: 120px;
  margin: 0 0 35px;
  padding: 40px 0 0;
  width: 120px;
}

.counters-item strong {
  display: block;
  font-size: 60px;
  font-weight: 600;
  line-height: 60px;
}

.counters-item p {
  font-size: 18px;
  line-height: 24px;
  margin-top: 15px;
  text-transform: uppercase;
}


/*=========================================
	Contact Us
==========================================*/

.contact {
	padding-bottom: 0;
}

.contact-address h3 {
  color: #062033;
  font-size: 22px;
  line-height: 32px;
  margin-bottom: 25px;
}

.contact-address p {
  line-height: 24px;
}

#formWrap {
    width: 100%;
    margin: 0 auto;
    color: #555;
    line-height: 120%;
    font-size: 90%;
}

table.formTable {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
}

table.formTable td, table.formTable th {
    border: 1px solid #ccc;
    padding: 10px;
    background: #fff;
}

table.formTable th {
    width: 30%;
    font-weight: normal;
    background: #efefef;
    text-align: left;
}

input[type=text] {
    height: 30px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

textarea {
    height: 70px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

#map_canvas {
  height: 450px;
  width: 100%;
}



/*=========================================
	footer
==========================================*/


.footer {
background-image: url("../img/footerbg.jpg");
  border-top: 5px solid #062033;
  color: #fff;
}

.footer a:hover {
  color: #062033;
}

.about-us p {
  line-height: 24px;
}

.footer-single .subscribe {
  margin-bottom: 15px;
  position: relative;
}

.copyright {
  color: #fff;
  margin-top: 20px;
}
.fan {
  color: #fff;
  margin-top: 20px;
  margin-bottom: 30px;
}

#back-top {
padding: 0px 10px 5px 10px ;
  bottom: 20px;
  position: fixed;
  right: 25px;
  z-index: 9;
 border-radius: 5px;
background: #007199;
}
