@charset "UTF-8";

/* -------------------------------------------------------------
　コンセプト
------------------------------------------------------------- */

/* タイトル
------------------------------------------------------------- */

/* brand_common.css（タイトル）に記載
下記は各調整 */

#concept #page_title {
	background: url(/img/concept/h1_bgs.jpg) center top no-repeat;
	background-size: cover;
	margin: 90px 0 0;
}




/* リードブロック
------------------------------------------------------------- */

#concept #content {
	text-align: center;
	background: #F1F5F7;
	padding: 60px 0 80px;
}
#concept #content .sttl {
	font-family: "Roboto";
	color: #1E2B30;
	font-size: 12px;
	font-weight: 300;
	text-align: center;
	line-height: 28px;
	margin: 0 0 10px;
}

#concept #content h2 {
	color: #1E2B30;
	font-size: 30px;
	font-weight: 300;
	text-align: center;
	line-height: 54px;
	margin: 0 0 40px;
	padding: 0 0 0 0.5em;
}

#concept #content p.lead {
	color: #1E2B30;
	font-size: 14px;
	font-weight: 300;
	text-align: center;
	line-height: 28px;
}



/* ブランドのご紹介
------------------------------------------------------------- */

#concept #brand {
	padding: 60px 0 ;
}

#concept #brand h2 {
	color: #1E2B30;
	font-size: 30px;
	font-weight: 300;
	text-align:center;
	line-height: 36px;
	margin:0 0 20px;
}

#concept #brand p.lead {
	color: #1E2B30;
	font-size:12px;
	font-weight: 300;
	line-height: 22px;
	margin: 0 0 50px;
	padding: 0 35px;
}

#concept #brand .noml,
#concept #brand .prem {
	display: block;
	width: 90%;
	margin: 0 0 70px 9%;
}
#concept #brand .noml {
	border-bottom: 1px solid #638FA2;
}
#concept #brand .prem {
	border-bottom: 1px solid #AC9362;
}

#concept #brand ul.normal,
#concept #brand ul.premier {
	width: 90%;
	max-width: 600px;
	margin: 0 auto 80px;
}
#concept #brand ul.normal li:nth-child(1),
#concept #brand ul.premier li:nth-child(1) {
	text-align: center;
}
#concept #brand ul.normal li img,
#concept #brand ul.premier li img {
	width: 240px;
	margin: 0 0 50px;
}
#concept #brand ul.normal li h3,
#concept #brand ul.premier li h3 {
	color: #638FA2;
	font-size: 28px;
	font-weight: 100;
	line-height: 40px;
	margin: 0 0 40px;
	padding: 0 4%;
*	letter-spacing: 0.05em;
}
#concept #brand ul.premier li h3 {
	color: #AC9362;
}
#concept #brand ul.normal li .txt,
#concept #brand ul.premier li .txt {
	color: #1E2B30;
	font-size: 14px;
	font-weight: 300;
	line-height: 28px;
}


#concept #brand a.detail {
	display: block;
	width: 200px;
	color: #1E2B30;
	font-size: 12px;
	font-weight: 300;
	text-align: center;
	margin: 40px 0 0;
	padding: 7px 0;
	background: #fff url(../../img/common/mk_arrow_bwnR_175.svg) 90% 50% no-repeat;
	border: 1px solid #AC9362;
	border-radius: 40px;
	transition: 0.5s;
}
#concept #brand a.detail:hover {
	text-decoration: none;
	background: #fff url(../../img/common/mk_arrow_bwnR_175.svg) 93% 50% no-repeat;
	transition: 0.5s;
}










/* media Queries PC //////////////////////////////////////////////////////////////////////////////////////
------------------------------------------------------------------------------------------------- 810px */
@media screen and (min-width:810px), print {

/* -------------------------------------------------------------
　コンセプト
------------------------------------------------------------- */

/* タイトル
------------------------------------------------------------- */

/* brand_common.css（タイトル）に記載
下記は各調整 */

#concept #page_title {
	background:url(/img/concept/h1_bg.jpg) center top no-repeat;
	background-size:cover;
	margin: 120px 0 0;
}




/* リードブロック
------------------------------------------------------------- */

#concept #content {
	width: unset;
	max-width: unset;
	padding: 140px 0 110px;
}

#concept #content .sttl {
	font-size: 21px;
	font-weight: 300;
	line-height: 42px;
	margin: 0 0 15px;
	letter-spacing: 0.05em;
}

#concept #content h2 {
	font-size: 42px;
	line-height: 46px;
	margin:0 0 110px;
	letter-spacing: 0.05em;
}

#concept #content p.lead {
	font-size:18px;
	line-height: 36px;
}



/* ブランドのご紹介
------------------------------------------------------------- */

#concept #brand {
	padding: 160px 0 60px;
}

#concept #brand .top_bl {
	display: flex;
	justify-content: center;
	max-width: 1000px;
	margin:0 auto 120px;
}
#concept #brand .top_bl li:nth-child(1) {
	width: 44%;
	padding: 0 4% 0 0;
	border-right: 1px solid #1E2B30;
}
#concept #brand .top_bl li:nth-child(2) {
	width: 56%;
	padding: 0 0 0 4%;
}
#concept #brand h2 {
	font-size: 48px;
	line-height: 50px;
	margin: 0;
	letter-spacing: 0.035em;
}

#concept #brand p.lead {
	font-size:18px;
	line-height: 27px;
	margin: 0;
}


#concept #brand .noml,
#concept #brand .prem {
	display: block;
	width: 90%;
	margin: 0 0 70px auto;
}



#concept #brand ul.normal,
#concept #brand ul.premier {
	display: flex;
	width: 90%;
	max-width: 1030px;
	margin: 0 auto 100px;
}
#concept #brand ul.normal li:nth-child(1),
#concept #brand ul.premier li:nth-child(1) {
	width: 350px;
	text-align: left;
	padding: 0 60px 0 0;
}
#concept #brand ul.normal li:nth-child(2),
#concept #brand ul.premier li:nth-child(2) {
	width: calc(100% - 350px);
}


#concept #brand ul.normal li img,
#concept #brand ul.premier li img {
	width: 290px;
	margin: 0;
}

#concept #brand ul.normal li h3,
#concept #brand ul.premier li h3 {
	font-size: 36px;
	line-height: 54px;
	margin: 0 0 60px;
	padding: 0;
}
#concept #brand ul.normal li .txt,
#concept #brand ul.premier li .txt {
	font-size: 14px;
	line-height: 35px;
}






}/* 801 */