@charset "utf-8";

/* iframe ヘッダー読み込み  */
.ifItemOut { width:1200px; height:500px; margin:0 auto; display:block; }
.smpHeader { border:none; width:100%; height:auto; margin-bottom:10px; display:none; }

/* PCでは非表示 */
.sp_show { display:none; }
/* PCでは表示 */
.pc_show { display:block; }


/*----- 基本設定 -----*/
html{ 
	width:100%;
	background: url(https://www.rakuten.ne.jp/gold/sentire/CORBO/_image/curious_interview/tanner-187-wh.jpg) repeat;
	background-attachment: fixed;
	background-size: cover;
	padding: 0;
	margin: 0;
}
body#intvCO2 {
	background: #ffffff;
	color:#555555;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 100%;
	line-height:1.7;
	width:1300px;
	margin:0 auto;
	padding:0 50px;
	box-shadow: 0 0 4px #888;
	-moz-box-shadow: 0 0 4px #888;
}

body#intvCO2 #intvCont {
width: 950px; margin: 0 auto;
}

img { max-width: 100%; }

/* パディングとボーダーをコンテンツ幅に含める */
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
h1 { margin: 0 auto; width:950px; }
h2{ margin:2rem 0; color:#423220; border-radius: 4px; line-height:1.3; padding:15px;
background-color:#eee9e4;}
/* reset */
p,figure,figcaption,ul,li {
margin:0;
padding:0;
}
ul,li{
list-style: none;
}

/* micro clearfix
-----------------------------------------------------*/
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom:1; }
/* float */
.fl_l { float:left; }
.fl_r { float:right; }

/* マージン
-----------------------------------------------------*/
.m0a { margin:0 auto; }

.mr5 { margin-right: 5px; } .mr10 { margin-right:10px; }	
.mr15 { margin-right:15px; } .mr20 { margin-right:20px; }
.mr25 { margin-right:25px; } .mr30 { margin-right:30px; }

.ml5  { margin-left: 5px; } .ml10 { margin-left:10px; }	
.ml15 { margin-left:15px; } .ml20 { margin-left:20px; }
.ml25 { margin-left:25px; } .ml30 { margin-left:30px; } .mb50 { margin-bottom:50px; }

.mb05rem { margin-bottom: .5rem; }
.mb07rem { margin-bottom: .7rem; }
.mb08rem { margin-bottom: .8rem; }
.mb1rem { margin-bottom:  1rem; }
.mb15rem { margin-bottom: 1.5rem; }
.mb2rem { margin-bottom: 2rem; }
.mb3rem { margin-bottom: 3rem; }
.mb4rem { margin-bottom: 4rem; }
.mb5rem { margin-bottom: 5rem; }

.mb_pc3rem_sp1rem { margin-bottom: 3rem; }

.tac { text-align:center;}

/*----- コンテンツ中のスタイル -----*/


blockquote {
    position: relative;
    padding: 10px 15px 10px 50px;
    box-sizing: border-box;
    font-style: italic;
/*    border: solid 2px #464646;*/
    color: #464646;
    margin-left:60px;
    margin-right:60px;
}

blockquote:before{
    display: inline-block;
    position: absolute;
    top: 20px;
    left: 15px;
    vertical-align: middle;
    content: "“";
/*    font-family: FontAwesome;*/
    color: #eee9e4;
    font-size: 25px;
    line-height: 1;
}

blockquote p {
    padding: 0;
    margin: 10px 0;
    line-height: 1.7;
}

blockquote cite {
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}


blockquote p {
    padding: 0;
    margin: 10px 0;
    line-height: 1.7;
}

blockquote cite {
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}


/* インタビュータイトル画像の直下の説明文 */
.curious_title {
width: 950px;
text-align: center;
margin: 0 auto;
}
.curious_description {
text-align: center;
font-size:1.2rem;
font-weight: 400;
margin-bottom: 2rem;
/*
background-color:#fff;
padding:15px;
border:1px solid #eee;
border-radius: 3px;
*/
}
.que,
.que_mb5rem {
 	color:#bf0000;
 	padding-left:1em;
 	text-indent: -1em;
  margin-top:1rem;
  margin-bottom: 2rem;
}
 .que:before,
 .que_mb5rem:before {
  content:"― ";
/*  color:#bf0000;  */
}
.que_mb5rem {
margin-bottom: 5rem;
}

.photo_cap {
color:#777777; 
font-size:.9rem;
text-align: center;
}
.capR { width: 950px; margin: 0 auto 2em; color:#999999; font-size: 12px; line-height:1.5; text-align: right; }

/* インタビューメンバーのスタイル
============================================================*/
#intvMember {
font-size:.95rem;
/*padding:20px;*/
width:950px;
margin:0 auto;
box-sizing: border-box;
margin-bottom: 1rem;
}
#intvMember .member_tit {
float:left;
font-size:1rem;
width:950px;
/*background-color: #f00;*/
margin-bottom: .5rem;
}
#intvMember .member {
padding:10px;
border:1px solid #eee;
background-color:#f6f6f6;
float:left;
width:302px;
text-align: left;
/*background-color: #e99;*/
line-height: 1.3;
display:table;
border-radius: 3px;
}
#intvMember .member li {
display: table-cell;
vertical-align: middle;
/*background-color:#e9e;*/
}
#intvMember .member li:last-child {
width:196px;/*196px;*/
padding-left:20px;
}

#intvMember .member+.member{
margin-left:20px;
/*background-color: #d9d*/
}
#intvMember .member li img {
width:100%;
}

/* インタビュー本文のスタイル
============================================================*/

#intvCO2 .comment_wrap {
positon:relative;
}
#intvCO2 .avatar{ width:80px; display: block; float:left; margin-bottom:1rem; }/* figureタグに.avatar */ 
#intvCO2 .avatar img {
 width:100%;
 height:auto;
 margin-bottom:8px;
}
#intvCO2 .avatar figcaption {
 text-align: center;
 font-size:11px;
 margin-top:-6px;
 line-height:1;
}
#intvCO2 .comment_text {
padding:1rem;
border:1px solid #ccc;
background: #fff;
width:850px;
float:right;
position:relative;
border-radius: 6px;
margin-bottom: 1rem;
}
/* 吹き出しの三角部分 */
#intvCO2 .comment_text::before {
content: "";
width:12px;
height:12px;
display: inline-block;
background: #fff;
/*border: 20px solid transparent;*/
border-top:1px solid #ccc;
border-left:1px solid #aaa;
-ms-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
/*border-right-color: #666;*/
position: absolute;
left: -7px;
top: 30px;
margin-top: 0;
}
/* Curiousコンセプト写真のスタイル */
#intvCO2 .curious_collection {
}
#intvCO2 .curious_collection img {
 max-width: 90%;
 text-align: center;
 display: block;
 margin: 0 auto;
}
/* gallery
============================================================*/

#intvCO2 #galleryWrap { width:100%; margin-bottom:48px; }
#intvCO2 #galleryWrap .row4 { background-color:#fff; display:block; float:left; overflow:hidden; position:relative; width:237px; height:158px; } /* ギャラリー各画像の親ボックス */

#intvCO2 #galleryWrap .row4 .gallery { /*.galleryはimgタグに記述しているclass、transition指定 */
width:100%; height: auto; -webkit-opacity:1; -moz-opacity:1; -o-opacity:1; -ms-opacity:1; opacity:1;
 transition: transform 0.2s linear 0s; transition-property: transform; transition-duration: 0.2s;
 transition-timing-function: linear; transition-delay: 0s; -webkit-transition: transform 0.2s linear 0s; -webkit- transition-property: transform; -webkit-transition-duration: 0.2s; -webkit- transition-timing-function: linear; -webkit-transition-delay: 0s; -moz-transition: transform 0.2s linear 0s; -moz- transition-property: transform; -moz-transition-duration: 0.2s; -moz- transition-timing-function: linear; -moz-transition-delay: 0s; -o-transition: transform 0.2s linear 0s; -o- transition-property: transform; -o-transition-duration: 0.2s; -o- transition-timing-function: linear; -o-transition-delay: 0s; -ms-transition: transform 0.2s linear 0s; -ms- transition-property: transform; -ms-transition-duration: 0.2s; -ms- transition-timing-function: linear; -ms-transition-delay: 0s; }

#intvCO2 #galleryWrap .row4:hover{ -webkit-opacity:.6; -moz-opacity:.6; -o-opacity:.6; -ms-opacity:.6; opacity:.6; }
#intvCO2 #galleryWrap .row4:hover .gallery { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1);} /* hover時透明度.6に、transformで1.1倍に拡大 */

/* 職人の皆様のお声  #artisanWrap
============================================================*/
#intvCO2 .artisanWrap { width:100%; margin-bottom:48px; }

/* display table-cell */
.artisanTwo { border-collapse: separate; border-spacing: 1em 0; display: table; }
.artisanTwo .fL { display:table-cell; width:40%; padding:1% 2%; background:#f9f9f9; }
.artisanTwo .fR { display:table-cell; width:40%; padding:1% 2%; background:#f9f9f9; }
#intvCO2 .artisanWrap span { font-weight: bold; color:#600; }
#intvCO2 .artisanWrap .imgFull { width:100%; margin-bottom:48px; }

/* 職人様のお声 */
#intvCO2 .artisanWrap { width: 950px }
#intvCO2 .artisan { width: 100%; margin-top: 2em; margin-bottom: 2em; }
#intvCO2 .artisan .name { font-weight: bold; }
#intvCO2 .artisan p { margin-bottom: .3em; }
#intvCO2 .artisan p.last { margin-bottom:2em; }
#intvCO2 .artisan p span { color: #774400; margin-right: .5em; font-weight: bold; }

/* 職人様写真 2列 Ver. */
#intvCO2 .artisan_img2_fL { width: 47%; margin: 0 0 3% .5%; float: left; }
#intvCO2 .artisan_img2_fR { width: 47%; margin: 0 2% 3% 0; float: right; }
#intvCO2 .artisan_img2_fL img,
#intvCO2 .artisan_img2_fR img {
  width: 100%;
  border: 5px solid #ffffff;
  box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow:box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
  -moz-box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
  -o-box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
  -ms-box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
}
/* 職人様写真 1列 */
#intvCO2 .artisanWrap .imgFull img {
  width:98%;
/* margin-bottom:48px; */
	border: 5px solid #ffffff;
	box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow:box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
	-moz-box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
	-o-box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
	-ms-box-shadow:2px 2px 3px 2px rgba(0, 0, 0, 0.3);
}
  
/*ブランドページへバナー  #toBrandBa
============================================================*/
.toBrandBa { text-align:right; margin:48px 0 48px 0; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; -ms-transition: all .2s; transition: all .2s; }
.toBrandBa:hover { opacity:.6; cursor:pointer; }

/* 最下部アイテム一覧へボタン */
.toItems { display: block; margin: 0 auto 3em; width:100%; }
.toItems a { display: block; width: 80%; line-height: 3; margin: 10px auto; background-color: #dd8800; 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; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; -ms-transition: all .2s; transition: all .2s; }
.toItems a:hover { 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: #900; 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; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; -ms-transition: all .2s; transition: all .2s; }
.toTop a:hover { opacity:.6; cursor:pointer; }

/* このページの先頭に戻る */
#backTopPC { bottom:20px; right:20px; position:fixed; z-index:10; display:none; }
#backTopPC a img { opacity:.7; width:44px; height:44px; }
#backTopPC a:hover img { opacity:.5; }

/* キュリオスのアイテム紹介
============================================================*/
#intvCO2 item_box { width:950px; margin:0 auto 2em; }
#intvCO2.items { margin-right:-10px; padding:0; } /* .item各フロートを囲むボックスにネガティブマージン */

#intvCO2 .item { float: left; margin: 0 7px 20px 0; padding: 15px; text-align: center; width: 230px; height: 410px; background:/*url(https://www.rakuten.ne.jp/gold/sentire/CORBO/renewal16/bg_item_corbo.png)*/ #faf9f8 left top no-repeat; position:relative; } 

#intvCO2 .item a:link,
#intvCO2 .item a:visited,
#intvCO2 .item a:hover,
#intvCO2 .item a:active {
text-decoration: none;
color:#423220;
}
#intvCO2 .item a:hover,
#intvCO2 .item a:active {
text-decoration: underline;
}

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


