@charset "utf-8";

/* Reset
------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin-top: 0;
margin-right: 0;
margin-left: 0;
margin-bottom: 0;
padding-top: 0;
padding-right: 0;
padding-left: 0;
padding-bottom: 0;
border: 0;
font-size: 100%;
font: inherit;
height: auto;
width: auto;
}

img {
border: 0;
vertical-align: top;
max-width: 100%;
height: auto;
}


li {
	list-style-type: none;
}

body {
font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "游ゴシック", "Meiryo", "YuGothic", sans-serif;
margin: 0 auto;
background-image: url(header_nbo_bg.jpg);
background-repeat: no-repeat;
background-position: center -31px;
}

/*レイアウト*/
.container {
width: 1000px;
margin: 0 auto;
}

.container-fluid {
  margin-right: auto;
  margin-left: auto;
}
.row {
overflow: hidden;
margin-right: auto;
margin-left: auto;
width: 1000px;
}

.img-responsive {
display: block;
max-width: 100%;
height: auto;
}

.img-full {
width: 100vw;
height: auto;
}
.center-block {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

.clearfix {
	overflow: hidden;
}
.mb20 {
margin-bottom: 20px;
}
.mb30 {
margin-bottom: 30px;
}
.mb50 {
margin-bottom: 50px;
}
.mb80   {
margin-bottom: 80px;
}


/*ヘッダー ***********************************************************/
header {
background-image: url(header_bg.png);
background-repeat: repeat-x;
background-position: 0% 15px;
height: 195px;
}
header .container {
padding-top: 15px;
padding-right: 0;
padding-left: 0;
}

/*tokyo underline vision ロゴ*************************************************/
.jrht-logo {
display: block;
float: left;
margin-bottom: 0px;
width: 210px;
margin-top: 15px;
}
.header-logo-sp {
display: none;
}

#gNav ul {
width: 693px;
display: block;
margin-top: 44px;
overflow: hidden;
float: right;
margin-right: 0px;
padding-right: 0px;
}
#gNav li {
	float: left;
}
#gNav li a {
	display: block;
	margin:0 0 10px 0;
}

.header-sp {
	display: none;
}



/*ヘッダー（ここまで）
***********************************************************/


/* メインイメージ */	 
.main-img .img-responsive {
    width: 100%;
}
.main-name .img-responsive.main-img-02 {
margin-right: auto;
margin-left: auto;
width: auto;
}

img.img-responsive.main-img-01 {
margin-bottom: 0px;
}
.main-img.pc .main-name {
width: 100%;
background-size: cover;
padding-top: 38px;
padding-bottom: 38px;
margin-bottom: 40px;
}

.main-img.sp {
	display: none;
}
.main-img-02 {
display: none;
}


/*リード*/
.read-style {
margin-top: 86px;
margin-bottom: 86px;
}
.readcopy {
width: 1000px;
font-size: 17px;
line-height: 36px;
font-weight: bold;
color: #575757;
padding-top: 0px;
margin-top: 68px;
margin-right: auto;
margin-left: auto;
margin-bottom: 0;
text-align: center;
}


/*記事*/
 .taidan-pc {
display: block;
}
 .taidan-sp {
display: none;
}

.taidan-style {
position: relative;
margin-bottom: 50px;
}
.taidan-style.pc .desc img {
margin-bottom: 50px;
}

.pull-left {
float: left;
width: 488px;
}
.pull-right {
	float: right;
}

.desc {
width: 466px;
}
.desc2 {
width: 468px;
}
.desc2.pull-left p {
width: 488px;
font-size: 16px;
line-height: 26px;
}
.mt30 {
margin-top: 30px;
}

.desc2.pull-right p {
font-size: 16px;
line-height: 26px;
}
.taidan-style .taidan-subttl {
margin-bottom: 20px;
margin-top: 30px;
}


/*　ストリート　建築探訪　*/
.street-header.pc {
display: block;
margin-top: 100px;
}
.street-header.sp {
display: none;
}

.street-header {
background-image: url(street_header_bg.jpg);
height: 378px;
padding-top: 141px;
text-align: center;
background-size: cover;
background-repeat: no-repeat;
background-position: 50% 0%;
}

.kenchiku-tanho-ttl {
padding-top: 100px;
padding-bottom: 100px;
width: 883px;
}

.ttl-box  {
width: 304px;
}
.text-box {
width: 509px;
}
.text-box p {
font-size: 16px;
line-height: 1.75em;
}


img.shop-logo   {
margin-bottom: 20px;
}

.street-map {
background-color: #EFEFEF;
padding-top: 100px;
padding-bottom: 50px;
width: auto;
}
.street-map img {
max-width: 900px;
width: auto;
margin-left: auto;
margin-right: auto;
}



/*パララックス*/
.street-body.pc {
display: block;
}
.street-body.sp {
display: none;
}
.street-body.sp  {
background-color: #EFEFEF;
}

.bg-color01 .scroll-bg-content {
margin-top: 0;
margin-right: -15px;
margin-left: -15px;
box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}


.fixed-bg {
position: relative;
min-height: 100vh;
background-attachment: fixed;
background-position: center;
z-index: 1;
background-size: contain;
background-repeat: no-repeat;
}

.fixed-bg .fixed-bg-content {
position: absolute;
left: 50%;
top: 50%;
bottom: auto;
right: auto;
width: 100%;
margin: 0 auto;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}

.scroll-bg .scroll-bg-content {
margin: 0 auto;
position: relative;
z-index: 10;
}

.bg01 {
background-image: url(jrtk_ill-02.png);
background-color: #EFEFEF;
}
.bg02 {
background-image: url(jrtk_ill-03.png);
background-color: #EFEFEF;
}
.bg03 {
background-image: url(jrtk_ill-04.png);
background-color: #EFEFEF;
}
.bg04 {
background-image: url(jrtk_ill-05.png);
background-color: #EFEFEF;
}
.bg-color01 {
background-color: #EFEFEF;
}
.fixed-bg.bg02 img, .fixed-bg.bg03 img {
position: absolute;
top: -6px;
}

.line-shadow {
padding-left: 15px;
margin-top: 0;
margin-right: -15px;
margin-left: -15px;
box-shadow: 0px 10px 10px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 10px 10px rgba(0,0,0,0.2);
}

/*店舗ロゴ*/

.shop-logo.pc {
width: auto;
padding-top: 100px;
padding-right: 100px;
padding-left: 100px;
padding-bottom: 100px;
/* [disabled]background-color: #E52427; */
margin-bottom: 0;
}
.shop-logo.pc ul {
width: 1000px;
display: block;
margin: 0 auto;
overflow: hidden;
}
.shop-logo.pc ul li {
width: 499px;
float: left;
}
.shop-logo.pc ul li:first-child {
border-right: 1px solid #858585;
}
.shop-logo.pc ul li a {
display: block;
}
.shop-url {
text-align: center;
margin-top: 20px;
font-size: 15px;
color: #00a0e9;
font-weight: bold;
}



/*フッター ***********************************************************/

footer {
padding-bottom: 70px;
margin-top: 100px;
}

.footer-menu.pc {
display: block;
}
.footer-menu.sp {
display: none;
}
.footer-menu {
width: auto;
}

/*ナビ*/
.fNav {
overflow: hidden;
}

.fNav ul {
width: 1000px;
margin: 20px auto 0px auto;
}
.fNav li {
float: left;
margin-bottom: 35px;
}
.fNav li:nth-child( odd ) {
margin-right: 40px;
}

.footer-logo img {
margin-bottom: 20px;
}
.footer-logo .url {
font-size: 1em;
font-weight: bold;
letter-spacing: 2px;
text-align: center;
margin-right: auto;
margin-left: auto;
margin-bottom: 20px;
}
.footer-logo .url a {
  color: #575757;
}
.footer-logo .url a:link {
  text-decoration: none;
}
.footer-logo .url a:visited {
  text-decoration: none;
}
.footer-logo .url a:hover {
  text-decoration: underline;
}
.footer-logo .url a:active {
  text-decoration: none;
}

.footer-logo .address-style {
width: 476px;
font-size: 0.8em;
text-align: center;
margin: 0 auto;
border-right: 2px solid #DDDDDD;
border-left: 2px solid #DDDDDD;
height: 36px;
padding-top: 15px;
}

.address .br-hidden {
display: none;
}





/*   レスポンシブル設定 ======================================= */

 @media only screen and (min-width: 1200px) {
 
 .main-img.pc .main-name {
height: auto;
}
.street-header {
background-image: url(street_header_bg.jpg);
height: 378px;
padding-top: 141px;
text-align: center;
background-repeat: no-repeat;
background-size: cover;
}

.main-img-01 {
display: none;
}
.main-img-02 {
display: block;
}

}


@media (min-width: 768px) and (max-width: 999px) {
.street-header img {
width: 70%;
}

}




 @media only screen and (max-width: 768px) {

/*レイアウト*/
body {
	width:100%;
}
.container {
	width: 100%;
}
.row {
	width: auto;
}

/*ロゴ*************************************************/
.jrht-logo {
display: none;
}
.header-logo-sp {
display: block;
}


/*ヘッダー ナビ*/
#header {
	display: none;
}

header {
height: auto;
}

.header-logo-sp {
background-color: #FFFFFF;
text-align: center;
padding-top: 10px;
padding-bottom: 15px;
}
.header-logo-sp img {
width: 160px;
height: auto;
}


.header-pc {
display: none;
}
.header-sp {
display: block;
background-color: #000000;
padding-top: 10px;
padding-bottom: 10px;
}
header .container {
padding-top: 0px;
padding-bottom: 0px;
}
.container.header-sp {
width: 100%;
background-color: #ffffff;
}

#gNav2 ul {
width: 100%;
margin: 0 auto;
}
#gNav2 li {
width: 16.48%;
float: left;
margin-left: 1px;
margin-right: 0px;
}
#gNav2 li img {
display: block;
width: auto;
}

#gNav2 li:last-child {
margin-right: 0px;
}



/*メインイメージ */
.main-img.pc {
	display: none;
}
.main-img.sp {
	display: block;
}

.main-img-01 {
margin-top: 20px;
margin-bottom: 0px;
}
.main-img-02 {
margin-bottom: 0px;
display: block;
}


/*リード*/
.read-style {
margin-top: 50px;
margin-bottom: 50px;
}


.readcopy {
font-size: 1em;
font-weight: bold;
text-align: left;
line-height: 1.75em;
margin-top: 30px;
margin-right: auto;
margin-left: auto;
margin-bottom: 0px;
width: auto;
}
.main-img.sp .read-style {
padding-left: 80px;
padding-right: 80px;
}


  
/*対談*/
 .taidan-pc {
display: none;
}
 .taidan-sp {
display: block;
}
.taidan-sp p {
font-size: 1em;
}

.taidan-box  {
width: auto;
}

.ph-txt {
position: relative;
z-index: 10;
padding: 0 80px;
}


  
  
/*　ストリート　建築探訪　*/
.street-header.pc {
display: none;
margin-top: 100px;
}
.street-header.sp {
display: block;
}
.street-body.sp {
padding-bottom: 50px;
}

.street-body.sp .ill-street {
background-color: #EFEFEF;
padding-top: 50px;
padding-bottom: 50px;
}

.street-header {
height: 100%;
background-image: none;
padding-top: 0px;
}

.street-header.sp img {
width: 100%;
}

.kenchiku-tanho-ttl {
width: auto;
padding-top: 50px;
padding-bottom: 50px;
}

.ttl-box  {
width: 304px;
margin: 0 auto;
}
.ttl-box.pull-left, .text-box.pull-right {
float: none;
}

.text-box {
width: 509px;
margin-top: 50px;
margin-right: auto;
margin-left: auto;
margin-bottom: 0;
}

.text-box p {
font-size: 16px;
line-height: 1.75em;
}

.street-map {
display: none;
}


/*パララックス*/
.street-body.pc {
display: none;
}
.street-body.sp {
display: block;
}

.container.shop-logo.pc {
display: none;
}

.street-body.sp .shop-logo {
margin-right: auto;
margin-left: auto;
display: block;
padding-bottom: 0px;
margin-bottom: 0px;
}
.shop-url {
margin-top: 15px;
}

img.shop-logo   {
width: 320px;
}

.taidan-box .ph-txt .center-block.mb50 {
margin-bottom: 20px;
}
.street-body.sp .ill-street .center-block {
margin-top: 70px;
margin-bottom: 80px;
}
.taidan-subttl {
margin-top: 30px;
margin-bottom: 20px;
}



     
/*フッター ***********************************************************/

footer {
padding-bottom: 50px;
margin-top: 50px;
}

.footer-menu.pc {
display: none;
}
.footer-menu.sp {
display: block;
background-image: url(footer_nav_ttl_sp.png);
background-repeat: no-repeat;
background-position: center top;
padding-top: 70px;
}

/*ナビ*/

.fNav ul {
width: 400px;
margin: 0 auto;
}
.fNav li {
margin-bottom: 15px;
}
.fNav li:nth-child( odd ) {
margin-right: 0px;
}
.fNav li a {
}

.footer-logo img {
    height: auto;
}
.address .br-hidden {
display: none;
}
.street-body.sp div .hr-line {
border-top: 1px solid #7C7C7C;
margin-top: 30px;
margin-bottom: 30px;
width: 58%;
margin-left: auto;
margin-right: auto;
}

}



@media screen and (max-width:600px) {

/* メインイメージ */


/*リード*/
.read-style {
width: auto;
padding: 0 15px;
margin-top: 25px;
}

.readcopy {
width: auto;
color: #575757;
line-height: 1.7em;
text-align: left;
}

.main-img.sp .read-style {
padding-left: 40px;
padding-right: 40px;
}
.ph-txt {
padding: 0 40px;
}



/*対談*/
.row.taidan-style.sp {
width: auto;
padding: 0 15px;
}


/*フッター ***********************************************************/

footer {
padding-bottom: 50px;
}

}


@media screen and (max-width:480px) {

/*ヘッダー*/
.header-logo-sp img {
width: 131px;
}

/*ナビ*/
#gNav2 ul {
width: auto;
margin-top: 0;
margin-bottom: 0;
margin-right: 0px;
}
#gNav2 li {
width: 16.3%;
}
#gNav2 li img {
}
#gNav2 li:last-child {
margin-right: 0px;
}



/* メインイメージ */
.readcopy {
width: auto;
margin-right: 0px;
margin-left: 0px;
margin-bottom: 30px;
margin-top: 20px;
font-size: 0.9em;
line-height: 1.75em;
}

.row p {
font-size: 0.9em;
line-height: 1.75em;
margin-bottom: 0px;
}

/*リード*/

.readcopy {
width: auto;
color: #575757;
line-height: 1.7em;
text-align: left;
}

.main-img.sp .read-style {
padding-left: 30px;
padding-right: 30px;
}
.ph-txt {
padding: 0 20px;
}

.taidan-sp p {
font-size: 0.9em;
}



/*　ストリート　建築探訪　*/

.kenchiku-tanho-ttl {
width: auto;
}
.kenchiku-tanho-ttl .ttl-box img {
width: 60%;
}

.ttl-box  {
width: auto;
text-align: center;
}
.text-box {
width: auto;
padding: 0 15px;
margin-top: 30px;
}
.text-box p {
font-size: 0.9em;
line-height: 1.7em;
}

img.shop-logo   {
margin-bottom: 20px;
width: 240px;
}
.shop-url {
font-size: 0.8em;
}
.street-body.sp div .hr-line {
width: 80%;
}



/*フッター ***********************************************************/
.footer-menu {
margin-top: 30px;
}

.fNav {
width: auto;
}
.fNav ul {
width: 100%;
}
.fNav li {
margin-bottom: 15px;
}
.fNav li img {
width: 90%;
display: block;
margin: 0 auto;
}
.fNav li:nth-child( odd ) {
}


.footer-logo .address-style {
width: 75%;
padding: 0 10px;
margin: 0 auto;
}
.footer-logo img {
max-width: 300px;
}

.address-style .address {
font-size: 0.9em;
}
.address-style .url {
font-size: 0.7em;
}
.address .br-hidden {
display: block;
}
.footer-logo .address-style {
width: 70%;
font-size: 0.8em;
padding-top: 10px
}




}

@media screen and (max-width:375px) {


/*ヘッダー*/
/*
.header-logo-sp img {
width: 102px;
}
*/

/*ナビ*/
#gNav2 ul {
margin-right: 0px;
margin-left: 1px;
}
#gNav2 li {
width: 16.3%;
}
#gNav2 li img {
}

/*リード*/
.main-img.sp .read-style {
padding-left: 15px;
padding-right: 15px;
}


/*対談*/
.taidan-sp p {
font-size: 0.9em;
}

.ph-txt {
padding: 0 20px;
}

.shop-url {
font-size: 0.7em;
}




/*フッター ***********************************************************/

.footer-logo .address-style {
width: 80%;
padding: 0 5px;
}

.footer-logo img {
width: 80%;
}
.address-style .url {
font-size: 0.7em;
letter-spacing: 10px;
}

.footer-menu.sp img {
width: 80%;
margin: 0 auto;
}

    

    
}