.mainimg { width: 100%; height: 0; padding-top: 44.11%; /* 画像高さ ÷ 画像横幅 × 100% */
    background-color: #fff; background-image: url(brand/images/header_bg_brand_01.png); margin-top: 46px; background-size: contain; }

#content01{
	width:950px;
	margin:0 auto;
}

#concept_02{ background-color: transparent; background-repeat: no-repeat; background-attachment: scroll; background-position: center; background-size:cover; height:auto; margin-bottom:60px; }

.content01{
	width:950px;
	margin:0 auto;
}

.block02 { text-align: center; width: 470px; }

#concept02_bg {
    background: url(img_aruka/i_concept_bg02.png) no-repeat center;
    background-size: cover;
    height: 360px;
    margin-bottom: 60px;
}

#concept03{
	background:url(img/aboutBg.jpg) no-repeat center;
	background-size:cover;
	height:278px;
	margin-bottom:60px;
}

#concept03_bg { background: url(img_aruka/i_concept_bg03.png) no-repeat center; background-size: cover; height: 238px; padding-top: 100px; }

#case{ background-color: transparent; background-repeat: no-repeat; background-attachment: scroll; background-position: center; background-size:cover; height:300px; }

#case02　{ background-color: transparent; background-repeat: no-repeat; background-attachment: scroll; background-position: center; width: auto; clear: both; margin-top: 0; margin-bottom: 30px; }

.content02{ width:950px; margin:0 auto; padding-top: 30px; }

#case_bg{ background-color: #4ccbd3; background-repeat: no-repeat; background-attachment: scroll; background-position: center bottom; }

/*==========================================
 コンテンツエリア -> 事例のスタイル
===========================================*/

div#case section#work article {
  text-align: center;
  width: 33%;
  min-width: 120px;
  float: left;
  margin-bottom: 10px;
}
div#case section#work article img {
  width: 100%;
  height: auto;
  max-width: 290px;
  margin-top: 5px;
}
 
div#case section#work article h3 { font-size: 100%; color: #000;	/*文字色*/
	text-align: left; clear: both; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; padding-top: 3px; padding-bottom: 2px; padding-left: 5px;	/*下側の線の幅、線種、色*/
}

div#case section#work article p {
  text-align: left;
  font-size: 0.7em;
  line-height: 2.0em;
  padding: 0 15px;
}


/*==========================================
 コンテンツエリア -> ブランド
===========================================*/

#case02 section.list {
	width: 900px;	/*ボックスの幅*/
	position: relative;
	overflow: hidden;
	background: #fff;	/*背景色*/
	padding: 2%;		/*ボックス内の余白*/
	border: solid 1px #e0e0e0;	/*枠線の幅線種、色*/
	border-radius: 10px;	/*角丸のサイズ*/
	margin: 0 auto 15px;　　/*ボックスの余白*/
}
/*ボックス内のh4タグ共通設定*/
#case02 section.list h4 { font-size: 120%; color: #000;	/*文字色*/
	font-weight: bold; border-bottom: 1px solid #000;	/*下側の線の幅、線種、色*/
	margin-bottom: 0.5em; margin-left: 24%;	/*画像とのバランスをとって設定（※横長タイプ用）*/
}
/*ボックス内の段落タグ共通設定*/
#case02 section.list p {
	padding: 0px;
	margin-left: 24%;	/*画像とのバランスをとって設定（※横長タイプ用）*/
}
/*ボックス内の写真共通設定*/
#case02 section.list figure img {
	float: left;	/*画像を左へ回り込み（※横長タイプ用）*/
	width: 20%;		/*写真の幅（※横長タイプ用）*/
	background: #fff;
}



.photo { width:600px; margin-bottom:20px; text-align:justify; text-justify:distribute; font-size:13px; line-height:1.4; padding-top: 20px; }

/* 回り込み解除 ここから */
.photo {
   ⁄zoom:1;
}

.photo:after {
   content:'';
   display:block;
   clear:both;
}
/* 回り込み解除 ここまで */

.photo p {
   margin:1em 0;
}

/* 写真が右 */
.photoRight img {
   float:right;
   margin:0 0 1em 1em;
}

/* 写真が左 */
.photoLeft img {
   float:left;
   margin:0 1em 1em 0;
}

/*ニュース＆トピックス*/
#flow{ background:url(../../現行サイト/marukan_old/img_aruka/i_flow_bg.png) no-repeat center bottom; padding-top: 60px; }

.center02{ display:block; text-align:center; margin-top: 40px; }



#pankuzu{
	background: #4ccbd3;
	color: #ffffff;
	padding: 5px 30px;
	position: absolute;
	right: 0;
}

a.pankuzu { color: #ffffff; text-decoration: underline; }

img.wa {
	width: auto;
	height: auto;
}

img.wa01 {
	width: auto;
	height: auto;
}

.conxept01{
  text-align: left;
  font-size: 0.7em;
  line-height: 2.0em;
  padding: 0 15px;
}

.content_ask{
	width:950px;
	margin:0 auto;
}

/*SP版*/
@media (max-width: 750px) {

.mainimg { width: 100%; height: 0; background-color: #fff; background-image: url(img_aruka/header_bg_01.png); margin-top: -31px; background-size: contain; }

#concept{
		width:100%;
	}

.content01{ width:100%; padding-top: 80px; }

.content02{ width:100%; padding-top: 30px; }

.block02 { text-align: center; width: 100%; }

.photo { width:90%; margin-bottom:20px; text-align:justify; text-justify:distribute; font-size:13px; line-height:1.4; padding-top: 20px; }

#flow{
		width:100%;
	}

.img.wa {
    width: 90%;
    height: auto;
}

img.wa01 {
	width: 90%;
	height: auto;
}

/*==========================================
 コンテンツエリア -> 事例のスタイル
===========================================*/

div#case section#work article {
  text-align: center;
  width: 98%;
  min-width: 120px;
  float: left;
  margin-bottom: 10px;
}
div#case section#work article img {
  width: 100%;
  height: auto;
  max-width: 290px;
  margin-top: 5px;
}

div#case section#work article h3 { font-size: 100%; color: #000;	/*文字色*/
	text-align: left; clear: both; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; padding-top: 3px; padding-bottom: 2px; padding-left: 5px;	/*下側の線の幅、線種、色*/
}

div#case section#work article p {
  text-align: left;
  font-size: 0.7em;
  line-height: 2.0em;
  padding: 0 15px;
}

/*ボックスの設定*/
div#case02 section.list {
	width: auto;	/*ボックスの幅*/
}

/*問合せエラー*/
.content_ask{
	width:90%;
	margin:0 auto;
}

}

/*ここからスマートフォン用（480px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media (max-width : 480px){

.mainimg { width: 100%; height: 0; background-color: #fff; background-image: url(img_aruka/header_bg_01.png); margin-top: -31px; background-size: contain; }

#concept{
		width:100%;
	}

.content01{ width:100%; padding-top: 80px; }

.content02{ width:100%; padding-top: 30px; }

.block02 { text-align: center; width: 100%; }

.photo { width:90%; margin-bottom:20px; text-align:justify; text-justify:distribute; font-size:13px; line-height:1.4; padding-top: 20px; }

#flow{
		width:100%;
	}

.img.wa {
    width: 90%;
    height: auto;
}

img.wa01 {
	width: 90%;
	height: auto;
}

/*==========================================
 コンテンツエリア -> 事例のスタイル
===========================================*/

div#case section#work article {
  text-align: center;
  width: 98%;
  min-width: 120px;
  float: left;
  margin-bottom: 10px;
}
div#case section#work article img {
  width: 100%;
  height: auto;
  max-width: 290px;
  margin-top: 5px;
}

div#case section#work article h3 { font-size: 100%; color: #000;	/*文字色*/
	text-align: left; clear: both; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; padding-top: 3px; padding-bottom: 2px; padding-left: 5px;	/*下側の線の幅、線種、色*/
}

div#case section#work article p {
  text-align: left;
  font-size: 0.7em;
  line-height: 2.0em;
  padding: 0 15px;
}

/*==========================================
 コンテンツエリア -> ブランド
===========================================*/

/*ボックス内の段落タグ設定*/
#case02 section.list { width: 80%; margin-right: 5px; margin-left: 5px;	/*ボックスの幅*/
}

#case02 section.list p {
	margin-left: 0;
}
/*ボックス内の写真設定*/
#case02 section.list figure img {
	float: none;
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
/*ボックス内のh4タグ設定*/
#case02 section.list h4 {
	margin-left: 0;
}


}