@charset "utf-8";
/* CSS Document */

/*---------------------------------------------------------------------------

　　オーダーメイド

---------------------------------------------------------------------------*/

/*==========================================================================
　　Common
==========================================================================*/
#order #heading  {margin:0;}

/* 見出し
-------------------------------------------------------------------------*/
#order h3 {
	font-size:52px;font-size:5.2rem;font-weight:normal;text-align:center;
	line-height:1.0;letter-spacing:0.05em;margin:0 0 10px;
	font-family:'Metropolis-SemiBold',Meiryo,"メイリオ", Osaka,"HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", sans-serif;}
#order .h3sup,
#order .h3sup{font-size:14px;font-size:1.4rem;line-height:1.5;
	text-align:center;margin:0 0 50px;}

#order h4:not(.nonCom) {
	font-size:16px;font-size:1.6rem;font-weight:normal;line-height:1.0;
	font-family:'Metropolis-Regular',Meiryo,"メイリオ", Osaka,"HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", sans-serif;
	height:40px;padding:11px 0 0 30px;margin:0 0 25px;position:relative;
	border-top:solid 2px #000;border-bottom:solid 1px #000;}
#order h4:not(.nonCom):before {
	content:"";position:absolute;top:17px;left:3px;
	width:15px;height:3px;background:#000;}
#order h4:not(.nonCom).sup {
	font-size:10px;font-size:1.0rem;color:#666;vertical-align:middle;}


@media screen and (min-width:770px) {
/* Page Navi
-------------------------------------------------------------------------*/
#order .pageNav > ul li a {color:#999;}
#order .pageNav > ul li a:hover {color:#000;}

#order #plastic .pageNav > ul li:nth-child(1) a,
#order #metal .pageNav > ul li:nth-child(2) a,
#order #custom .pageNav > ul li:nth-child(3) a,
#order #flow .pageNav > ul li:nth-child(4) a {color:#000;}

#order #plastic .pageNav > ul li:nth-child(1) a:before,
#order #metal .pageNav > ul li:nth-child(2) a:before,
#order #custom .pageNav > ul li:nth-child(3) a:before,
#order #flow .pageNav > ul li:nth-child(4) a:before{
	content:"";position:absolute;top:0;left:0;
	width:30px;height:4px;background:#000;}

#order #plastic .pageNav > ul li:nth-child(1) a:after,
#order #metal .pageNav > ul li:nth-child(2) a:after,
#order #custom .pageNav > ul li:nth-child(3) a:after,
#order #flow .pageNav > ul li:nth-child(4) a:after {display:none;} 

/* 下部配置用 */
#order .pageNav.btm {border-top:solid 1px #ddd; margin-bottom: 0;}

}


/* ページ下部　お問合せ（眼鏡アイコン付き）
-------------------------------------------------------------------------*/
#order .action .btn.other {margin-bottom:45px;}
#order .action .look {font-size:24px;font-size:2.4rem;line-height:1.0;
	font-weight:normal;text-align:center;padding:95px 0 0;margin:0 0 30px;
	background:url(../images/common/arrow02.svg) no-repeat center top;
	background-size:70px auto;}
#order .action .look span {position:relative;padding:0 0 0 50px;}
#order .action .look span:before {
	font-family:'icomoon';
	content: "\e90b";
	position:absolute;top:0;left:0;
	font-size:30px;font-size:3.0rem;transition:none;}

/*==========================================================================
　　オーダーメイド - TOP 
==========================================================================*/
#order #top #pageNav {margin:0 0 30px;}

#order #top section+section {margin:90px 0 0;}

#order #top #cnt01 .contents {padding:60px 0;text-align:center;}
#order #top #cnt01 .contents.catch {padding:0px;}
#order #top #cnt01 .photo {width:100%;max-height:340px;text-align:center;overflow:hidden;}
#order #top #cnt01 .photo img {width: 100vw;}

#order #top #cnt01 .scene {font-size:14px;font-size:1.4rem;line-height:1.8;margin:50px 0 0;}
#order #top #cnt01 .scene h4 {
	font-size:34px;font-size:3.4rem;color:#999;font-weight:normal;text-align:center;
	line-height:1.0;letter-spacing:0.05em;margin:0 0 15px;
	font-family:'Metropolis-SemiBold',Meiryo,"メイリオ", Osaka,"HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", sans-serif;}

/*==========================================================================
　　メタルフレーム、セルフレーム、カスタムオーダー　共通
==========================================================================*/
#order #plastic section+section,
#order #metal section+section,
#order #custom section+section {margin:80px 0 0;}

#order #plastic section section+section,
#order #metal section section+section,
#order #custom section section+section {margin:60px 0 0;}

#order p.intro {margin:0 0 30px;}
#order p.intro .sup {
	font-size:12px;font-size:1.2rem;color:#666;vertical-align:middle;margin:0 0 0 10px;}


/* メタルフレーム・セルフレーム共通
-------------------------------------------------------------------------*/
#order div.intro {margin:0 0 60px;text-align:center;}
#order div.intro h3 {margin:0 0 50px;}
#order div.intro .photo {margin:0 0 40px;}

/* 納期 */
#order div.intro .delivery {margin:40px 0 0;
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-justify-content:center;-ms-justify-content:center;justify-content:center;
	-webkit-align-items:center;-ms-align-items:center;align-items:center;}
#order div.intro .delivery span {
	background:#ebebeb;padding:5px 50px;}
#order div.intro .delivery span:first-child {color:#FFF;background:#000;}



/*--------------------------------------------------------------------------
　　素材
--------------------------------------------------------------------------*/
#order #material .block {
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
#order #material .block .column {width:48%;max-width:520px;margin:0 0 20px;}
#order #material .block .column:nth-child(odd) {margin:0 auto 20px 0;}
#order #material .block .column h5 {font-weight:normal;;line-height:1.0;
	padding:0 0 10px 20px;margin:0 0 10px;
	border-bottom:solid 1px #000;position:relative;}
#order #material .block .column h5:after {
	content:"";position:absolute;top:0;left:0;
	width:15px;height:15px;background:#ebebeb;border:solid 5px #000;}

#order #material .block .column .inner {padding:0 20px 0 0;
	display:-webkit-flex;display:-ms-flexbox;display:flex;}

#order #material .block .column .inner p.photo {flex:1 0 125px;;margin:0 auto 0 0;}
#order #material .block .column .inner .cntRht {width:355px;margin:0 0 0 10px;}


/*--------------------------------------------------------------------------
　　制作工程
--------------------------------------------------------------------------*/
#order #process .block {padding:0 0 55px;margin:0 0 15px;
	background:url(../images/order/process_arrow.jpg) no-repeat center bottom;
	-moz-background-size:contain;
	background-size:contain;
	display:-webkit-flex;display:-ms-flexbox;display:flex;}
#order #process .block:last-child {background:none;padding:0;}

#order #process .block .column {width:50%;max-width:550px;
	display:-webkit-flex;display:-ms-flexbox;display:flex;}
#order #process .block .column .entry {width:50%;max-width:255px;
	border:solid 1px #ddd;position:relative;margin:0 20px 0 0;}
#order #process .block .column .entry:after {
	content:"";position:absolute;top:50%;left:100%;margin-top: -15px;
	border:solid 15px transparent;
	border-left:solid 15px #000;}
#order #process .block .column .entry.end:after {display:none;}
#order #process .block .column .entry:last-child:after {display:none;}


#order #process .block .column .entry .step {color:#FFF;line-height:1.0;
	background:#000;padding:5px 10px;position:absolute;top:0;left:0;}

#order #process .block .column .entry .inner {
	font-size:14px;font-size:1.4rem;line-height:1.1;padding:9px;
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-align-items:center;-ms-align-items:center;align-items:center;}
#order #process .block .column .entry .inner p.text {padding:10px 0 0;width:100%;}
#order #process .block .column .entry .inner p.photo {width:80%;margin:0 0 0 auto;}


/*--------------------------------------------------------------------------
　　オーダー価格
--------------------------------------------------------------------------*/
#order #price .point {position:relative;padding:0 0 0 25px;margin:0 0 30px;}
#order #price .point:before {
	content:"";position:absolute;top:2.5px;left:0;
	width:15px;height:15px;background:#ebebeb;border:solid 5px #000;}

#order #price .point.mBtm10 {margin:0 0 10px;}

/* Table
-------------------------------------------------------------------------*/
#order #price table {width:100%;margin:0 0 10px;}
#order #price table th,#price table td {border:solid 1px #000;}
#order #price table th {font-size:14px;font-size:1.4rem;color:#FFF;
	text-align:center;line-height:1.0;background:#000;padding:8px 10px;}
#order #price table td {width:50%;
	padding:25px 7%;vertical-align:middle;}
#order #price table td:last-child {text-align:center;}
#order #price table tr:nth-child(odd) {background:#F6F6F6;}


#order #price table td .flex {
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-align-items:center;-ms-align-items:center;align-items:center;}

#order #price table td .flex p.price {margin:0 10% 0 0;}
#order #price table td .flex p.tSmall {font-size:12px;font-size:1.2rem;vertical-align:middle;}

/* オプション --------------------------------------------------------*/
#order #price table.option td {width:39%;max-width:430px;padding:10px 7%;}
#order #price table.option td:first-child {
	width:61%;max-width:670px;padding:10px 20px;}

#order #price table.option td .flex p.photo {margin:0 30px 0 0;}
#order #price table.option td .flex .cntRht ul {
	font-size:12px;font-size:1.2rem;margin:0 0 0 15px;}
#order #price table.option td .flex .cntRht ul li {
	position:relative;padding:0 0 0 8px;}
#order #price table.option td .flex .cntRht ul li:before {
	content:"";position:absolute;top:8px;left:0;
	width:2px;height:2px;background:#000;}
#order #price table.option td .flex .cntRht ul li a {color:#000;}
#order #price table.option td .flex .cntRht ul li a:hover {color:#0187FB;}

#order #price .priceSup {font-size:12px;font-size:1.2rem;text-align:right;}
#order #price .priceSup+.point {margin-top:30px;}

/* オーダー価格（カスタムオーダー） ----------------------------------*/
#order #price table.orderPrice td {width:33.3%;max-width:inherit;}
#order #price table.orderPrice td:nth-child(2) {text-align:center;}

#order #custom #price a {color:#000;}
#order #custom #price a:hover {color:#0187FB;}


/*--------------------------------------------------------------------------
　　制作事例
--------------------------------------------------------------------------*/
#order #case .block {
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}

/* セルフレーム
-------------------------------------------------------------------------*/
#order #plastic #case .block .column {width:50%;max-width:550px;
	padding:0 10px 0 0;margin:0 0 20px;
	display:-webkit-flex;display:-ms-flexbox;display:flex;}
#order #plastic #case .block .column:nth-child(2n) {padding:0 0 0 10px;}

#order #plastic #case .block .column .entry {width:50%;max-width:260px;
	border:solid 1px #ddd}
#order #plastic #case .block .column .entry:first-child {margin:0 20px 0 0;}

#order #plastic #case .block .column .entry p.photo {margin:9px;}
#order #plastic #case .block .column .entry p.name {
	font-size:14px;font-size:1.4rem;
	line-height:1.2;text-align:center;background:#ebebeb;padding:10px;}

/* メタルフレーム
-------------------------------------------------------------------------*/
#order #metal #case .block .column {
	width:50%;max-width:550px;padding:0 1% 0 0;margin:0 0 2%;}
#order #metal #case .block .column:nth-child(even) {padding:0 0 0 1%;}

#order #metal #case .block .column .inner {
	background:#ebebeb;padding:13px 20px 13px 13px;
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-align-items:center;-ms-align-items:center;align-items:center;}

#order #metal #case .block .column .inner p.photo {flex:1 0 100px;margin:0 4.6% 0 0;}
#order #metal #case .block .column .inner .cntRht {
	width:100%;max-width:380px;
	font-size:14px;font-size:1.4rem;}
#order #metal #case .block .column .cntRht p.name {
	font-size:16px;font-size:1.6rem;line-height:1.2;
	border-bottom:solid 1px #FFF;padding:0 0 5px;margin:0 0 10px;}


/*==========================================================================
　　カスタムオーダー　流れ
==========================================================================*/
#order #customFlow {}
#order #customFlow .flow .block .cntRht .inner {border:solid 2px #ddd;}
#order #customFlow .flow .block .cntRht .inner p.title {
	font-size:14px;font-size:1.4rem;
	line-height:1.0;padding:0 0 5px;margin:20px 30px 15px;
	border-bottom:solid 1px #ddd;}
#order #customFlow .flow .block .cntRht .inner ul {margin:0 30px 20px;}
#order #customFlow .flow .block .cntRht .inner ul li+li {margin:5px 0 0;}

#order #customFlow .flow .block .cntRht .inner .address {margin:0 0 15px;}
#order #customFlow .flow .block .cntRht .inner .address p:not(.title) {margin:0 30px;}


/*==========================================================================
　　オーダーの流れ
==========================================================================*/
#order #flow section+section {margin:60px 0 0;}

#order #flow .flow .block .cntRht .column.flex .txtBox {max-width:735px;}

#order #flow .flow a {color:#000;}
#order #flow .flow a:hover {color:#0187FB;}

/* STEP01 - SIZE */
#order #flow .flow .inner section+section {margin:20px 0 0;}

#order #flow .flow .inner h5 {height:60px;background:#f3f3f3;
	font-size:20px;font-size:2.0rem;font-weight:normal;line-height:1.0;
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-align-items:center;-ms-align-items:center;align-items:center;}
#order #flow .flow .inner h5 .size {
	font-size:24px;font-size:2.4rem;color:#FFF;background:#000;
	height:60px;padding:19px 30px 0;position:relative;margin:0 35px 0 0;}
#order #flow .flow .inner h5 .size:after {
	content:"";position:absolute;top:50%;left:100%;margin-top:-30px;
	border:solid 30px transparent;
	border-left:solid 15px #000;}
#order #flow .flow .inner .entry {padding:15px;
	border:solid 2px #f3f3f3;border-top:none;
	display:-webkit-flex;display:-ms-flexbox;display:flex;}

#order #flow .flow .inner .entry p.photo {margin:0 4% 0 0;}
#order #flow .flow .inner .entry .cntRht {max-width:595px;padding:10px 0 0;}
#order #flow .flow .inner .entry .cntRht p {
	position:relative;padding:0 0 0 10px;}
#order #flow .flow .inner .entry .cntRht p:before {
	content:"";position:absolute;top:8px;left:0;
	width:2px;height:2px;background:#000;}
#order #flow .flow .inner .entry .cntRht p+p {margin:5px 0 0;}

#order #flow .flow .inner .entry .cntRht p.photo {margin:8px 0 0;}
#order #flow .flow .inner .entry .cntRht p.photo:before {display:none;}

#order #flow .action {margin:90px 0 0;}


/*=========================================================================
  Tablet & SP 
=========================================================================*/
/*===============================================================
  見やすさ設定
===============================================================*/
@media screen and (max-width:1100px) {
	/*===============================================
	  Contents Common
	===============================================*/
	/* 見出し ----------------------------------*/
	#order h3 {
	font-size:52px;font-size:5.2rem;font-weight:normal;text-align:center;
	line-height:1.0;letter-spacing:0.05em;margin:0 0 10px;
	font-family:'Metropolis-SemiBold',Meiryo,"メイリオ", Osaka,"HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", sans-serif;}
	
	/* Contents --------------------------------*/
	
	/*===============================================
	  オーダーメイド - TOP
	===============================================*/
	#order #top #cnt01 .contents {padding:60px 2%;}
	
	/*===============================================
	  メタルフレーム、セルフレーム、カスタムオーダー　共通
	===============================================*/
	/*----------------------------------------
	　制作事例
	----------------------------------------*/
	/* メタルフレーム ------------------*/
	#order #metal #case .block .column .cntRht p.name {min-height:44px;}

}

/*===============================================================
  画面の横幅が769pxまで (タブレットサイズ)
===============================================================*/
@media screen and (max-width:769px) {

	/*===============================================
	  Contents Common
	===============================================*/
	#order #heading  {margin:0 0 20px;}
	
	/* 見出し ----------------------------------*/
	#order h3 {font-size:40px;font-size:4.0rem;}
	#order .h3sup,
	#order .h3sup{font-size:12px;font-size:1.2rem;margin:0 0 40px;}

	#order h4:not(.nonCom) {font-size:14px;font-size:1.4rem;height:35px;
		padding:9px 0 0 22px;margin:0 0 20px;}
	#order h4:not(.nonCom):before {top:14px;width:12px;height:2px;}
  
  #order .pageNav.btm { margin-bottom: 0;}
	
	/*----------------------------------------
	　ページ下部　お問合せ（眼鏡アイコン付き）
	----------------------------------------*/
	#order .action .btn.other {margin-bottom:25px;}
	#order .action .look {font-size:20px;font-size:2.0rem;
		padding:65px 0 0;margin:0 0 20px;
		background:url(../images/common/arrow02.svg) no-repeat center top;
		background-size:50px auto;}
	#order .action .look span {position:relative;padding:0 0 0 35px;}
	#order .action .look span:before {top:2px;font-size:22px;font-size:2.2rem;}
	
	/*===============================================
	  オーダーメイド - TOP
	===============================================*/
	#order #top section+section {margin:60px 0 0;}
	
	#order #top #cnt01 .contents {padding:40px 2%;}
		
	#order #top #cnt01 .scene {font-size:12px;font-size:1.2rem;margin:40px 0 0;}
	#order #top #cnt01 .scene h4 {font-size:28px;font-size:2.8rem;margin:0 0 15px;}
	
	/*===============================================
	  メタルフレーム、セルフレーム、カスタムオーダー　共通
	===============================================*/
	#order #plastic section+section,
	#order #metal section+section,
	#order #custom section+section {margin:60px 0 0;}
	
	#order p.intro {margin:0 0 30px;}
	#order p.intro .sup {font-size:10px;font-size:1.0rem;}
	
	/* メタルフレーム・セルフレーム共通 --------*/
	#order div.intro {margin:0 0 40px;}
	#order div.intro h3 {margin:0 0 30px;}
	#order div.intro .photo {margin:0 0 30px;}
	
	/*----------------------------------------
	　素材
	----------------------------------------*/
	#order #material .block .column .inner {
		padding:0 20px 0 0;display:block;}
	#order #material .block .column .inner p.photo {width: 50%;max-width:125px;
		flex:none;float:left;margin:0 15px 10px 0;}
	#order #material .block .column .inner .cntRht {width:100%;}
	
	/*----------------------------------------
	　制作工程
	----------------------------------------*/
	#order #process .block {padding:0 0 30px;margin:0 0 10px;}
	
	#order #process .block .column .entry .step {
		font-size:12px;font-size:1.2rem;padding:5px 5px;}
	
	#order #process .block .column .entry .inner {
		font-size:12px;font-size:1.2rem;padding:5px;}
	#order #process .block .column .entry .inner p.text {padding:15px 0 0;}
	
	/*----------------------------------------
	　オーダー価格
	----------------------------------------*/
	#order #price .point {padding:0 0 0 18px;margin:0 0 20px;}
	#order #price .point:before {
		top:3px;width:12px;height:12px;border:solid 4px #000;}
	
	/* Table -------------------------*/
	#order #price table th {font-size:12px;font-size:1.2rem;padding:5px 10px;}
	#order #price table td {padding:15px 3%;vertical-align:middle;}

	#order #price table td .flex {display:block;}
	#order #price table td .flex p.price {margin:0 0 5px;}
	#order #price table td .flex p.tSmall {font-size:10px;font-size:1.0rem;}
	
	/* オプション */
	#order #price table.option td {width:39%;max-width:430px;padding:10px 3%;}
	#order #price table.option td:first-child {
		width:61%;max-width:670px;padding:10px 5%;}

	#order #price table.option td .flex p.photo {text-align:center;margin:0 0 10px;}
	
	#order #price .priceSup {font-size:10px;font-size:1.0rem;}
	#order #price .priceSup+.point {margin-top:20px;}
	
	/*----------------------------------------
	　制作事例
	----------------------------------------*/
	/* セルフレーム ---------------------*/
	#order #plastic #case .block .column .entry p.name {
		font-size:12px;font-size:1.2rem;padding:5px;min-height:40px;}
	
	/* メタルフレーム ------------------*/
	#order #metal #case .block .column .inner {padding:10px;}
	#order #metal #case .block .column .inner p.photo {
		flex:none;width:30%;max-width:100px;margin:0 4.6% 0 0;}
	#order #metal #case .block .column .inner .cntRht {
		max-width:none;font-size:12px;font-size:1.2rem;}
	#order #metal #case .block .column .cntRht p.name {
		font-size:14px;font-size:1.4rem;min-height:38px;}
	
	/*===============================================
	  カスタムオーダー　流れ
	===============================================*/
	#order #customFlow .flow .block .cntRht .inner p.title {
		font-size:12px;font-size:1.2rem;margin:10px 15px 10px;}
	#order #customFlow .flow .block .cntRht .inner ul {margin:0 15px 10px;}
	
	#order #customFlow .flow .block .cntRht .inner .address {margin:0 0 10px;}
	#order #customFlow .flow .block .cntRht .inner .address p:not(.title) {margin:0 15px;}

	/*===============================================
	  オーダーの流れ
	===============================================*/
	#order #flow section+section {margin:40px 0 0;}
	
	/* STEP01 - SIZE */
	#order #flow .flow .inner h5 {height:40px;font-size:16px;font-size:1.6rem;}
	#order #flow .flow .inner h5 .size {font-size:18px;font-size:1.8rem;
		height:40px;padding:12px 10px 0;margin:0 25px 0 0;}
	#order #flow .flow .inner h5 .size:after {top:50%;left:100%;margin-top:-20px;
		border:solid 20px transparent;border-left:solid 10px #000;}
	
	#order #flow .flow .inner .entry {padding:10px;}
	#order #flow .flow .inner .entry .cntRht {padding:5px 0 0;}
	
	#order #flow .action {margin:50px 0 0;}
	
}

/*===============================================================
  画面の横幅が640pxまで (スマホサイズ)
===============================================================*/
@media screen and (max-width:640px){
	/*===============================================
	  Contents Common
	===============================================*/
	/* 見出し ----------------------------------*/
	#order h3 {font-size:28px;font-size:2.8rem;}
	#order .h3sup,
	#order .h3sup{text-align:left;margin:0 0 20px;}
	
	#order h4:not(.nonCom) {height:30px;padding:7px 0 0 20px;margin:0 0 16px;}
	#order h4:not(.nonCom):before {top:12px;width:10px;height:2px;}
	
	/*----------------------------------------
	　ページ下部　お問合せ（眼鏡アイコン付き）
	----------------------------------------*/
	#order .action .btn.other {margin-bottom:15px;}
	#order .action .look {font-size:16px;font-size:1.6rem;padding:40px 0 0;
		background:url(../images/common/arrow02.svg) no-repeat center top;
		background-size:30px auto;}
	#order .action .look span {padding:0 0 0 25px;}
	#order .action .look span:before {top:3px;font-size:16px;font-size:1.6rem;}
	
	/*===============================================
	  オーダーメイド - TOP
	===============================================*/
	#order #top #cnt01 .contents {padding:20px 2%;text-align:left;}
	#order #top #cnt01 .contents.catch {padding:0px 2%;}
  
	#order #top #cnt01 .scene {
		font-size:10px;font-size:1.0;line-height:1.4;margin:30px 0 0;}
	#order #top #cnt01 .scene h4 {font-size:22px;font-size:2.2rem;margin:0 0 10px;}
	#order #top ul.innerLink li {font-size:12px;font-size:1.2rem;}
	
	/*===============================================
	  メタルフレーム、セルフレーム、カスタムオーダー　共通
	===============================================*/
  
  #order .tablepress img { width: 100%;}
  
	#order #plastic section+section,
	#order #metal section+section,
	#order #custom section+section {margin:40px 0 0;}
	
	#order p.intro {margin:0 0 20px;}
	
	/* メタルフレーム・セルフレーム共通 --------*/
	#order div.intro {margin:0 0 30px;text-align:left;}
	#order div.intro h3 {margin:0 0 20px;}
	#order div.intro .photo {margin:0 0 20px;}

	/* 納期 */
	#order div.intro .delivery {font-size:12px;font-size:1.2rem;margin:20px 0 0;}
	#order div.intro .delivery span {padding:5px 15px;}
	#order div.intro .delivery span:first-child {padding:5px 10px;}
	
	/*----------------------------------------
	　素材
	----------------------------------------*/
	#order #material .block {display:block;}
	#order #material .block .column {width:100%;max-width:none;margin:0 0 15px;}
	#order #material .block .column:nth-child(odd) {margin:0 0 15px;}
	
	#order #material .block .column .inner {
		padding:0 20px 0 0;display:block;}
	#order #material .block .column .inner p.photo {width:30%;}
	
	/*----------------------------------------
	　制作工程
	----------------------------------------*/
	#order #process .block {padding:0;margin:0 0 10px;
		background:none;display:block;}
	#order #process .block:last-child {background:none;padding:0;}
	
	#order #process .block .column {width:100%;max-width:none;margin:0 0 10px;}
	#order #process .block .column .entry .step {
		font-size:12px;font-size:1.2rem;padding:5px 5px;}
	
	#order #process .block .column .entry .inner {
		font-size:12px;font-size:1.2rem;padding:5px;}
	#order #process .block .column .entry .inner p.text {padding:15px 0 0;}
	
	/*----------------------------------------
	　オーダー価格
	----------------------------------------*/
	/* Table -------------------------*/
	#order #price table td {padding:10px 3%;}
	
	/*----------------------------------------
	　制作事例
	----------------------------------------*/
	#order #case .block {display:block;}
	
	/* セルフレーム ---------------------*/
	#order #plastic #case .block .column {width:100%;
		padding:0;margin:0 auto 15px;}
	#order #plastic #case .block .column:nth-child(2n) {padding:0;}
	
	#order #plastic #case .block .column .entry p.name {min-height:inherit;}
	
	/* メタルフレーム ------------------*/
	#order #metal #case .block .column {width:100%;padding:0;margin:0 auto 15px;}
	#order #metal #case .block .column:nth-child(even) {padding:0;}
	
	#order #metal #case .block .column .cntRht p.name {min-height:inherit;}
	
	/*===============================================
	  オーダーの流れ
	===============================================*/
	#order #flow section+section {margin:30px 0 0;}
	
	/* STEP01 - SIZE */
	#order #flow .flow .inner h5 {height:30px;font-size:14px;font-size:1.4rem;}
	#order #flow .flow .inner h5 .size {font-size:14px;font-size:1.4rem;
		height:30px;padding:8px 10px 0;margin:0 15px 0 0;}
	#order #flow .flow .inner h5 .size:after {margin-top:-15px;
		border:solid 15px transparent;border-left:solid 7px #000;}

	#order #flow .action {margin:40px 0 0;}
}

/*===============================================================
  画面の横幅が480pxまで
===============================================================*/
@media screen and (max-width:479px){
	
	/*===============================================
	  メタルフレーム、セルフレーム、カスタムオーダー　共通
	===============================================*/
	/*----------------------------------------
	　制作工程
	----------------------------------------*/
	#order #process .block .column .entry .step {
		font-size:10px;font-size:1.0rem;padding:5px 5px;}
	#order #process .block .column .entry .inner p.text {padding:18px 0 0;}
	
	/*===============================================
	  オーダーの流れ
	===============================================*/
	/* STEP01 - SIZE */
	#order #flow .flow .inner .entry {display:block;}
	#order #flow .flow .inner .entry p.photo {width:180px;margin:0 auto 10px;}
}


/*===============================================================
  画面の横幅が325pxまで 小さいサイズ用処理
===============================================================*/
@media screen and (max-width:325px){
	

}
