﻿@charset "utf-8";
/* CSS Document */

 /* RESPONSIVE CSS
    -------------------------------------------------- */
	
	@media (min-width: 1200px) {
		
		.nav{ display: flex;justify-content: center;} 
	
	}
		@media (min-width: 1300px) {.navbar .nav > li > a {padding: 14px 15px;font-size:105%}}
	
			
	@media (min-width: 1200px) {
		
		.biznikkan img{height:155px}
		.greeting-txt, .greeting-image {display:table-cell; vertical-align:bottom}
		.news_img {position:absolute; top:50px;}
		
	/*.navbar .nav > li > a {padding: 14px 14px ;font-size:105%}*/
	.navbar .nav > li > a i{font-size:110%}
	.version { text-align:right; margin-bottom:0px}
	.top-contact-btn {margin-top:10px}
	}
	
	@media (min-width: 1084px) {.nav > li > a {padding: 14px 6px; font-size:100% }.nav{ display: flex;justify-content: center;} }
	
	@media (max-width: 1083px) {.nav > li > a {padding: 14px 8px; font-size:100% }}
	
	
	@media (min-width: 979px) {
		
		
		.version { text-align:right; margin-bottom:0px}
		.version a{color:#666;}
		.greeting-txt, .greeting-image {display:table-cell; vertical-align:bottom}
		.contact {width:80%; margin:auto}
		
		.news-area .news-con{ padding:0 50px 20px 50px}
	.news_img {position:absolute; top:50px;}
	.M-br{display:none}
	
		
		.navbar .nav > li > a i{font-size:110%}
		.table-like {display: table;width: 100%;}
		.table-L, .table-R {display: table-cell;}
		.table-L{ width:22%}
		.registration .table-L{width:30%}

		.nav > li.top-contact-btnM{display: none}
		.navbar-default .navbar-nav > li > a {color: #FFF;} 
		.header {display: table;width: 100%;}
		.header-col {display: table-cell;padding:20px;text-align: center}
		.header-col:nth-child(3){ vertical-align:top;}
		}

	@media (min-width: 979px) and (max-width: 1199px) {.biznikkan img{height:125px}}
	@media (max-width: 978px) {	
	
	.version { text-align:right; margin-bottom:0px}
	.version a{color:#666;}
	.news-area .news-con{ padding:0 50px 20px 50px}
		.navbar .nav > li > a i{font-size:110%}
		.header{margin-top:50px}
		.navbar-default .navbar-nav > li > a {color: #333;border-top:1px solid #E7E7E7} 
		.navbar-default .navbar-nav > li > a:hover {color:#333; opacity:.6}
		.navbar-top-expand {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 10;
      margin-top: -5px;
	  border-bottom: none;
    }
	
	.nav .dropdown-menu a{border:none}
	.navbar-collapse {  background-color:#FFF;border-bottom:6px solid #ca0915}
	}
	
/* desktop but with expand nav
------------------------- */
 @media (min-width: 768px) and (max-width: 979px) {
	 
	.sem-withPhoto .tar { text-align:center !important}
	  .version {position: absolute; top:10px; left:10px; z-index:99999}
		 .version a{color:#FFF;}
	.greeting-txt, .greeting-image {display:table-cell; vertical-align:bottom}
	 .news-area .container {width:100%}
.nav > li > a {padding: 10px; }
.nav > li.top-contact-btnM{display: none}
.header-col {display: table-cell;padding:10px}
.header-col:nth-child(3){ vertical-align: middle}

}
@media (min-width: 768px)and (max-width:1000px){
	.workshop .table-like .table-L{ width:20%}
	.navbar-top-expand .container{width:100%; }

}


/* Tablet
------------------------- */
    @media (max-width: 767px) {
		
		.respon-align {display:inline-block}
		.workshop .table-like .table-L{ width:20%}
		.sem-withPhoto .tar { text-align:center !important}
		 .version {position: absolute; top:10px; left:10px; z-index:99999}
		 .version a{color:#FFF;}
		.top-photos-box{ padding:10px; }
		.M-br{display:none}

		.nav > li > a {padding: 10px;}
		.top-contact-btn{display:none}
		.nav > li.top-contact-btnM{display: block}
		.header-col {text-align:center;padding-bottom:10px}
		.header{padding:10px}
		
	
	.navbar-top-expand {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 10;
      margin-top: 0px;
	  border-bottom: none;
	
    }
	


    }
/* Tablet
------------------------- */
@media screen and (min-width: 481px) and (max-width: 768px) {


	.responseT td{ display:block;}		
	.exhi-2013-area .display-cell{ display:block; text-align:center}
	.greeting-txt, .greeting-image {display:table-cell; vertical-align:bottom}
	.news-area .news-con{ padding:20px 50px}
.M-disappear {display:none}

	.navbar-top-expand {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 10;
      margin-top: -5px;
	  border-bottom: none;
    }
	.header {margin-top:50px; text-align:center}
	.header .logo{width:40%}

.navbar-default { background:none}
.navbar-collapse  { background-color:#FFF}

}	

	

/* Landscape phones
------------------------- */

@media screen and (min-width: 200px)  and (max-width: 480px) {

		.wkshopExhi-withTel .padding10{float: none !important}
.wkshopExhi-withTel .wkshop-exhiTel { float: none !important; }
.wkshopExhi-withTel .wkshop-exhiTel .table-like { display:block;  }
.wkshopExhi-withTel .wkshop-exhiTel .table-like .table-L, .wkshopExhi-withTel .wkshop-exhiTel .table-like .table-R{border-top:2px solid #CCC;}
	
	.search-boothPDF a{padding:20px !important; font-size:100% !important}
	
	.form .table-like .table-L, .form .table-like .table-R {display:block; width:100%}
	.workshop-table .d-col {display:inline-block !important;}
	.responseT td{ display:block;}	
	h3 {font-size:120% !important}
	.seminar-info {font-size:14px !important}
	.seminar-info .d-col{display:block;}
	.seminar-table .time{display:none}
		.exhi-2013-area .display-cell{ display:block; text-align:center}
	.pinned {width: auto}
	.display-T.apply-date .display-cell {display:block}
	.greeting-txt,.greeting-image{display:block;}
	.greeting-image{ margin:auto}
	.news-area .news-con{ padding:20px 50px}
	.M-disappear {display:none}
	.M-br {display:block}
	
	.version { float:left; z-index:11; position: absolute;}
	.navbar-top-expand {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 10;
      margin-top: -5px;
	  border-bottom: none;
    }
	.header {margin-top: 50px; text-align:center}
	.header .logo{width:40%}
	
	

.navbar-default { background:none}
.navbar-collapse  { background-color:#FFF}

	h2, h3{font-size:150%}

	.breadcrumb {font-size:90%}
	
	
}


