@charset "UTF-8";

.ipad #newBlock { padding: 10px 30px 0; }
.ipad #topicsBlock { padding: 60px 30px 0; }
.ipad #projectBlock { padding: 120px 30px 0; }
.ipad #categoryBlock { padding: 120px 30px 120px; }
.ipad #page .container { padding-left:50px;padding-right:50px; } 
.ipad #page .topics {padding: 80px 50px 0;}
.ipad #eventBlock .bxslider { left:0vw; }
.ipad .bx-wrapper img { margin:0 auto; }

.ipad #page .product  { padding:50px;}
.ipad #page .product .gallaryBlock { width:400px; }
.ipad #spMain .bx-wrapper { margin-bottom:0; }

@media ( max-width: 786px){
	/* common */
body {font-family:nimbus-sans,"Helvetica Neue",Helvetica,Arial,a-otf-futo-go-b101-pr6n,"游ゴシック Medium",YuGothic,YuGothicM, "Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
font-display: swap;}
	h3.sub { font-size: 14px;padding: 10px 0 5px 0; }
#page h3.sub { font-size: 16px;padding: 10px 0 20px 0; }
	h2.title { font-size: 26px;letter-spacing: 0.6px; }
	h2.title::before { font-size: 10px; width: 40px;	margin-right: 10px;	height:22px; }
	h2.title::after { width: 50px; }
	a.viewall { width:auto; }
	#page a.viewall { width:80%; }
	section .box i {
		font-size: 10px;
		width: 60px;
		padding: 3px 0;
		border-radius: 3px;
		top: 8px;
		right: 8px;
	}
	
	.pushbar.from_right{
		top: 0;
		left: 0;
		width: 256px;
		max-width: 100%;
		height: 100%;
		min-height: 100vh;
		transform: translateZ(0) translateX(-100%);
	}
	.pushbar.opened{
	   transform: translateX(0px) translateY(0px);
	}

	
#index { background:#F7F7F7; padding-top: 0px;}
	main.pc { display:none; }
	#spMain .bx-wrapper {
		    -moz-box-shadow: 0 0 0;
			-webkit-box-shadow: 0 0 0;
			box-shadow: 0 0 0;
			border: none;
			background: #fff;
		
	}
	
	.btnBox a { padding: 5px 0 0;line-height: 40px;	}
	section .icon { font-size: 9px;padding: 6px 0;	}
	
	/* header */
	header ul.cateNav,header ul.subNav { display:none; }
	header .logoBox { width:120px; top:53%;}
	header .logoBox img { width:120px; }
	header button { order: 1; padding-left:8px; margin-top:-16px;}
	header .container {
		height: inherit;
		width: 100%;
		padding:20px 15px;
	}
	header .ecBtn {
		margin-left: auto;
		padding-top: 3px;
		padding-right: 3px;
		line-height: 0.5;
		order: 3;
	}
	header .ecBtn a {
		border:none;
		line-height: 20px;
		padding: 0;
	}
	header .ecBtn a span { display:none; }
	header .ecBtn a img { margin:0;  width:20px;}
	.drawer-hamburger-icon { width:30px;margin-top:10px; }
	.drawer-hamburger-icon:after { width:17px;top:7px; }
	#topBar .inner ul {
		height: auto;
		flex-direction: column;
		flex-wrap: wrap;
		margin:0;
		padding:90px 0 30px;
	}
	#topBar .inner ul li {
		margin-right: 0;
	}
	#topBar .inner ul li a img { height:50px; }
	#topBar .topClose a img { width:20px; }
	#topBar .topOnline {
		left: 15px;
	}
	
	#sideBar .inner { padding: 60px 35px 30px; }
	#sideBar .sideLogo img { height: 25px;margin-bottom: 20px; }
	.pushbar.from_right {     width: 300px;	}
	
	/*=== Index ===*/
	#index .content { padding:20px 10px 0 10px; }	
	#page .content { padding:0 10px 10px; }	
	#spMain ul { margin:0; }
	#spMain img { max-width:100%;height:auto;display: block; }
	
	main .urlBox { display:none; }
	/* newBlock */
	#newBlock {padding: 30px 0 0;}
	#newBlock .content { flex-direction: row; }
	#newBlock .box { width:50%; }
	#newBlock .box h4 {
		padding: 25px 15px 15px;
		font-size: 13px;
		line-height: 1.4;
	}
	#newBlock .box p { font-size:10px;margin-bottom: 10px; }
	/* topicsBlock */
	#topicsBlock { padding: 0 0 60px; }
	#topicsBlock .box { width:50%; }
	#topicsBlock .box h4 { font-size: 13px;padding: 20px 10px 15px; }
	#topicsBlock .box .txt { font-size: 10px; }
	#topicsBlock .box .date { font-size: 10px; }
	#topicsBlock .btnBox { margin: -15px auto 0;width: 90%; padding-bottom:0;}
	#topicsBlock .btnBox a { font-size: 20px; }
	#topicsBlock .box .detail { padding:10px; }
	#topicsBlock .box .txt { padding:0 0 10px; }
	/* eventBlock */
	#eventBlock { padding: 50px 0; }
	#eventBlock .box h4 { 
		padding: 30px 15px 15px;
		font-size: 13px;
		line-height: 1.5;
		}
	#eventBlock .box h4 a { 
		height:75px;
		overflow: hidden;
		}
	#eventBlock .box .detail {
		padding: 15px 10px 15px;
	}
	#eventBlock .slider-wrapper { padding:20px 0 0; }
	#eventBlock .bx-wrapper { margin:0; }
	#eventBlock .bxslider { left:16vw; }
	#eventBlock .bx-wrapper .bx-controls-direction a {
		top: 56%;
		margin-top: -60px;
		width: 42px;
		height: 46px;
	}
	.bx-wrapper .bx-next,.bx-wrapper .bx-prev { background-position: center center;}
	
	/* projectBlock */
	#projectBlock { padding: 0 0 40px;}
	#projectBlock .box {width:50%;border: 3px solid #F7F7F7;}
	#projectBlock .box .logos { padding: 5px 0 5px; }
	#projectBlock .box .logos img { height:auto; }
	#projectBlock .box .inner {
		display: flex;
		padding: 0 10px 5px;
		font-size: 10px;
		text-align:center;
	}
	#projectBlock .box .inner .genre { text-align:center;margin:0 auto; }
	#projectBlock .box .inner .since { display:none; }

	#projectBlock .box .img img { border-radius: 5px 5px 0 0;width:100%; }
	#projectBlock .box .logos {  }
	#projectBlock .box .logos  { padding:15px 0 15px;height:95px;display:flex;align-items: center;justify-content: center; }
	#projectBlock .box .logos img.logoUeno { height:45px; }
	#projectBlock .box .logos img.logoMiyage { height:50px; }
	#projectBlock .box .logos img.logoEngimono { height:60px; }
	#projectBlock .box .logos img.logoComplex { height:42px; }
	#projectBlock .box .logos img.logoNewsed { width:63%; }
	#projectBlock .box .logos img.logoSakusi{ width:100%; }
	#projectBlock .box .logos img.logoRecycle{ height:60px; }
	#projectBlock .box .logos img.logoJinbocho { width:80%; }
	#projectBlock .box .logos img.logoKraken { height:50px; }
	#projectBlock .box .logos img.logoChuku { height:60px; }
	#projectBlock .box .inner { display:flex;padding:0 20px 20px;font-size:11px;font-family: nimbus-sans, sans-serif;font-weight: 400; }
	#projectBlock .box .inner .since { margin-left:auto; }

	#aboutBlock { padding:40px 40px 30px; }
	#aboutBlock h1 { font-size:20px;padding-bottom:25px; }
	#aboutBlock p { font-size:16px;padding:20px 0 10px;width:auto; }
	#profileBlock { display:block;padding:40px 20px;margin:0 0;border-top:1px solid #EEE;border-bottom:1px solid #EEE; }
	#profileBlock table { width:100%; }
	#profileBlock table th { vertical-align: top;padding:0 20px 10px; }
	#profileBlock table td { vertical-align: top;padding:0 20px 10px; }
	#mapBlock p { padding:40px 40px 20px;margin:0 0; }
	
	/* categoryBlock */
	#categoryBlock {padding: 20px 0 40px;}
	#categoryBlock .box {width:33%;border: 3px solid #F7F7F7;border-radius:5px;}
	#categoryBlock .box .inner { padding: 10px 5px 10px; font-size: 9px; }
	
	/*=== Product Page ===*/
	#page { padding:0 0 40px;}
	#page #eventBlock { padding:10px 0 0; }
	#eventBlock .box h4 { padding: 0 0 0;font-size: 12px; line-height: 1.5; }
	#eventBlock .box .inner { display:block; }
	#page #eventBlock .bxslider > * { width:50%; }
	#eventBlock .box h4 a { height:75px; }
	#eventBlock .box .inner  { text-align:center; }
	#eventBlock .box .inner p span { display:block;margin:0;padding:5px 0; }
	#page .product { padding:25px 15px;display:block; border-radius:6px;}
	#page .product .gallaryBlock { padding-right: 0; width: 100%; }
	.slideShow .mainView .btnPrev, .slideShow .mainView .btnNext {
		top: 43%;
		width: 30px;
		height: 35px;
		position: absolute;
	}
	.mainView .bx-wrapper {     
		-webkit-box-shadow: 0 0 0 transparent;
		box-shadow: 0 0 0 transparent;
		border: none ;
		background: #fff; 
		margin-bottom: 0;
	}

	
	
	.mainView .bx-controls { display: none; }
	
	#page .product .detailBlock {
			padding:20px 5px 0;
			line-height: 1.8;
		}
	#page .product .detailBlock .box i {top: 15px;	}
	#page .product .detailBlock ul li img { height: 25px; }
	#page .product .detailBlock h1 { font-size: 20px;padding: 20px 0 10px; line-height:1.2;}
	#page .product .detailBlock .price { font-size: 14px;padding: 0 0 15px; }
	#page .panel-title { font-size: 14px; }
	#page h4.panel-title a { font-size: 14px;line-height: 50px; padding:0 10px;}
	#page .panel-title a span.toggle { right: 15px; }
	#page .panel-title a span.toggle::before { width: 10px; }
	#page .panel-title a span.toggle::after { width: 10px; }
	#page .panel-default>.panel-heading+.panel-collapse>.panel-body { padding: 10px 10px 30px; }
	#page .product .detailBlock .status { font-size: 16px;padding: 20px 0 10px; }
	#page .product .detailBlock .term { padding: 0;font-size:12px; }
	#page .product .detailBlock .date { font-size:12px;padding: 0 0 20px; }
	#page .product .detailBlock h3 { font-size: 16px; }
	#page .product .detailBlock ul {  padding: 15px 0 0; }
	#page .topics .topicsNav h3 {
    font-size: 14px;
    padding: 0 0 15px;
}
	
	/*=== Topics Page ===*/
	#page .topics .pageHeader h1 { font-size: 18px;line-height: 1.25; }
	#page .topics .pageHeader .attribute { padding: 8px 0 0;font-size: 12px; }
	#page .topics .wrp { display:block; }
	#page .topics .contentBlock img { margin: 15px 0; }
	#page .topics { padding:30px 20px; border-radius:6px;}
	#page .topics .contentBlock .content { font-size:14px;line-height:1.75; }
	#page .topics .contentBlock hr { margin: 15px 0; }
	#page .topics .topicsNav { width:100%;padding:0; }
	#page .topics .topicsNav .navWrp { padding: 50px 5px 20px; }
	
	
	footer  { padding:30px;position:relative }
	footer .container { padding:0;display:block; }
	footer ul.navLink { display:none; }
	footer .spNav  { display:inline-block; }
	footer .company  { display:inline-block;padding-left:30px;margin-bottom:50px; }
	footer .company li a { font-size:12px; }
	footer .company ul.social { display:none; }
	footer .copyright { position:absolute;bottom:0;left:0;width:100%; }
	footer .copyright .logo {
		position:absolute;
		left:0;
		bottom:20px;
	}
	footer li a.nmb { font-size: 12px; }
	footer a.nmb::before { font-size: 10px;height:25px; }
	footer .company li { line-height: 21px; }
	
	footer .copyright .logo img { width:150px; }
	footer .copyright .rights { font-size:10px; }
	footer .copyright .social { position:absolute;right:0;bottom:0;padding:0; }
	footer .copyright .social p img { height: 13px; }
}

