@charset "utf-8";
/* CSS Document */
#wrapper {
	margin: 0 auto;
	background: #fff;
	text-align:center;
}

/*全体共通のコンテンツ左右に振り分ける*/
	.left{
		float:left; 
		width:50%; 
		height:250px; 
		display:block;
		line-height:30px;
	}
	.right{
		float:left; 
		width:50%; 
		height:250px; 
		display:block;
	}
	.box{
		/*width:300px; */
		float:left; 
		margin:10px;
	}
	h3{
		font-size:12px;
		}

@media (min-width: 751px) {
   /* 横幅が751px以上の場合に適用するスタイル */
	#wrapper { width: 1280px }
	.menu{display:none;}
	.box { width: 31% }

	
	/*プルダウン紹介文親階層*/
	.gnav {
		display: flex;
		/*height: 2rem;*/
		margin: 0x;
		width: 100%;
	}
	.gnav > li {
		width: 100%;
	}
	/*全てのリスト・リンク共通*/
	.gnav li {
		list-style: none;
		position: relative;
		padding:0;
	}
	.gnav li a {
		background: #fff;
		color: #000;
		display: block;
		/*height: 2rem;*/
		line-height: 2rem;
		text-align: center;
		text-decoration: none;
		width: 100%;
	}
	
	
	/*子階層以降共通*/
	.gnav li li {
		height: 0;
		overflow: hidden;
		transition: .5s;
	}
	.gnav li li span {
		display: flex;
		/*background-color: rgb(192,192,192,0.5);	*/
		background-color: rgb(255,255,255,0.7);
	}
	.gnav li:hover > ul > li {
		/*height: 2rem;*/
		overflow: visible;
	}
	
	.brandname{
		line-height:20px
	}
	.right p{
		font-size:12px; 
		line-height:20px
	}



   

}

@media (max-width: 750px) {
   /* 横幅が750px以下の場合に適用するスタイル */
   #wrapper { 
   		width: 100%;
		margin-top:50px;
   }
   .gnav{display:none}
   .box { width: 100%; }
   

.menu {
    max-width: 100%;
}

.menu a {
    display: block;
    padding: 15px;
    text-decoration: none;
    color: #000;
}

label {
    display: block;
    margin: 0 0 4px 0;
    padding : 15px;
    line-height: 1;
    color :#333;
    background :#fff;
    cursor :pointer;
	line-height:25px;
}

input {
    display: none;
}

.menu ul {
    margin:0 auto;
    padding: 0;
    background :#fff;
    list-style: none;
	font-size:12px;
	width:90%;
}

.menu li {
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

#menu_bar01:checked ~ #links01 li,
#menu_bar02:checked ~ #links02 li,
#menu_bar03:checked ~ #links03 li, 
#menu_bar04:checked ~ #links04 li,
#menu_bar05:checked ~ #links05 li,
#menu_bar06:checked ~ #links06 li,  
#menu_bar07:checked ~ #links07 li,
#menu_bar08:checked ~ #links08 li,
#menu_bar09:checked ~ #links09 li, 
#menu_bar10:checked ~ #links10 li {
	height:300px;
    opacity: 1;
}
}