/* header */
.header {
	background: #000;
	position: fixed;
	z-index: 100000;
	width: 100%;
	top: 0;
}

	.afterheader {
		margin-top: 56px;
	}

	.header .headlogo img {
		width: 170px;
		height: auto;
	}

		.header .headlogo img {
			width: 170px;
			height: auto;
		}

.headmenu {
	padding: 0 0 0 ;
	margin-left: 40px;
}

	.headmenu ul {
		margin-top: 0;
		margin-bottom: 0;
		padding: 0;
		list-style: none;
		line-height: 1;
    }

	.headmenu > ul > li {
    	display: inline-block;
	}

		.headmenu > ul > li > a {
			color: #ccc;
			padding: 22px 20px 21px;
			display: block;
			font-weight: bold;
		}

		.headmenu > ul > li.active > a {
			background: #333;
		}

		.headmenu > ul > li.hover > a,
		.headmenu > ul > li > a:hover,
		.headmenu > ul > li > a:focus,
		.headmenu > ul > li > a:active {
			color: #444;
			background: #fff;
		}

		.headmenu > ul > li > a > ul > a {
			font-weight: bold;
		}


.headbar_second {}

	.headbar_second ul li {
		padding: 5px 0;
	}

	.headbar_second ul.list-btns li {
		display: inline-block;
		padding-right: 15px;
	}

	.headbar_second ul.list-btns.list-btns-light li {
		padding-right: 0;
		padding-left: 15px;
	}

		.headbar_second ul.list-btns li span {
			margin-right: 5px;
		}

.headmenu_sub {
	padding: 20px 0 0 0;
}

	.headmenu_sub ul li{
		display: inline-block;
	}

		.headmenu_sub ul li:first-child {
			margin-right: 15px;
		}

	.headmenu_sub ul li a {
		color: #ccc;
	}

	.headmenu_sub ul li a:hover {
		color: #fff;
	}

/* toogle menu */
.headbar_second_1 {
    display: none;
    position: fixed;
    z-index: 3;
    right: 0;
    left: 0;
    top: 56px;
    background: #fff;
    border-bottom: 1px solid #ccc;
}



/* sp menu */
.headmenu-sp {
	margin: 0;
	display: none;
}
.headmenu-sp.active {
	display: block;
}

	.headmenu-sp > ul {
		position: fixed;
		display: block;
		width: 100%;
		top: 56px;
		list-style: none;
		line-height: 1;
		background: #333;
		z-index: 100;
		margin: 0;
		padding: 0 24px;
    }

	.headmenu-sp > ul > li {
    	display: block;
    	border-bottom: 1px solid #555;
	}

		.headmenu-sp > ul > li > a {
			color: #fff;
			padding: 15px 0;
			display: block;
		}

		.headmenu-sp > ul > li.active > a {
			background: #333;
		}

		.headmenu-sp > ul > li.hover > a,
		.headmenu-sp > ul > li > a:hover,
		.headmenu-sp > ul > li > a:focus,
		.headmenu-sp > ul > li > a:active {
		}

		.headmenu-sp > ul > li > a > ul > a {
			font-weight: bold;
		}


.headbar_second_sp {
	display: none;
	padding: 0 0 10px;
	margin: 0;
}

	.headbar_second_sp ul {
		padding: 0;
		margin: 0;
	}

	.headbar_second_sp ul li {
		padding: 5px 0;
		list-style: none;
	}

	.headbar_second_sp ul li a {
		color: #fff;
	}

	.headbar_second_sp ul.list-btns {
		margin-bottom: 5px;
	}

		.headbar_second_sp ul.list-btns li span {
			margin-right: 5px;
		}

	#menutoogle-sp a.open-second span {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .3s ease-in-out;
  -moz-transition: .3s ease-in-out;
  -o-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
	}

	#menutoogle-sp a.open-second span.open {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
	}


/* Ham */
#nav-icon {
  width: 30px;
  position: relative;

	padding: 23px 0 0 0;
	margin-right: 0px;
	margin-top: 16px;
	margin-left: 10px;
	background: transparent;
	font-size: 10px;
	line-height: 1;

  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #fff;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

	.light #nav-icon span {
		background: #000;
	}

#nav-icon span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon span:nth-child(2) {
  top: 5px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
  background: transparent;
}

#nav-icon span:nth-child(3) {
  top: 10px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon span:nth-child(4) {
  top: 15px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
  background: transparent;
}

#nav-icon span:nth-child(5) {
  top: 20px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 0px;
  left: 0px;
  background: #888;
}

#nav-icon.open span:nth-child(2),
#nav-icon.open span:nth-child(3),
#nav-icon.open span:nth-child(4) {
  width: 0%;
  opacity: 0;
  background: #888;
}

#nav-icon.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 21px;
  left: 0px;
  background: #888;
}

	#nav-icon a {
		color: #fff;
		text-decoration: none;
	}

		.light #nav-icon a {
			color: #000;
		}

	#nav-icon.open a {
		color: #000;
	}

@media (max-width: 991px) {
  .header .headlogo {
    margin-left: 55px;
  }
}


/* slider */
    .topswiper .swiper-container {
      width: 100%;
      height: 500px;
    }
    .topswiper .swiper-container2 {
      width: 100%;
      height: 700px;
    }
    .topswiper .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      background-size: cover !important;
      /* Center slide text vertically
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center; */
    }

    	.topswiper .swiper-slide .inner {
	    	margin-top: 80px;
    	}

    	.topswiper .swiper-slide .inner h2,
    	.topswiper .swiper-slide .inner h3,
    	.topswiper .swiper-slide .inner h4 {
	    	letter-spacing: 0.0em;
    	}