@charset "UTF-8";

html{
	height: 100%;
}

body{
	color: #555555;
	background-color: #201816;
	text-align: center;
	height: 100%;
	/*font-family: 'Hiragino Kaku Gothic Pro',Meiryo,'MS Gothic',sans-serif;*/
	/*font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ ゴシック','MS Gothic',sans-serif;*/
	/*font-family:"ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;*/
	font-family:"Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","arial",sans-serif;
	letter-spacing: 0.04em;
	-webkit-text-size-adjust: none;
	font-weight: normal;
}
body.top_page{
	background-color: #201816;
}
body.sub_page{
	background-color: #201816;
}
body.inner_page{
	background-color: #f0ece2;
}
body.modal_page{
	background-color: #f0ece2;
}

div#cx_spContentsMain{
	background-color: #201816;
}

ul, li{
	list-style-type: none;
}

*{
	margin:0px;
	padding:0px;
}

img{
	border:0px;
}

table{
	border-collapse: collapse;
}
table th,
table td {
	vertical-align: top;
	text-align: left;
}
table th {
	white-space: nowrap;
	padding-right: 10px;
}


a{
	color: #009040;
	text-decoration: none;
}
a:hover{
	color: #009040;
	text-decoration: underline;
}

.common_color{
	color: #009040 !important;
}
.common_bg{
	background-color: #f0ece2;
}
/*TOP--------------------------------------------------------------------------------*/
div#top_title{
	position: relative;
	width: 600px;
	/*height: 470px;*/
	border: solid 10px #f0ece2;
	background: #f0ece2;
	margin: 10px 10px 0px 10px;
	text-align: left;
}

div#top_title2{
	position: relative;
	width: 620px;
	/*height: 470px;*/
	background: #f0ece2;
	margin: 10px 10px 0px 10px;
	text-align: left;
}


#box_area{
	padding: 10px;
	position: relative;
	width: 620px;
	height: 830px;
	text-align: left;
	z-index: 1;
}

div.rover{
	cursor: pointer;
}
div.current{
	cursor: auto !important;
}

div.box_photo{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center top;
}

div.box_overlay{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: url("/terrace-house/common/img/overlay.png");
	display: none;
}

div.box_title{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
}
div.box_date{
	position: absolute;
	width: 100%;
	text-align: center;
	top: 100px;
	left: 0;
	color: #ffffff;
}

div.box_contents{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #f0ece2;
	/*display: none;*/
	top: 1000px;/*なぜか、mCustomScrollbarがつかないので・・・・*/
}
div#box0000{
	margin: 10px 10px 0 10px;
	position: relative;
	border: solid 10px #f0ece2;
	background: #f0ece2;
	width: 600px;
	height: 110px;
	overflow: hidden;
}

div#box000{
	margin: 10px 10px 0 10px;
	position: relative;
	border: solid 10px #f0ece2;
	background: #f0ece2;
	width: 600px;
	height: 110px;
	overflow: hidden;
}

div#box00,
div#box0{
	margin: 10px 10px 0 10px;
	position: relative;
	border: solid 10px #f0ece2;
	background: #f0ece2;
	width: 600px;
	height: 180px;
	overflow: hidden;
}

div#box1,
div#box2,
div#box3,
div#box4,
div#box5,
div#box6,
div#box7,
div#box8{
	position: absolute;
	border: solid 10px #f0ece2;
	background: #f0ece2;
	overflow: hidden;
}

div#box1{
	left: 10px;
	top: 10px;
	width: 390px;
	height: 180px;
}
div#box2{
	left: 430px;
	top: 10px;
	width: 180px;
	height: 180px;
}
div#box3{
	left: 10px;
	top: 220px;
	width: 180px;
	height: 180px;
}
div#box4{
	left: 220px;
	top: 220px;
	width: 390px;
	height: 180px;
}
div#box5{
	left: 10px;
	top: 430px;
	width: 390px;
	height: 180px;
}
div#box6{
	left: 430px;
	top: 430px;
	width: 180px;
	height: 180px;
}
div#box7{
	left: 10px;
	top: 640px;
	width: 180px;
	height: 180px;
}
div#box8{
	left: 220px;
	top: 640px;
	width: 390px;
	height: 180px;
}
/*INFO-----------------------------------------------------------------------------*/
div#info_box{
	margin: 10px 10px 0 10px;
	border: solid 10px #f0ece2;
	background: #f0ece2;
	text-align: left;
}
div#info_area{
	width: 600px;
	text-align: left;
	padding: 0;
	overflow: auto;
	/*ここからはスマホでは上書き*/
	max-height: 150px;
	font-size: 12px;
	line-height: 20px;
	text-align: left;
}

div.info_scroll{
	padding: 5px;
	/*ここからはスマホでは上書き*/
	/*max-height: 120px;*/
}

ul.info_list{
	color: #009040;
}
ul.info_list li{
	list-style-type: square;
	/*ここからはスマホでは上書き*/
	margin-left: 20px;
	margin-bottom: 5px;
}
ul.info_list li span{
	color: #555555;
}

/*IN THE CITY*/
div.my_box{
	margin: 10px 10px 0 10px;
	border: solid 10px #f0ece2;
	background: #f0ece2;
	text-align: left;
}

/*テーブル*/
table.table2{
}
table.table2 > tbody > tr > th,
table.table2 > tbody > tr > td{
	padding:5px 10px;
	border-top: solid 1px #99ccaa;
	border-bottom: solid 1px #99ccaa;
}
table.table2 > tbody > tr > th{
}

.ib{
	display: inline-block;
}


/*inner共通-----------------------------------------------------------------------------*/
div.inner_box{
	width: 390px;
}
div.inner_box2{
	width: 390px;
	height: 390px;
	position: relative;
}

div.inner_title{
	height: 48px;
}

div.inner_head,
div.inner_head2{
	position: absolute;
	left: 0;
	top: 0;
	width: 370px;
	padding: 0 10px;
	height: 30px;
	color: #ffffff;
	text-align: center;
	background-image: url("/terrace-house/common/img/overlay.png");
}
div.inner_head2{
	text-align: left;
}

div.prev_btn{
	position: absolute;
	left: 0;
	/*ここからはスマホでは上書き*/
	top: 0;
	width: 26px;
	height: 26px;
}
div.next_btn{
	position: absolute;
	right: 0;
	/*ここからはスマホでは上書き*/
	top: 0;
	width: 26px;
	height: 26px;
}
div.bn_btn{
	position: absolute;
	right: 0;
	top: 0;
	width: 94px;
	height: 30px;
}

div.bn_scroll{
	width: 390px;
	height: 342px;
	text-align: left;
	overflow: auto;
}
div.bn_scroll ul li{
	width: 360px;
	padding: 5px;
	border:none;
	border-top:dotted 1px #cccccc;
	color: #666666;
}

div.bn_scroll ul li:hover{
	/*color: #009040;*/
	color: #ffffff;
	background-color: #009040;
}
div.bn_num{
	width: 55px;
	float: left;
}
div.bn_title{
	width: 294px;
	float: left;
}

div.photo_title{
	margin-top: 5px;
	margin-left: 10px;
	color: #009040;
}
div.photo_title2{
	margin-left: 10px;
	color: #009040;
}
div.photo_caption{
	margin-top: 5px;
	margin-left: 10px;
}
div.photo_caption2{
	margin-left: 10px;
}

/*NEXT--------------------------------------------------------------------------------*/
div.next_photo{
	position: relative;
	width: 390px;
	height: 180px;
}
div.next_title{
	width: 390px;
	height: 50px;
}
div.next_date{
	width: 390px;
	height: 28px;
	text-align: center;
}
div.next_scroll{
	padding-left: 10px;
	width: 380px;
	height: 132px;
	text-align: left;
	overflow: auto;
}
/*HOUSE---------------------------------------------------------------------------*/
div#house_area{
	width: 390px;
	height: 390px;
	position: relative;
	background-image: url("/terrace-house/02house/img/house.jpg");
	background-repeat: no-repeat;
	background-position: left top;
	overflow: hidden;
}
div#house_area2{
	width: 390px;
	height: 390px;
	position: relative;
	background-image: url("/terrace-house/02house/img/house.gif");
	background-repeat: no-repeat;
	background-position: left top;
	overflow: hidden;
}
div.house_pos{
	position: absolute;
	cursor: pointer;
}
div.house_photo{
	position: absolute;
	display: none;
}


/*CAR--------------------------------------------------------------------------------*/
div.car_scroll{
	width: 390px;
	height: 342px;
	text-align: left;
	overflow: auto;
}

div.car_photo{
	width: 370px;
	height: 208px;
	background-color: #e6e0d2;
	background-image: url("/terrace-house/common/img/loading.gif");
	background-repeat: no-repeat;
	background-position: center center;
}

/*STORY--------------------------------------------------------------------------------*/
div.story_photo{
	position: relative;
	width: 390px;
	height: 180px;
	background-color: #e6e0d2;
	background-image: url("/terrace-house/common/img/loading.gif");
	background-repeat: no-repeat;
	background-position: center center;
}
div.story_title{
	position: relative;
	width: 390px;
	height: 26px;
	margin: 10px 0px 20px 0px; 
	text-align: center;
}
div.story_scroll{
	padding-left: 10px;
	width: 380px;
	height: 154px;
	text-align: left;
	overflow: auto;
}

/*MEMBER--------------------------------------------------------------------------------*/
div.member_title{
	height: 60px;
}
div.member_scroll{
	width: 390px;
	height: 330px;
	text-align: left;
	overflow: auto;
}
ul.boys_list,
ul.girls_list{
	float: left;
	width: 185px;
}
ul.boys_list li,
ul.girls_list li{
	position: relative;
	height: 82px;
}
div.list_photo{
	padding: 5px;
}
div.list_over{
	position: absolute;
	left: 0;
	top: 0;
	width: 185px;
	height: 82px;
}
/*---------*/
div.member_head{
	position: relative;
	left: 0;
	top: 0;
	width: 370px;
	height: 30px;
	padding: 0 10px;
	color: #ffffff;
	text-align: left;
	margin-bottom: 18px;
	background-color: #009040;
}
div.member_scroll2{
	width: 390px;
	height: 342px;
	text-align: left;
	overflow: auto;
}
div.member_photo{
	width: 370px;
	height: 250px;
	margin-bottom: 10px;
	background-color: #e6e0d2;
	background-image: url("/terrace-house/common/img/loading.gif");
	background-repeat: no-repeat;
	background-position: center center;
}
ul.profile_list li{
	margin-bottom: 5px;
}
div.profile_item{
	width: 140px;
	float: left;
	margin-left: 10px;
	font-weight: bold;
	background-image: url("/terrace-house/common/img/dot.gif");
	background-repeat: repeat-x;
	background-position: center center;
}
div.profile_item div{
	display: inline-block;
	background-color: #f0ece2;
	padding-right: 10px;
}
div.profile_text{
	width: 209px;
	padding-left: 10px;
	float: left;
}


/*MUSIC--------------------------------------------------------------------------------*/
div.music_head{
	position: relative;
	left: 0;
	top: 0;
	width: 390px;
	height: 30px;
	color: #ffffff;
	text-align: center;
	background-image: url("/terrace-house/06music/img/head.jpg");
}
div.music_title{
	position: relative;
	width: 390px;
	height: 26px;
	margin: 10px 0px 20px 0px; 
	text-align: center;
}
div.music_scroll{
	padding-left: 10px;
	width: 380px;
	height: 304px;
	text-align: left;
	overflow: auto;
}
ul.music_list li.music_list_item{
	margin-bottom: 20px;
}

/*PLACE--------------------------------------------------------------------------------*/
div.place_head{
	position: relative;
	left: 0;
	top: 0;
	width: 390px;
	height: 30px;
	color: #ffffff;
	text-align: center;
	background-image: url("/terrace-house/07place/img/head.jpg");
}
div.place_title{
	position: relative;
	width: 390px;
	height: 26px;
	margin: 10px 0px 20px 0px; 
	text-align: center;
}
div.place_scroll{
	width: 390px;
	height: 304px;
	text-align: left;
	overflow: auto;
}
div.place_photo{
	width: 370px;
	height: 208px;
	background-color: #e6e0d2;
	background-image: url("/terrace-house/common/img/loading.gif");
	background-repeat: no-repeat;
	background-position: center center;
}
/*LOVE-----------------------------------*/
div#love_list_area{
	position: absolute;
	left: 0;
	top: 0;
	width: 390px;
	height: 162px;
	/*overflow: hidden;*/
}
div#goiken_area{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 390px;
}
/*動画リスト*/
ul#love_list{
}
ul#love_list li{
	float: left;
	position: relative;
	margin: 9px;
}
div.love_photo{
	width: 112px;
	height: 63px;
	background-color: #e6e0d2;
	background-image: url("/terrace-house/common/img/loading.gif");
	background-repeat: no-repeat;
	background-position: center center;
}
div.love_over{
	position: absolute;
	left: 0;
	top: 0;
	width: 112px;
	height: 63px;
}

div.love_cap{
	display: none;
	position: absolute;
	z-index: 10;
	left: -9px;
	top: 68px;
	text-align: center;
	width: 130px;
}
div.love_cap2{
	display: inline-block;
	background: #009040;
	padding: 2px 3px;
	max-width: 124px;
	text-align: center;
	color: #ffffff;
}


/*ご意見*/
div#goiken_waku{
	padding: 5px;
	width: 378px;
	/*height: 168px;*/
	height: 356px;
	text-align: left;
	overflow: auto;
	border: solid 1px #009040;
}
div#goiken_frame{
}
div#goiken_title{
	text-align: left;
	/*ここからはスマホでは上書き*/
	height: 22px;	
}

div#mes_body{
	text-align: left;
	width: 378px;
	height: 356px;
	overflow: hidden;
}
div.mes{
	margin-bottom:20px;
}
div.mes_tit{
}
div.mes_data{
	color: #999999;
	margin-bottom: 5px;
}
div.mes_txt{
}
div#mes_navi{
	text-align: right;
}

/*MODAL------------------------------*/
div.modal_box{
	overflow: auto;
	width: 100%;
	/*ここからはスマホでは上書き*/
	height: 100%;
}
div.modal_foot{
	border:none;
	border-top:solid 1px #cccccc;
	margin-top: 20px;;
	/*ここからはスマホでは上書き*/
	height: 40px;
}

/*fujiplayer用*/
div#fujiplayer_target{
	margin: 0;
	padding: 0;
	background: #000000;
	background-image: url("/terrace-house/common/img/loading2.gif");
	background-repeat: no-repeat;
	background-position: center center;
	/*ここからはスマホでは上書き*/
	width: 640px;
	height: 360px;
}
div.fujiplayer_foot{
	margin-top: 20px;;
	height: 40px;
}


/*フッタ--------------------------------------------------------------------------------*/
#footer_area{
}

#footer{
	width: 620px;
	padding: 10px;
	text-align: left;
	color: #999988;
}

#footer a:link,
#footer a:visited,
#footer a:active{
	color: #009040;
	text-decoration: none;
}
#footer a:hover{
	text-decoration:underline;
}

#footer_btn{
}

#footer_read{
	margin-top: 10px;
}

a.to_top_btn{
	float: right;
}

ul#footer_list{
}
ul#footer_list li{
	float: left;
	margin-bottom: 10px;
}
ul#footer_list li.partition{
	font-size: 1px;
	width: 1px;
	background: #333333;
	margin: 0px 10px;
}

/*スライドショー-------------------------------------------------------------------------------*/
div.slideshow {
	position:relative;
}
div.slideshow img{
	position:absolute;
	top:0;
	left:0;
	z-index:8;
	-ms-filter: "alpha( opacity=0 )";
	filter: alpha( opacity=0 );
	-moz-opacity: 0; 
	opacity: 0;
}
div.slideshow img.active {
	z-index:10;
	-ms-filter: "alpha( opacity=100 )";
	filter: alpha( opacity=100 );
	-moz-opacity: 1; 
	opacity: 1;
}
div.slideshow img.next{
	z-index:9;
	-ms-filter: "alpha( opacity=100 )";
	filter: alpha( opacity=100 );
	-moz-opacity: 1; 
	opacity: 1;
}



/*汎用-------------------------------------------------------------------------------*/
.boxlink{
	cursor: pointer;
}

div.color_overlay{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: url("/terrace-house/common/img/overlay.png");
}

div#page_top{
	font-size: 0;
	line-height: 0;
	height: 0;
}

div.clear_float{
	visibility: hidden;
	height: 0;
	font-size: 0;
	line-height: 0;
	clear: both;
}

.dotline{
	border:none;
	border-top:dotted 1px #cccccc;
	height:1px;
	padding: 0;
	margin: 0;
	font-size: 0px;
	line-height: 0px;
}
.dotline2{
	border:none;
	border-top:dotted 1px #cccccc;
	height:1px;
	padding: 0;
	margin: 20px 0;
	font-size: 0px;
	line-height: 0px;
}

.line{
	border:none;
	border-top:solid 1px #cccccc;
	height:1px;
	padding: 0;
	margin: 0;
	font-size: 0px;
	line-height: 0px;
}
.line2{
	border:none;
	border-top:solid 1px #cccccc;
	height:1px;
	padding: 0;
	margin: 20px 0;
	font-size: 0px;
	line-height: 0px;
}

.cmnt{
	display: none;
}

ul.float_txt{
	zoom: 1;
}
ul.float_txt:after{
	height:0;
	visibility:hidden;
	content:".";
	display:block;
	clear:both;
}
ul.float_txt li{
	white-space: nowrap;
	float: left;
	vertical-align: bottom;
}


/*スペーサ*/
div.space2{ height: 2px; font-size: 0; line-height: 0;}
div.space5{ height: 5px; font-size: 0; line-height: 0;}
div.space10{ height: 10px; font-size: 0; line-height: 0;}
div.space20{ height: 20px; font-size: 0; line-height: 0;}
div.space30{ height: 30px; font-size: 0; line-height: 0;}

/*左スペース*/
.l_s10{ padding-left: 10px;}
.l_s20{ padding-left: 20px;}
.l_s30{ padding-left: 30px;}

/*右スペース*/
.r_s10{ padding-right: 10px;}
.r_s20{ padding-right: 20px;}
.r_s30{ padding-right: 30px;}

/*上スペース*/
.mrg5{ margin-top:5px;}
.mrg8{ margin-top:8px;}
.mrg10{ margin-top:10px;}
.mrg20{ margin-top:20px;}
.mrg30{ margin-top:30px;}


/*文字**********************************/
.right{
	text-align: right;
}
.bold{
	font-weight: bold;
}
strong{
	font-weight: bold;
	color: #dd3333;
}
/*見出し*/
h1{
	width: 0;
	height: 0;
	text-indent: -9999px;
	height: 0;
	font-size: 0;
	line-height: 0;
}