@charset "utf-8";
/* -------------------------------------
and_wide_s.css  ver.2
last update : 16.06.10 17:00

0.
1.TOP page
2.Contents
3.article
4.bijin
5.kinokuniya ranking
6.recomend
7.collection
8.index(sitemap)
9.theater
10.clickdeep
11.pet
12.video
20.Sub
30.footer
------------------------------------- */
/* 横幅480以下 */
@media screen and (max-width:480px){

body {
position: relative;
}

#Header,
#Contents,
#Footer #FooterInner,
#Footer #ToTop #ToTopInner{
width:320px;
max-width:320px;
margin:0 auto;
}

#Footer,
#Header #HeaderInner,
#Contents #ContentsInner,
#Footer #ToTop,
#Footer .AboutSite{
width:auto;
max-width:100%;
margin:0 auto;
padding:0;
}

#Contents #ContentsInner{
padding:0 0 50px;
}


body.gnavSpOpen {
height: 500px;
overflow: hidden;
}

/* -------------------------------------
Header
------------------------------------- */
#Header #HeaderInner{
margin: 0!important;
padding:0;
}


#Header #HeaderInner .UserBox{
width:auto;
}

#Header #HeaderInner #adHeader .UserInfo{
width:auto;
}

.UserBox .UserInfo li.Info{
display:none;
}


/* Header sns
------------------------------------- */
.header_sns_box{
margin:0 auto;
padding:8px 0 7px;
}


/* =====================================
1.TOP page
------------------------------------- */
#TopHeader{
margin:0!important;
padding:0 0 17px;
}

.Header_top{
display: none;
height:auto;
background:#fff;
}


.fix #TopHeader{
margin-top: 83px!important;
}



/* Gnav
------------------------------------- */
#andGnaviBox,
.fixed #andGnaviBox{
width:300px;
margin:0 auto;
padding:0;
border-bottom:none;
}

#Top ul#andGnavi,
ul#andGnavi,
ul#andGnavi2{
float:none;
width:100%;
padding:10px 0 3px;
text-align:center;
overflow:hidden;
}

ul#andGnavi li{
padding:0 15px 0 0;
}

ul#andGnavi li.headerLogo,
.fixed ul#andGnavi li.headerLogo{
display:none;
}

ul#andGnavi .navItem{
}


/* search area
------------------------------------- */
.search{
float:none;
position:static;
top:inherit;
left:inherit;
margin:0 auto;
padding:0;
line-height:1;
}

#Top .search{
float:none;
top:auto;
left:auto;
right:auto;
bottom:20px;
margin:0;
padding:0;
line-height:1;
}

#Top .search #searchbox {
width: 190px;
border-bottom:1px solid #ccc;
}


/* Gnav fixed
------------------------------------- */
.fixed{
width:100%;
height:98px;
background:#fff;
}

.fixed #andGnaviBox{
height:90px;
}

#Top .fixed .search,
.fixed .search{
position:relative;
top:0;
margin:0 auto;
padding-top:0;
text-align:center;
}

.fixed #searchbox{
float:none;
margin:0 auto;
}


/* Header Logo（TOP logo）
------------------------------------- */
.headerLogoArea{
float:none;
width:100%;
padding-right:0;
padding-left:0;
margin-top:33px;
}

.headerLogoArea h1 img{
width:137px;
}

.headerLogoArea h2{
padding: 35px 0 55px;
}

.header_sitechange_box{
display: none;
}

.sitechange_top{
padding-bottom: 10px;
}


/* Header main image area
------------------------------------- */
.headerImageArea{
float:none;
width:298px;
height:298px;
margin:0 auto;
border:1px solid #ccc;
}

.headerImageArea img{
width:298px;
height:298px;
}

.headerImageArea .header_image_message{
padding: 0 5px 15px 10px;
font-size:21px;
}

/* Header news list
------------------------------------- */
.header_news_text{
position: relative;
top: auto;
left:auto;
float:none;
width:248px;
height:auto;
margin:30px auto 0;
padding:25px 25px 55px;
border: 1px solid #ccc;
}

.fix .header_news_text{
top:auto;
}

.header_news_text_inbox{
position: static;
}

.header_news_title{
width: 248px;
padding-bottom:15px;
}

.header_news_text li{
width: 248px;
padding:12px 0;
}


/*header banner area(widget)
------------------------------------- */
.header_bnrArea{
position:static;
top:inherit;
left:inherit;
float:none;
width:auto;
height: auto;
margin:20px auto 5px;
padding-bottom: 0;
border-bottom: 1px solid #ccc;
overflow: hidden;
}

.header_bnr_title{
padding-bottom:0;
border-bottom:1px solid #ccc;
}

.header_bnr ul{
margin:0 auto;
text-align:center;
overflow:hidden;
}

.italian2013 .header_bnr,
.portraitBnr .header_bnr {
    padding-top: 28px;
}
#TopHeader .header_bnrArea.italian2013,
#TopHeader .header_bnrArea.portraitBnr{
	display: block;
	clear: both;
}

#TopHeader .header_bnrArea.italian2013,
#TopHeader .header_bnrArea.portraitBnr {
position: static!important;
float: none!important;
top:auto;
left:auto;
right:auto;
width: 280px!important;
height: auto;
margin: 25px auto 0!important;
padding-bottom:12px;
border-bottom: medium none;
border-top: 0;
border-bottom: 1px solid #ccc;
}
#TopHeader .header_bnrArea.italian2013 .header_bnr,
#TopHeader .header_bnrArea.portraitBnr .header_bnr {
	padding-top: 16px;
}

.header_bnr_item {
float: left;
width: 140px;
height:auto;
}

.oneItem{
float: none;
margin: 0 auto;
}

.header_bnr_item p{
display: none;
}

.header_bnrArea2{
	position: static;
	float:none;
	width:auto;
	height: auto;
	margin: 25px 10px 5px;
	padding-bottom: 0;
	overflow: hidden;
}
.header_bnr2 ul li img.type_sp {
	display: block;
}
.header_bnr2 ul li img.type_pc {
	display: none;
}



/* banner carousel 2014-07 */
.header_bnrC2,
.header_bnrC2 ul li img.type_sp {
display: block;
}
.header_bnrAreaC,
.header_bnrC2 ul li img.type_pc {
display: none;
}
.header_bnrAreaC2{
position: static;
float:none;
width:auto;
height: auto;
margin: 25px 10px 5px;
padding-bottom: 0;
overflow: hidden;
}
.header_bnrC2 ul li {
margin: 0 0 15px 0;
}
.header_news_text {
margin-top:10px;
}




/*GnavSp
------------------------------------- */
#gnavSp {
display: block;
position: relative;
top:0;
width:300px;
margin:0 auto;
padding:10px 0 0;
background-color: #ffffff;
z-index:10;
}
    
.gnav_text {
margin-bottom: 10px;
text-align: left;
font-size: 70%;
}

.gnavSp_gender {
padding: 0 0 10px;
text-align: left;
}

.gnavSp_men {
margin-right: 17px;
padding-right: 17px;
border-right: 1px solid #e6e6e6;
}

.btnClose {
position: absolute;
bottom:10px;
right:0;
width: 26px;
height: 23px;
cursor: pointer;
text-indent: -99999px;
background: url(../images/btn_close.jpg) no-repeat;
}

.btnCloseOn {
background-position: 0 -24px;
}

.gnavSpLsit {
display: none;
position: absolute;
top: 68px;
left: 50%;
width: 320px;
height: 100%;
margin-left: -160px;
border-top: 1px solid #e6e6e6;
background-color: #ffffff;
z-index:30;
}



/*GnavSp fix
------------------------------------- */
.fix #gnavSp {
position: fixed;
overflow:hidden;
margin: 0 10px;
top:0;
left:50%;
margin-left:-150px;
border-bottom:1px solid #ccc;
}




/* -------------------------------------
Contents box list
------------------------------------- */
.contents_item_box{
width:226px;
margin:0 auto;
padding:22px 45px;
}

.contents_item_box ul li{
margin:12px auto 0;
}


/* contents_icon_box(and more)
------------------------------------- */
.contents_icon_box{
width:226px;
}


/* =====================================
2.Contents
------------------------------------- */
#Contents #ContentsInner #Main{
float:none;
width:auto;
margin:0;
}

#Contents #ContentsInner .Irohasu .MainInner,
#Contents #ContentsInner .MainInner{
width:auto;
margin:0;
padding:0 10px;
}

/* follow link
------------------------------------- */
div#Main ul.andFLnk li{
margin:0 10px 5px 0;
}

/* =====================================
3.article
------------------------------------- */
div.ArticleTitle,
div.ArticleTitle2{
padding: 25px 10px 35px;
}

div.ArticleTitle2 p.ImgHeading{
margin: 0 20px 10px 0;
}

#MainPhoto,
#MainPhoto iframe{
width:300px;
height:225px;
}

#MainPhoto2.typeB {
max-height: 225px;
}

#MainPhoto2.typeC {
height: 225px;
}

#MainPhoto2 img,
.MainPhoto2 img{
max-width: 300px;
max-height: 225px;
}

.MainPhotoArea.typeF .MainPhotoCaption {
width: 100%;
}

#mainpicNav ul{
text-align:left;
}

#FontSize{
display:none;
}

#FontSize li{
}

ul.BreadCrumb{
clear:both;
display:block;
float:none;
position:static;
width:100%;
margin:0 0 0 6px;
padding:0;
}


/* Utility
------------------------------------- */
div#Main div.Utility2 #utility_btns p.Mail,
div#Main div.Utility2 #utility_btns p.Evernote{
padding:3px 0 0 4px;
}

div#Main div.Utility2 #utility_btns div.GooglePlus{
margin:3px 0 0 7px;
}

div#Main div.Utility2 #utility_btns p.Facebook{
padding:3px 0 1px 4px;
}

/* 
------------------------------------- */
.subLnkArea{
}

.subLnkArea .owner{
float:none;
}

.subLnkArea .LogoMotor {
position: relative;
}
.subLnkArea .subLnkLogo {
position: relative;
}

/* ThmbSet333Tb
------------------------------------- */
.ThmbSet333Tb .ThmbColTb{
float:left;
width:300px;
margin:0 auto 10px;
}

.ThmbSet333Tb td#TbPhotMain{
width:300px;
height:auto;
}

.ThmbSet333Tb .ThmbColTb img{
height:auto;
max-width:300px;
max-height:500px;
}



/*-------------------------------------
 SUUMO
------------------------------------- */
.suumoSearchTop{
display:none;
}



/* -------------------------------------
photo gallery list
------------------------------------- */
#Contents #ContentsInner .ListBlockCol2 li{
float:none;
width:300px;
margin:0 0 10px 0;
}

#Contents #ContentsInner .ListBlockCol2 li.even{
margin:0 0 10px;
}

dl.h1Follow dt{
float:none;
margin:0 0 5px;
}

dl.h1Follow dd{
margin-left:0;
}

dl.h1Follow li{
}

dl.h1Follow li:first-child,
.gallery.galleryTop dl.h1Follow li:first-child{
border-left:none;
}

.gallery.galleryTop dl.h1Follow li.last-child{
padding: 0 0 0 10px;
}

.gallery.galleryTop #Contents{
width: 320px  !important;
max-width: 320px;
margin: 0 auto;
}

.gallery.galleryTop #Contents #ContentsInner .ListBlockCol2{
margin-left: 15px;
}

.gallery.galleryTop dl.h1Follow{
text-align: right;
}


.gallery.galleryTop dl.h1Follow dt{
float:none;
margin:0 0 5px;
width: auto;
}

/* -------------------------------------
thumbnail & text list (for tokyo dandy)
------------------------------------- */
.PhotoLst li{
width:48%;
}




/* -------------------------------------
pager (sequence navi)
------------------------------------- */
div#Main div.SeqNav p,
div#Main div.SeqNav ol{
display:inline-block;
}

div#Main div.SeqNav ol{
margin:0;
}
/* -------------------------------------
ArticlePagenationArea (2015.06)
------------------------------------- */
.ArticlePagenationArea .ArticlePagenation li{
display: block; 
margin: 0;
text-align: left;
}

.ArticlePagenationArea .ArticlePagenation li a{display: block;}
.ArticlePagenationArea .ArticlePagenation li.PagePrev{margin: 0 0 14px 0;}
.ArticlePagenationArea .ArticlePagenation li a span{line-height: 1.4;}
/* -------------------------------------
ippin
------------------------------------- */
#Main .IppinBox .subLnkArea .owner{
padding: 0 0 5px 0;
}

#Main .IppinBox  #Relevance .ThmbSetXw100{
width: auto;
margin: 20px 0 0;
}

/* =====================================
4.bijin
------------------------------------- */

/* bijin photo area
------------------------------------- */
.bijinBox{
padding:0;
}

.bijinPhoto .photo{
float:none;
padding: 0;
text-align:center;
}

.bijinPhoto .prev,
.bijinPhoto .next{
display:none;
}

.bijinInfo{
padding: 0;
}

.bijinPhoto .photo{
width:auto;
}

.bijinPhoto .photo img{
width: 300px;
height: 229px;
}

.bijinInfo .info,
.bijinInfo .goToday{
width:300px;
margin:0 0 5px;
}

.bijin .Box{
padding: 0;
}


/* 今日は何の日
------------------------------------- */
.bijin .today .BodyTxt p{
background:transparent none;
line-height:1.5;
}

/* 過去の出来事
------------------------------------- */
.bijin .memory{
padding:15px 0;
}


/* thumb and banner area
------------------------------------- */
.bijin .bijinThumb .FloatL,
.bijin .bijinThumb .FloatR{
float:none;
}

.bijin .bijinThumb .bijinBnr{
clear:both;
float:none;
margin:0 auto;
text-align:center;
}



/* =====================================
5.kinokuniya ranking
------------------------------------- */
.kinokuniya .rankingNav{
height:auto;
margin:0 0 10px;
border-bottom:none;
}

.kinokuniya .rankingNav li{
margin:0 10px 10px;
}

.kinokuniya .rankingNav li a{
border-bottom:1px solid #222;
}
.rankingUnit,
.rankingUnitlast {
padding: 7px;
}

.rankingUnit p.device,
.rankingUnitlast p.device{
display:block;
float:none;
margin:10px 0;
text-align:left !important;
}

.ruPhoto{
float:none;
width:auto;
margin:0 0 10px;
text-align:center;
}

.ruLay1{
float:none;
margin:0;
text-align:left;
}

.ruInfo{
float: none;
}

.ruTitle1{
width:auto;
}

.ruRank01,
.ruRank02,
.ruRank03,
.ruRank04,
.ruRank05,
.ruRank06,
.ruRank07,
.ruRank08,
.ruRank09,
.ruRank10{
background-position:7px 5px;
}

.kinokuniya .listphoto,
.kinokuniya .listrightbloc{
float:none;
}

.kinokuniya .listphoto{
margin:0 auto 10px;
}

.kinokuniya .listrightbloc{
width:auto;
margin:0;
}


/* =====================================
6.recomend
------------------------------------- */
div#Main div.BoxRecm div.ColSet{
margin:0;
}

div#Main div.BoxRecm div.ColSet div.Col13,
div#Main div.BoxRecm div.ColSet div.Col13Lst{
float:none;
width:auto !important;
margin:0 0 15px 0;
}



/* =====================================
7.collection
------------------------------------- */
.collection .GenreLogoBox img{
width:280px;
height:32px;
}

#CllHead div.FloatL{
float:none;
}

#CllHead p{
text-align:left;
}

#CllTopBox,
#CllRecBox{
padding: 20px 0;
}

#CllMainBox{
margin:0 0 25px;
}

#CllTopBox p.Image,
#CllMainBox p.Image,
#CllRecBox p.Image{
float:none;
margin:0 auto 10px;
text-align:center;
}

#CllTopBox p.Image img,
#CllRecBox p.Image img{
width:230px;
height:230px;
}

#CllMainBox li{
width:100%;
}

#CllTopBox dl,
#CllRecBox dl{
margin:0;
}

#CllTopBox dd.namae,
#CllMainBox dd.namae,
#CllRecBox dd.namae{
margin:0 0 5px;
font-size:90%;
}


/* =====================================
8.index(sitemap)
------------------------------------- */
body.index .ListBlock{
margin:0 0 35px;
}

#ContentsInner .ListBlock li{
width:100%;
padding:10px 0 0;
text-align:left;
}


/* =====================================
9.theater
------------------------------------- */
.movie .LeftBox,
.movie .RightBox{
float:none;
width:100%;
margin: 0 0 15px 0;
padding:0 10px;
}


#PickupMovie{
padding:22px 40px 15px;
}

#PickupMovie li{
width:100%;
margin:0 0 10px 0;
}

/* =====================================
10.clickdeep
------------------------------------- */
.clickdeep #ContentsInner .ListBlock li{
width:100%;
margin: 0 0 15px 0;
}



/* =====================================
11.pet
------------------------------------- */
/* pet zukan
------------------------------------- */
.petBox{
padding:0;
}

.petzukan .photoLstBox{
width:300px;
}

.petzukan .photoLstBox ul li{
height:82px;
}

.petzukan .photoLstBox img{
width:95px;
height:81px;
}


/* =====================================
12.video
------------------------------------- */
#MainPhotoArea #MainVideo object,
#MainPhotoArea #MainVideo iframe{
width:300px !important;
height:169px !important;
margin:0 auto 5px;
}
#MainPhotoArea #MainVideo{
width:300px;
padding: 0;
}
#MainPhotoArea #MainVideo img{
max-width:300px;
}
#MainPhotoArea #MainVideo .video-js {
width: 300px;
height: 169px;
}
#MainPhotoArea #MainVideo iframe {
width: 300px;
height: 169px;
}


/* =====================================
20.Sub
------------------------------------- */
#Contents #ContentsInner #Sub{
float:none;
width:auto;
margin:0;
}

#Contents #ContentsInner #Sub #SubInner{
width:auto;
margin:0;
padding:0 10px;
}



/* ad：注目情報
------------------------------------- */
#Contents #ContentsInner #Sub #SubInner .Section .Pr .ListBlock li{
float:none;
width:100%;
}


/* 
------------------------------------- */
#Sub #SubShopping,
#Sub #SubColumns {
display: none;
}

#Sub .andSubBox ul.LstPhoto01{
width:100%;
}

#Sub .andSubBox ul.LstPhoto01 li{
margin:2px
}

#Contents #ContentsInner #Sub #SubInner .Section .ListBlock li{
float:none;
width:100%;
}



/* SUUMO sub */
.suumoSearchRnavi{
display:block;

}



/* =====================================
51.写真付き広告
------------------------------------- */
.PrFrame .PrArea img{ float:none;  margin:0 auto 10px; padding:0; }


/* recommend
------------------------------------- */
.menu_andm ul li, .menu_andw ul li { display: block; width: 70%; margin: 20px auto 0; }
body #Contents #ContentsInner #R_reco3 .Section .ListBlockCol2 li {
border:0;
margin: 0;
padding: 0;
padding-top:10px;
width: 300px;
}
body #Contents #ContentsInner #R_reco3 .Section .ListBlockCol2 li.Fst {
border:0;
border-bottom: 1px solid #E6E6DF;
margin: 0;
padding: 0 0 10px;
width: 300px;
}

/* =====================================
本文内動画
------------------------------------- */
.InArticleMovieArea .InArticleMovie object,
.InArticleMovieArea .InArticleMovie iframe {
width: 300px !important;
height: 169px !important;
}
.InArticleMovieArea .InArticleMovie img {
max-width:300px;
}
.InArticleMovieArea .InArticleMovie .video-js {
width: 300px;
height: 169px;
}


/* =====================================
30.footer
------------------------------------- */
#Footer #FooterInner{
text-align: left;
}

#Footer #ToTop #ToTopInner{
padding:0;
}

#Footer .AboutSite{
padding:5px 10px 0;
}
#Footer .AboutSite ul li{
white-space:nowrap;
}

#Footer .AboutSite .Copyright{
}

#Footer .AboutSite .Copyright p{
padding:0 5px 8px;
line-height:1.25;
}

/* andbox
------------------------------------- */
.menu_andm,
.menu_andw {
display: none;
}

}