@charset "UTF-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(http://fonts.googleapis.com/css?family=Lato:400,700);

/* clearfix */
.cf {
	zoom: 1;}
.cf:before, .cf:after {
	content: "";
	display: table;}
.cf:after {
    clear: both;}
#headerwrap h1 {
	color:#ffffff;
	margin-top: 200px;
	padding-bottom: 25px;
	letter-spacing: 6px;
	font-size: 7em;
	font-weight: bold;
	text-shadow: 2px 2px 2px #000;}
.shop.cf .shop_info {
	margin:0 auto;}
.youtube {
  display: block;
  margin: 1em auto 3em;
  max-width: 100%;}
/********************waveshark 動画」*************/
div.vid_contents {
    width: 100%;/*背景色を横幅いっぱいに広げる*/
    height: auto;
    text-align: center;
    margin: auto;
    /*padding: 4% 4% 4% 4%;/*ここで動画の周りの余白を調整*/
    /*background: #e6e6e6;/*余白の背景色*/}
video.vid_main {
    width: 100%;
    /*max-width: 920px;/*PC版での最大幅*/
    max-width: 2000px!important;}


@media (max-width: 1200px) {
}

/*770px~1199px*/
@media (min-width: 770px) and (max-width: 1199px) {
	.shop{
		width:95%;
		margin:0 auto;}
	.photo {
		margin: 20px 35px 30px 0px;
		float: left;
		height: auto;
		width: 40%;}
		.btn_r a{
		width:85%;
		font-size:1.3em;
	}
	.btn_r a:hover {
		width:85%;
		font-size:1.3em;}
    .movie{
        max-width: 1199px;
        width: 95%;
        margin: 1em auto;}
    .ma1{
        margin: 2em auto !important;
    }
}

@media (min-width: 979px) and (max-width: 1199px) {
	.photo {
		margin: 20px 35px 30px 0px;
		height: auto;
		width: 45%;}
}


@media (min-width: 770px) and (max-width: 978px) {
	.shop{
		width:95%;
		margin:0 auto;}
	.photo {
		margin: 20px 35px 30px 0px;
		height: auto;
		width: 45%;}
}
@media (min-width: 481px) and (max-width: 769px) {
  .shop.cf .shop_info {
	margin: 0px auto;
	width: 80%;}
	#headerwrap h1 {
		font-size:5em;}
}


@media (max-width: 480px) {
  .shop.cf .shop_info {
	width: 95%;
	margin-bottom:30px;}
	#headerwrap h1 {
		font-size:3.5em;}
	.btn_r a{
		width:95%;}
		.btn_r a:hover {
		width:95%;}
	#blandwrap .container .col-xs-6.desc{
		padding:2px;
		margin:0;}
	#blandwrap .container .col-xs-6.desc .project-wrapper a .img-responsive {
		margin:0;
		padding:0;
		width:140%;
		height:auto;}
}

