@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:100,200,300,400|Raleway);
* {
  margin:0;
  padding:0;
}
body {
-webkit-font-smoothing:antialiased;
-webkit-text-size-adjust:100%;
color:#333;
font:20px/24px"Yanone Kaffeesatz",HelveticaNeue,Helvetica,Arial,sans-serif;
font-weight:400;
font-size:16px;
padding:0;
max-width:1440px;
margin:0 auto;
}
h4,h5 {
	color:#666;
	font-weight:400;
}
* {
  box-sizing:border-box;
}
.header {
	background-image:url("image/cafe.jpg");
    background-repeat:no-repeat;
	height:230px;
}
.header h1 {
  color:white;
  padding:20px 0px 142px 40px;
  font-weight:100;
}
ul {
    list-style-type:none;
	margin:0;
	padding:0;
    background-color:#333;
    opacity:0.7;
	z-index:1;
}
li {
    display:inline-block;
}
li a.active {
	background-color:#000;
	color:orange;
}
li a, .dropbtn {
    display:inline-block;
    color:white;
    text-align:center;
    padding:10px 14px;
    text-decoration:none;
	font-size: initial;
}
li a:hover, .dropdown:hover .dropbtn {
    background-color:#000;
}
.dropdown {
    display:inline-block;
	position:relative;
}
.dropdown-content {
    display:none;
    position:absolute;
    background-color:#222;
    min-width: 160px;
    box-shadow:5px 10px 10px rgba(0,0,0,0.3);
	z-index:1;
}
.dropdown-content a {
    color:white;
	border-bottom:1px solid #666;
	line-height:8px;
    text-decoration:none;
    display:block;
    text-align:left;
	z-index:99;
}
.dropdown-content a:hover {
	background-color:#333;
}
.dropdown:hover .dropdown-content {
    display:block;
}
.sticky {
  position:fixed;
  top:0;
  width:1440px;
}
.row {  
  display:-ms-flexbox; /* IE10 */
  display:flex;
  -ms-flex-wrap:wrap; /* IE10 */
  flex-wrap:wrap;
}
.side {
  -ms-flex:30%; /* IE10 */
  flex:30%;
  background-color:#f1f1f1;
  padding:12px 0;
}
.loingo {
	width:320px;
	margin:0 auto;
	padding: 0 10px;
}
.form {
/*	width:320px;
    margin:0 auto;*/
}
.bando {
	width:320px;
	margin:0 auto;
}	
.main {   
  -ms-flex:70%; /* IE10 */
  flex:70%;
  background-color:white;
  padding:0 20px 20px 20px;
  border-right:1px solid #f2f2f2;
}
.video-container {
    overflow:hidden;
    position:relative;
    width:100%;
}
.video-container::after {
    padding-top:56.25%;
    display:block;
    content:'';
}
.video-container iframe {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.article {
	clear:both;
}
.fakeimg {  
  box-shadow:0 2px #ccc;
  text-align:center;
  overflow:hidden;
  font-size:14px;
  font-style:italic;
  line-height: 30px;
}
.fakeimg img{
  display:block;
  margin-left:auto;
  margin-right:auto;
  width:100%;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  border-radius:2px;
  border:1px solid #666;
}
/* Footer */
.footer {
  padding:20px;
  text-align:center;
  background:#ddd;
}
.tabs {
  position:relative;
  margin:0 auto;
  max-width:320px;
  height:440px;
}
.tabs::before,.tabs::after {
  content:"";
  display:table;
}
.tabs::after {
  clear:both;
}
.tab {
  float:left;
  width:16.66%;
}
.tab-switch {
  display:none;
}
.tab-label {
  position:relative;
  display:block;
  line-height:2em;
  height:2.1em;
  padding:0 14px;
  border-bottom:0.01rem solid #fecdd6;
  color:#333;
  cursor:pointer;
  top:0;
  transition:all 0.15s;
  text-align:center;
}
.tab-label:hover {
  top:-0.25rem;
  transition:top 0.1s;
}
.tab-content {
  position:absolute;
  z-index:1;
  top:30px;
  left:0;
  padding:0;
  color:#2c3e50;
  opacity:0;
  transition:all 0.15s;
  width:100%;
  margin:0 auto;
}
.tab-switch:checked + .tab-label {
  color:#2c3e50;
  border-bottom:0;
  border-bottom:0.125rem solid darkorange;
  transition:all 0.15s;
  z-index:1;
  top:-0.0625rem;
}
.tab-switch:checked + label + .tab-content {
  z-index:2;
  opacity:1;
  transition:all 0.15s;
}
@media screen and (max-width:700px) {
  .row {   
    flex-direction:column;
  }
}
@media screen and (max-width:400px) {
  .navbar a {
    float:none;
    width:100%;
  }
}
@media screen and (min-width:700px) {
  .side {
    width:30%;
  }
}