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

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

　　修　理　　#repair

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

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

/* 見出し
-------------------------------------------------------------------------*/
#repair h3:not(.nonCom) {
	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;}
#repair .h3sup,
#repair .h3sup {font-size:14px;font-size:1.4rem;line-height:1.2;
	text-align:center;margin:0 0 50px;}


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

#repair #top .pageNav > ul li:nth-child(1) a {color:#000;}
#repair #top .pageNav > ul li:nth-child(1) a:before {
	content:"";position:absolute;top:0;left:0;
	width:30px;height:4px;background:#000;}
#repair #top .pageNav > ul li:nth-child(1) a:after {display:none;} 

#repair #flow .pageNav > ul li:nth-child(2) a {color:#000;}
#repair #flow .pageNav > ul li:nth-child(2) a:before {
	content:"";position:absolute;top:0;left:0;
	width:30px;height:4px;background:#000;}
#repair #flow .pageNav > ul li:nth-child(2) a:after {display:none;} 

#repair #contact .pageNav > ul li:nth-child(3) a {color:#000;}
#repair #contact .pageNav > ul li:nth-child(3) a:before {
	content:"";position:absolute;top:0;left:0;
	width:30px;height:4px;background:#000;}
#repair #contact .pageNav > ul li:nth-child(3) a:after {display:none;} 

}


/*==========================================================================
　　修理 - TOP 
==========================================================================*/
#repair #top h4 {
	font-size:30px;font-size:3.0rem;font-weight:normal;line-height:1.0;
	letter-spacing:0.05em;padding:40px 0 40px 85px;margin:0;
	font-family:'Metropolis-Medium',Meiryo,"メイリオ", Osaka,"HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", sans-serif;
	border-top:solid 7px #000;position:relative;}
#repair #top h4:before {
	content:"REPAIR";position:absolute;top:45px;left:15px;
	font-size:14px;font-size:1.4rem;}
#repair h4 .sup {font-size:14px;font-size:1.4rem;
	color:#666;letter-spacing:0;vertical-align:middle;}

#repair #top h5 {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;}
#repair #top h5:before {content:"";position:absolute;top:17px;left:3px;
	width:15px;height:3px;background:#000;}
#repair #top h5 .sup {font-size:10px;font-size:1.0rem;color:#666;vertical-align:middle;}


#repair #top section+section {margin:80px 0 0;}
#repair #top section section+section {margin:60px 0 0;}

#repair #top .block {display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
#repair #top .block .column {width:49%;max-width:540px;
	border:solid 1px #ddd;padding:12px 20px 12px 12px;margin:0 0 20px;
	display:-webkit-flex;display:-ms-flexbox;display:flex;
	-webkit-align-items:center;-ms-align-items:center;align-items:center;}
#repair #top .block .column:nth-child(odd) {margin:0 auto 20px 0;}

#repair #top .block .column p.photo {min-width:85px;margin:0 auto 0 0;}
#repair #top .block .column .cntRht {width:380px;margin:0 0 0 15px;}
#repair #top .block .column .cntRht p.title {line-height:1.2;
	border-bottom:solid 1px #ddd;padding:0 0 5px;margin:0 0 5px;}
#repair #top .block .column .cntRht p.text {font-size:14px;font-size:1.4rem;line-height:1.4;}


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

#repair #top table td.column-1 {font-weight: bold;}

@media screen and (min-width:770px) {
/* 修理項目一覧 */
#repair #top table.list td:nth-child(1) {
	width:44%;max-width:480px;text-align:left;padding-left:35px;}
#repair #top table.list td:nth-child(4) {width:22%;max-width:240px;}
#repair #top table.list td p.sup {font-size:12px;font-size:1.2rem; font-weight: normal;}


/* オプション （修理不可）*/
#repair #top table.option td {text-align:left;padding-left:40px;}
#repair #top table.option td:nth-child(1) {width:62%;max-width:675px;}
#repair #top table.option td p {position:relative;padding:0 0 0 10px;}
#repair #top table.option td p:before {
	content:"";position:absolute;top:5px;left:0;
	width:3px;height:3px;background:#000;}
}

#repair #top .priceSup {
	font-size:12px;font-size:1.2rem;color:#010101;text-align: right;}


/*==========================================================================
　　修理の流れ
==========================================================================*/
#repair #flow section+section {margin:60px 0 0;}

#repair #flow .flow .block .cntRht .inner {border:solid 2px #ddd;}
#repair #flow .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;}
#repair #flow .flow .block .cntRht .inner ul {margin:0 30px 20px;}
#repair #flow .flow .block .cntRht .inner ul li+li {margin:5px 0 0;}

/* 連絡先 */
#repair #flow .flow .block .cntRht .address {
	font-size:18px;font-size:1.8rem;font-weight:bold;
	padding:30px 60px;border-top:solid 1px #ddd;}
#repair #flow .flow .block .cntRht .address p.title {
	padding:0;margin:0 0 5px !important;border:none;}


/*==========================================================================
　　修理依頼お問合せ
==========================================================================*/
#repair #contact h3 {text-align:left;}

#repair #contact .mw-wp-form_image {max-width: 250px;}



/*=========================================================================
  Tablet & SP 
=========================================================================*/
/*===============================================================
  見やすさ設定
===============================================================*/
@media screen and (max-width:1100px) {
	/*===============================================
	  Contents Common
	===============================================*/
	/* 見出し ----------------------------------*/
	
	
	/* Contents --------------------------------*/
	
		


}

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

	/*===============================================
	  Common
	===============================================*/
	#repair #heading  {margin:0 0 20px;}
	
	/* 見出し ----------------------------------*/
	#repair h3:not(.nonCom) {font-size:34px;font-size:3.4rem;margin:0 0 10px;}
	#lens .h3sup,
	#lens .h3sup {font-size:12px;font-size:1.2rem;line-height:1.2;
		text-align:left;margin:0 0 40px;}
	
	/*===============================================
	  修理 - TOP 
	===============================================*/
	#repair #top h4 {font-size:24px;font-size:2.4rem;
		padding:25px 0 25px 70px;border-top:solid 5px #000;}
	#repair #top h4:before {
		top:30px;left:10px;font-size:12px;font-size:1.2rem;}
	#repair h4 .sup {font-size:12px;font-size:1.2rem;}
	
	#repair #top h5 {font-size:14px;font-size:1.4rem;height:35px;
		padding:9px 0 0 22px;margin:0 0 20px;}
	#repair #top h5:before {top:14px;width:12px;height:2px;}
	
	#repair #top section+section {margin:60px 0 0;}
	#repair #top section section+section {margin:40px 0 0;}

	#repair #top .block .column {padding:12px 15px 12px 10px;margin:0 0 20px;
		-webkit-align-items:flex-start;-ms-align-items:flex-start;align-items:flex-start;}

	#repair #top .block .column p.photo {margin:0 auto 0 0;}
	#repair #top .block .column .cntRht {width:100%;margin:0 0 0 10px;}
	#repair #top .block .column .cntRht p.text {font-size:12px;font-size:1.2rem;}
	
	/*----------------------------------------
	　Table
	----------------------------------------*/
	#repair #top table {font-size:12px;font-size:1.2rem;}
	
	/* 修理項目一覧 */
	#repair #top table.list td:nth-child(1) {max-width:300px;}
	
	/* オプション （修理不可）*/
	#repair #top table th {font-size:12px;font-size:1.2rem;}
	
	#repair #top .priceSup {font-size:10px;font-size:1.0rem;
		text-align:left;margin-left:1em;text-indent:-1em;}
	
	/*===============================================
	  修理の流れ
	===============================================*/
	#repair #flow section+section {margin:40px 0 0;}

	#repair #flow .flow .block .cntRht .inner p.title {
		font-size:12px;font-size:1.2rem;margin:10px 15px 10px;}
	#repair #flow .flow .block .cntRht .inner ul {margin:0 15px 10px;}
	#repair #flow .flow .block .cntRht .inner .spAct {display:block;}

	/* 連絡先 */
	#repair #flow .flow .block .cntRht .address {
		font-size:14px;font-size:1.4rem;padding:15px 30px;}

	/*==========================================================================
　　修理依頼お問合せ
  ==========================================================================*/
  
  #repair #contact .for, dl dd input[type="file"] {width: 100%; font-size: 14px; font-size: 1.4rem;}
	
}

/*===============================================================
  画面の横幅が640pxまで (スマホサイズ)
===============================================================*/
@media screen and (max-width:640px){
	
	/*===============================================
	  修理 - TOP 
	===============================================*/
	#repair #top h4 {font-size:18px;font-size:1.8rem;
		padding:15px 0 15px 50px;border-top:solid 3px #000;}
	#repair #top h4:before {
		top:18px;left:5px;font-size:10px;font-size:1.0rem;}
	#repair h4 .sup {font-size:10px;font-size:1.0rem;}
	
	#repair #top h5 {height:30px;padding:7px 0 0 20px;margin:0 0 16px;}
	#repair #top h5:before {top:12px;width:10px;height:2px;}
	
	#repair #top section+section {margin:40px 0 0;}
	#repair #top section section+section {margin:30px 0 0;}
	
	#repair #top .block {display:block;}
	#repair #top .block .column {width:100%;max-width:none;margin:0 0 10px;}
	#repair #top .block .column:nth-child(odd) {margin:0 0 10px;}
	
	/*----------------------------------------
	　Table
	----------------------------------------*/
	#repair #top table.bt tbody td:before {width:140px;text-align:left;
		background:#000;color:#FFF;font-weight:normal;
		margin-right:5px;padding:7px 10px;}
	#repair #top table.bt tr {border:solid 1px #000;}
	#repair #top table.bt tr:nth-child(even) {background:#F0F0F0;}
	#repair #top table.bt td {border:none;border-bottom:solid 1px #ccc;
		text-align:left;vertical-align:middle;
		width:100% !important;padding:0 !important;}
	#repair #top table.bt td:last-child {border:none;}
	#repair #top table.bt tbody td:last-child:before {border-bottom:solid 1px #FFF;}
	#repair #top table.bt td .bt-content {padding:7px 5px;width:100%;}
	
	
	/* 修理項目一覧 */
	#repair #top table.list td:nth-child(1) {max-width:none;}
	/*#repair #top table.list.bt td:nth-child(2) br {display:none;}
	#repair #top table.list.bt td:nth-child(3) br {display:none;}*/
	#repair #top table.list td:nth-child(4) {width:100%;max-width:none;}
	#repair #top table.list td p.sup {font-size:10px;font-size:1.0rem;}
	
	/* オプション （修理不可）*/
	#repair #top table.option td {text-align:left;padding:10px 3%;}
	#repair #top table.option td:nth-child(1) {width:60%;}
	#repair #top table.option td p {padding:0 0 0 8px;}
	#repair #top table.option td p:before {top:6px;}


}

/*===============================================================
  画面の横幅が480pxまで
===============================================================*/
@media screen and (max-width:479px){
	/*===============================================
	  修理 - TOP 
	===============================================*/
	#repair #top h4 {font-size:16px;font-size:1.6rem;}
	
	/*===============================================
	  修理の流れ
	===============================================*/
	#repair #flow section+section {margin:30px 0 0;}

	#repair #flow .flow .block .cntRht .inner p.title {margin:10px;}
	#repair #flow .flow .block .cntRht .inner ul {margin:0 10px 10px;}
	/* 連絡先 */
	#repair #flow .flow .block .cntRht .address {
		font-size:12px;font-size:1.2rem;padding:10px 10px 10px 20px;}
	
	
}


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

}
