* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
a{
	display: inline-block;
}
body {
  background: #eee;
}

nav {
  background: #004f9b;
  width: 100%;
  height: 90px;
  padding: 0 20px;
	margin: 0 auto!important;

		overflow: hidden;
}


/* Toggle Button */
.toggle-btn {
  width: 30px;
  height: 50px;
  padding: 45px 0;
  top: 0;
  right: 10;
	position: relative;
  cursor: pointer;
	float: right;
	margin-right: 20px;
}
.textline{
	display: inline-block!important;
}
.en {
  width: 60px;
  height: 50px;
  padding: 35px 0;
  top: 10;
  right: 10;
	position: relative;
	float: right;
	margin-right: 30px;
}
.toggle-btn span, .toggle-btn span:before, .toggle-btn span:after {
  width: 30px;
  height: 2px;
  background: white;
  position: absolute;
  transition: width 0.3s ease-in-out, background 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: width 0.3s ease-in-out, transform 0.3s ease-in-out, background 0.3s ease-in-out;
  transition: width 0.3s ease-in-out, transform 0.3s ease-in-out, background 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.toggle-btn span {
  top: 50%;
}

.toggle-btn span:before {
  content: "";
  top: -10px;
}

.toggle-btn span:after {
  content: "";
  top: 10px;
	
}

.toggle-btn.onclick span {
  background: none;
}

.toggle-btn.onclick span:before {
  -webkit-transform: translateY(10px) rotate(45deg);
          transform: translateY(10px) rotate(45deg);
}

.toggle-btn.onclick span:after {
  -webkit-transform: translateY(-10px) rotate(-45deg);
          transform: translateY(-10px) rotate(-45deg);
}

.nav-container {
	width: 100%;
	
	pointer-event: none;
  position: fixed;
  top:0;
}

.nav-bar {
  max-width: 300px;
  width: 300px;
 
  background: #ffffff;
  transition: 0.3s ease-in-out;
  position: absolute;
  right: -100%;
  height: 100vh;
  margin-top: 90px;	
}

.nav-bar.visible {
  right: 0;
	 z-index: 999!important;

}
.se001{
background: rgb(0,4,40);
background: linear-gradient(135deg, rgba(0,4,40,1) 0%, rgba(0,44,97,1) 50%, rgba(0,78,146,1) 100%);
}
.BTN1{
	width: 100%;
	max-width: 200px;
	height: 40px;
	background: #00A04C;
	border: 1px solid #00A04C;
	border-radius: 5px;
	cursor: pointer;
	pointer-events: all;
	margin: 10px 0px; 
	transition: 0.7s;
	color: #ffffff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 14px;
	padding: 8px 40px;
	text-decoration: none!important;
}
.BTN1:hover{
	border: 1px solid #007743;
	background: #007743;
	cursor: pointer;
	pointer-events: all;
	transition: 0.5s;
	color: #ffffff;
}
.BTT{
	width: 100%;
	max-width: 100px;
	height: 30px;
	background: #939598;
	border: 1px solid #939598;
	cursor: pointer;
	pointer-events: all;
	transition: 0.7s;
	color: #ffffff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 10px;
	text-decoration: none!important;
	text-align: center;
	right: 0!important;
	top: 45%!important;
	padding: 7px 5px;
	position: fixed;
	transform: rotate(-90deg);
    transform-origin: bottom right;

	
}
.BTT:hover{
	border: 1px solid #777777;
	background: #777777;
	cursor: pointer;
	pointer-events: all;
	transition: 0.5s;
	color: #ffffff;
}
.BTN2{
	width: 100%;
	max-width: 200px;
	height: 40px;
	background: #27AAE1;
	border: 1px solid #27AAE1;
	border-radius: 5px;
	cursor: pointer;
	pointer-events: all;
	margin: 10px 0px; 
	transition: 0.7s;
	color: #ffffff;
	font-family: 'Noto Sans', sans-serif;
	font-weight: 700;
	font-size: 14px;
	padding: 8px 40px;
	text-decoration: none!important;
	text-align: center;
}
.BTN2:hover{
	border: 1px solid #1D396A;
	background: #1D396A;
	cursor: pointer;
	pointer-events: all;
	transition: 0.5s;
	color: #ffffff;
}
.a1{
	font-family: 'Noto Sans', sans-serif;
	font-weight: 300;
}
.a2{
	font-family: 'Noto Sans', sans-serif;
}
.a3{
	font-family: 'Noto Sans', sans-serif;
	font-weight: 400;
}
.a4{
	font-family: 'Noto Sans', sans-serif;
	font-weight: 700;
}
row{
	max-width: 1080px!important;
}
table {
  border-collapse: separate;
  border-spacing: 0;
  
}
table tr th,
table tr td {

  
  padding: 5px;
}
table tr th:first-child,
table tr td:first-child {

}




#in, #fa, #tw, #yt, #rss{
	width: 30px;
	height: 30px;
	color: #ffffff!important;
	transition: 0.5s;
	font-size: 18px;
	cursor: pointer;
	line-height: 0px;
	border: none;
	background: none;
	margin-top: 5px;
	text-align: center;

}
#in:hover, #fa:hover, #tw:hover, #yt:hover, #rss:hover{
	color: #27AAE1!important;
	transition: 0.5s;
	border: none;
}	
.BTN3{
	width: 100%;
	min-width: 300px;
	height: 60px;
	background: none;
	border: none;
	cursor: pointer;
	pointer-events: all;
	margin: 0px 0px; 
	transition: 0.5s;
	color: #94989a;
	border-bottom: 1px dashed #94989a;
	text-align: left;
	padding-left: 20px;
	padding-top: 18px;
	text-decoration: none!important;
	font-family: 'Noto Sans', sans-serif;
	font-weight: 400;
}
.BTN3:hover{
	
	background: #ffffff;
	cursor: pointer;
	pointer-events: all;
	transition: 0.5s;
	color: #D3D3D3;
}
.a1{
	display: block;
	
}

    
    .swiper-container {
      width: 100%;
      height: 100%;
      margin-left: auto;
      margin-right: auto;
		z-index: 0;
		
    }
    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* 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;
		z-index: -10!important;
		
    }
div.bhoechie-tab-container{
  z-index: 10;
  background-color: #777777;
  padding: 0 !important;
display: flex;
  background-clip: padding-box;
  opacity: 0.97;
  filter: alpha(opacity=97);
	
	
}
div.bhoechie-tab-menu{
  padding-right: 0;
  padding-left: 0;
  padding-bottom: 0;
	
}
div.bhoechie-tab-menu div.list-group{
  margin-bottom: 0;
	
}
div.bhoechie-tab-menu div.list-group>a{
  margin-bottom: 0;
}
div.bhoechie-tab-menu div.list-group>a .glyphicon,
div.bhoechie-tab-menu div.list-group>a .fa {
  color: #5A55A3;
	border: none!important;
}
div.bhoechie-tab-menu div.list-group>a:first-child{
 border-bottom: 1px solid #E6E7E8!important;
	border-radius: 0px!important;
	
}
div.bhoechie-tab-menu div.list-group>a:last-child{
  border-bottom-right-radius: 0;
  -moz-border-bottom-right-radius: 0;
	border: none!important;
	
}
a.list-group-item{
	border: none!important;
	border-bottom: 1px solid #E6E7E8!important;
	text-decoration: none!important;
	color: #94989a;
	padding: 50px 20px;
	transition: 0.5s;
	
}
div.bhoechie-tab-menu div.list-group>a.active,
div.bhoechie-tab-menu div.list-group>a.active .glyphicon,
div.bhoechie-tab-menu div.list-group>a.active .fa{
  background-color: #ffffff;
  color: #0C1755;
	text-decoration: none;
	border-bottom: 1px solid #E6E7E8;
	
}
div.bhoechie-tab-menu div.list-group>a:hover{
	color: #2177e8;
	transition: 0.7s;
}
div.bhoechie-tab-menu div.list-group>a.active:after{
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  margin-top: -13px;
  border-bottom: 13px solid transparent;
  border-top: 13px solid transparent;
  border-left: 10px solid #ffffff;
	
}

div.bhoechie-tab-content{
  background-color: #ffffff;
  /* border: 1px solid #eeeeee; */
 width: 100%;
	
}
.shortborder{
     border-bottom: 2px solid #2177E8!important;
     top: 40px;
     bottom: 10px;
     left:0px;
	
   }
.longborder{
     border-bottom: 3px solid #FFF200!important;
     top: 40px;
     bottom: 10px;
     left:0px;
	
   }
div.bhoechie-tab div.bhoechie-tab-content:not(.active){
  display: none;
	padding: 0px!important;
	
}
.tap1{
	background: url("img/tap1.html") no-repeat center;
	background-size: cover;
	
}
.tap2{
	background: url("img/tap2.html") no-repeat center;
	background-size: cover;
	
}
.tap3{
	background: url("img/tap3.html") no-repeat center;
	background-size: cover;
}
.tap4{
	background: url("img/tap4.html") no-repeat center;
	background-size: cover;
}
.box1{
	background: url("img/box1.html") no-repeat center;
	background-size: cover;
}
.box2{
	background: url("img/box2.html") no-repeat center;
	background-size: cover;
}
.box3{
	background: url("img/box3.html") no-repeat center;
	background-size: cover;
}
.sec1{
	background: url("img/sec3.html") no-repeat center;
	background-size: cover;
}


@media only screen and (max-width: 798px) {
	.sec1{
	background: url("img/sec3.html") no-repeat;
	background-size: cover;
}
	.se00001{
		text-align: center!important;
		padding: 0px!important;
	}
	.se00002{
		text-align: center!important;
		padding: 0px 10px!important;
	}
	.se00004{
		text-align: center!important;
		padding: 0px 10px!important;
	}
	.t00001 table tr td{
		padding: 10px!important;
		text-align: center;
	}
	.t00001{
		padding-top: 20px!important;
	}
	.se00005{
		text-align: center!important;
		padding: 0px 10px!important;
	}
	.se00006{
		text-align: center!important;
		padding: 10px 10px!important;
	}
	.se00007{
		text-align: center!important;
		padding: 0px!important;
	}
	.se00008{
		text-align: center!important;
		padding: 20px 10px!important;
	}
	.longborder{
		width: 100%!important;
	}
	.history{
		display: none;
	}
	.history-content{
		text-align: center!important;
		padding: 15px 0px!important;
	}
	.bhoechie-tab-container{
		display: flex!important;
		flex-direction: column!important;
		
	}
	.list-group{
		display: flex!important;
		flex-direction: row!important;
		
	}
	div.bhoechie-tab-menu div.list-group>a.active:after{
	content: '';
    position: absolute;
	left: 40%!important;	
    top: 100%!important;
    margin-top: 0px!important;
    border-top: 13px solid #fff!important;
    border-right: 13px solid transparent!important;
    border-left: 13px solid transparent!important;
	}
	.list-group-item{
		font-size: 14px!important;
		padding: 10px!important;
		text-align: center;
	}
	.list-group>a{
		border-right: 1px solid #E6E7E8!important;
		border-radius: 0px!important;
	}
	.container-fluid{
		overflow: hidden;
	}
	.slider-cont{
		padding: 40px 35px!important;
	}
}
