/*
PCパーツ非表示
======================================*/
.ifItemOut { display:none; }


/* micro clearfix
======================================*/
.cf:before,.cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom: 1; }


/*
以下スマホ用スタイル
======================================*/
html { color: #666; font-family: Meiryo,"Hiragino Kaku Gothic ProN","MS PGothic",sans-serif; margin:0 auto; text-align: left; webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;/* box-sizing指定 */ }

body { background-color: #fff; font-size: 16px; line-height: 1.625em;/*26px*/margin:0 auto; width:96%; overflow-x:hidden; }

/* a { -webkit-tap-highlight-color:rgba(0,0,0,0); } iOS、アンドロイド タップ時ハイライトカラー非表示 */
h1 { display:none; font-size:2.25em;/*36px*/ line-height:1.3333;/*48px*/margin-bottom:24px;}
h2 { background-color:#efefef; border-left:10px solid #600; color: #600; font-size:1.5em;/*24px*/ font-weight: 600; line-height:1;/*24px*/margin-bottom:24px; padding: .5em 1em .5em .5em ; }
p { margin-bottom:1em; }
img { width:100%; height:100% }

/* スマホ用ヘッダー表示 */
.smpHeader { border:none; width:100%; height:auto; margin-bottom:10px; }

.capR { font-size: 12px; line-height:1.5; margin-bottom: 2em; text-align: right; }
.capL { font-size: 12px; line-height:1.5; margin-bottom: 2em; text-align: left; }

.que { color:#900; text-indent:-1em; padding-left:1em; }
.img950 { width:100%; text-align:right; margin:0 0 0 0; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; -ms-transition: all .2s; transition: all .2s; }
.line{ width: 100%; height: 5px; border-bottom:1px dashed #edc; margin-bottom: 1.5em; }

/* インタビューページ全体を覆うボックスなど #intvWrap
============================================================*/
#intvWrap { background: #fff; width:100%; margin:0 auto; padding:0 2%; }

/* インタビュータイトル部分 */
#intvTit img { width:100%; padding:0; }

/* インタビューコンテンツ部分 footer上まで */
#intvCont { margin-bottom:0px; }


/* インタビュー本文
============================================================*/
/* テキスト左 イメージ右 */
.txtL { margin-bottom:2em; }
.txtL img { float:none; margin:0 0 1em 0; width:100%; }
.txtL .que { color:#900; text-indent:0; padding-left:0em; }

/* テキスト右 イメージ左 */
.txtR { margin-bottom:2em; }
.txtR img { float:none; margin:0 0 1em 0; width:100%; }
.txtR .que { color:#900; text-indent:0em; padding-left:0em; }

/* テキスト、イメージセンター 100% */
.txtC { margin-bottom:2em; }
.txtC img { width:100%; margin-bottom:1em; }
.txtC .que { color:#900; text-indent:-1em; padding-left:1em;}

/* テキスト、イメージ左右二つ（もしくはセンター幅100%画像もあり） 100% 写真2カラム  */
.txtCimg2 { margin:0 auto 2em; width:100%;}
.txtCimg2 .imgFL { float:left; width:49%; }
.txtCimg2 .imgFR { float:right; width:49%; }
.txtCimg2 .imgFLmb1 { float:left; width:49%; }/* 画像4つ時左 下ネガティブマージン*/
.txtCimg2 .imgFRmb1 { float:right; width:49%; }/* 画像4つ時右　下ネガティブマージン */
.txtCimg2 .imgC { margin-bottom:1em; width:100%; }/* センター幅100%画像 */

.txtCimg2 .que { color:#900; text-indent:0; padding-left:0em; }

/* アニメーション系 */
.fadeInUpImg { -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; opacity:1; }


/* gallery
============================================================*/
#galleryWrap { width:100%; margin-bottom:48px; }
#galleryWrap .row4 { background-color:#fff; display:block; float:left; overflow:hidden; position:relative; width:49%; height:auto; }

/* .galleryはimgタグに記述しているclass */
#galleryWrap .row4 .gallery { width:100%; height: auto; }


/*
インタビューの続きはこちら  #intvNext
============================================================*/
#intvNext {　width:100%; margin-bottom:48px; }

/* 各ボタン */
#intvNext li { background-color:#efefef; line-height:2.5; list-style-type:none; margin:0 auto .5em; text-indent:1em; width:96%; }
#intvNext li a { background:#f9f9f9; border:1px solid #ccc; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; color:#900; display:block; position:relative; text-decoration:none; }
#intvNext li a:hover { background:#600; border:1px solid #600; border-radius: 3px; -webkit- border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; color:#fff; display:block; position:relative; width:100%; }

/* ＞矢印 beforeが実際の表示部分 */
#intvNext li a:before { display: block; content: ""; position: absolute; -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 50%; right: 15px; width: 10px; height: 10px; margin-top: -5px; background: #CCC; text-decoration:none; }

#intvNext li a:after{ /* after部分は背景と同色のrotateをかけたブロックを重ねてマスクとして使用、矢印を生成 */
display: block; content: ""; position: absolute; -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 50%; right: 18px; width: 10px; height: 10px; margin-top: -5px; background: #f9f9f9; text-decoration:none; }

/* ＞矢印 ホバー時 色変更 右へにゅるっと移動 */
#intvNext li a:hover:before { background: #fff; content: ""; display: block; position: absolute; -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 50%; right: 5px; width: 10px; height: 10px; margin-top: -5px; }

/* ＞矢印 ホバー時 after部分は背景と同色のrotateをかけたブロックを重ねてマスクとして使用、矢印を生成 */
#intvNext li a:hover:after { background: #600; content: ""; display: block; position: absolute;
-webkit-transform: rotate(45deg); transform: rotate(45deg); top: 50%; right: 8px; width: 10px; height: 10px; margin-top: -5px; }


/*職人の皆様のお声  #artisanWrap
============================================================*/
#intvCO #artisanWrap { width:100%; margin-bottom:1em; }
#intvCO .artisan { width: 100%; margin-bottom: .6em; }
#intvCO .artisan img { margin-bottom:1em; }
#intvCO .artisan p.last { margin-bottom:1.5em; }
#intvCO .artisan p span { color: #740; margin-right: .5em; font-weight: bold; }
#intvCO .artisan p { margin-bottom: .6em; }

.artisanTwo { display: block; }
.artisanTwo .fL { background:#f9f9f9; margin-bottom:1.5em; padding:2%; width:96%; }
.artisanTwo .fR { background:#f9f9f9; display:block; margin-bottom:1.5em; padding:2%; width:96%; }

#artisanWrap p { margin-bottom:.75em; }
#artisanWrap .artisanImg2co p span { color: #740; margin-right: .5em; font-weight: bold; }
#artisanWrap .imgFull { width:100%; margin-bottom:1em; }

/*ブランドページへバナー  #toBrandBa
============================================================*/
.toBrandBa { text-align:right; margin:2em 0 2em 0; opacity:1; cursor:pointer; }
.toBrandBa:hover { text-align:right; margin:2em 0 2em 0; opacity:.6; cursor:pointer; }

/* 最下部TOPページへ戻るボタン */
.toTop { display: block; margin: 0 auto 3em; width:100%; }
.toTop a { display: block; width: 80%; line-height: 3; margin: 10px auto; background-color: #600; color: #fff; text-decoration:none; text-align: center; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; opacity:1; }
.toTop a:hover { text-decoration: none; opacity: .6; cursor: pointer; }


/*フッター footer
============================================================*/
footer p { text-align: center; margin:0 auto; padding:0 0 2em; width:100%; }


/*その他パーツ
============================================================*/

/* 下から出てくる TOPへ戻るボタン */
#backTopPC { bottom:6px; right:6px; position:fixed; z-index:10; }
#backTopPC a img { opacity:1; width:44px; height:44px; }
#backTopPC a:hover img { opacity:1; }