@charset "UTF-8";
/* CSS Document */


/*======================================
base
========================================*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: bottom;
    background: transparent;
}

*{
	margin: 0;
	padding: 0;
}


/*======================================
body
========================================*/
body{
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-family: 'YuGothic', 'Yu Gothic medium', 'Hiragino Sans', 'Meiryo', 'sans-serif';
	color: #666;
}


.clearfix::after{
		content: "";
		display: block;
		clear: both;
	}

a{
	color:#666;
	text-decoration: none;
}
a:hover{
	color: #2e6449;
	opacity: 0.7;
	transition: 0.3s all ease-out 0.1s;
	-webkit-transition: 0.3s all ease-out 0.1s;
	-moz-transition: 0.3s all ease-out 0.1s;
}
img{
	vertical-align: bottom;
}


/*======================================
rakuten_wrap
========================================*/
.rakuten_wrap {
	width: 950px;
	margin: 0 auto;
	padding: 0;
}


/*======================================
header
========================================*/
.top_img {
	width: 950px;
	height: 456px;
	background-color: #4D3E15;
}


/*======================================
nav
========================================*/
.nav {
	width: 950px;
	height: 104px;
	border-bottom: solid 1px #dcdcdc;
	position: relative;
}

.nav_logo {
	position: absolute;
	top: 25px;
	left: 0;
}

.nav_list {
	display: flex;
	width: 566px;
	height: 62px;
	position: absolute;
	top: 25px;
	right: 0;
}


/*======================================
footer
========================================*/
.footer {
	/*padding-top: 136px;*/
	width: 950px;
	height: 523px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/footer_bg.jpg) no-repeat center bottom/ 950px auto;
	position: relative;
}

.group {
	width: 950px;
	position: absolute;
	bottom: 140px;
}

.hotels {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 auto;
	width: 670px;
}

.h_item1 {
	margin-bottom: 25px;
}

.fnav {
	width: 950px;
	height: 95px;
	position: relative;
	position: absolute;
	bottom: 0;
}

.footer_logo {
	position: absolute;
	top: 16px;
	left: 0;
}

.fnav_list {
	display: flex;
	width: 487px;
	height: 64px;
	position: absolute;
	top: 16px;
	right: 16px;
}


/*======================================
LINK
========================================*/
.link_box {
	width: 950px;
	position: relative;
}

.link_btn {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 950px;
	position: absolute;	
	bottom: 0;
}

/*======================================
TOP
========================================*/
.mbtn {
	position: absolute;
}

/* CONCEPT
------------------------- */
#t_01 {
	width: 950px;
	height: 1440px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/t_01.jpg) no-repeat center top/ 950px auto;
}

/* EXPERIENCE
------------------------- */
#t_02 {
	width: 950px;
	height: 1309px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/t_02bg.jpg) no-repeat center top/ 950px auto;
	position: relative; 
}

.exbox {
	position: absolute;
	top: 277px;
	left: 0;
}

.ex01, .ex02 {
	position: relative;
}

.ex01 {
	margin-bottom: 90px;
}

.ex01 .mbtn {
	right: 32px;
	bottom: 80px;
}

.ex02 .mbtn {
	left: 159px;
	bottom: 37px;
}

/* ACCESS
------------------------- */
#t_03 {
	width: 950px;
	height: 1538px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/t_03.jpg) no-repeat center top/ 950px auto;
}

/* ACTIVITY
------------------------- */
#t_04 {
	width: 950px;
	height: 855px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/t_04_2.jpg) no-repeat center top/ 950px auto;
	position: relative; 
}

#t_04 .mbtn {
	right: 0;
	bottom: 82px;
}


/*======================================
ROOMS
========================================*/
#r_01 {
	width: 950px;
	height: 1448px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_01_2.jpg) no-repeat center top/ 950px auto;
}

.r_lbtn {
	height: 855px;
}

.r_lbtn .link_btn a:nth-of-type(1), .r_lbtn .link_btn a:nth-of-type(2) {
	margin-bottom: 61px;
}

.r_fotter {
	height: 546px;
}

/* roomsリスト
------------------------- */
#r_02 {
	width: 950px;
	height: 754px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_02bg.jpg) no-repeat center top/ 950px auto;
	position: relative;
}

.room_list {
	display: flex;
	justify-content: space-between;
	width: 950px;
	position: absolute;
	left: 0;
	bottom: 0;
}

.layout_box {
	height: 424px;
	overflow-y: hidden;
	overflow-x: scroll;
	position: absolute;
	bottom: 0;
}

.layout_box::-webkit-scrollbar {
  height: 6px;
}

.layout_box::-webkit-scrollbar-track {
  background-color: #fff;
}

.layout_box::-webkit-scrollbar-thumb {
  background-color: #fff;
}

/* FAMILY
------------------------- */

/* 01.スーペリア和モダン */
#r_f01 {
	width: 950px;
	height: 1394px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_f01_2.jpg) no-repeat center top/ 950px auto;
}

/* 02.デラックス4バンク */
#r_f02 {
	width: 950px;
	height: 1217px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_f02_2.jpg) no-repeat center top/ 950px auto;
}

/* 03.デラックス2ベッド&2バンク */
#r_f03 {
	width: 950px;
	height: 1237px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_f03_2.jpg) no-repeat center top/ 950px auto;
}

/* 04.デラックス洋室 */
#r_f04 {
	width: 950px;
	height: 1237px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_f04_2.jpg) no-repeat center top/ 950px auto;
	position: relative;
}

#r_f04 .layout_box {
	width: 410px;
	right: 0;
}

/* 05.デラックス和モダン */
#r_f05 {
	width: 950px;
	height: 1238px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_f05_2.jpg) no-repeat center top/ 950px auto;
	position: relative;
}

/* 06.アクセシブル デラックス */
/*#r_f06 {
	width: 950px;
	height: 1248px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_f06.jpg) no-repeat center top/ 950px auto;
	position: relative;
}*/

/* TRIPLE
------------------------- */

/* 01.スーペリア */
#r_t01 {
	width: 950px;
	height: 1382px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_t01_2.jpg) no-repeat center top/ 950px auto;
	position: relative;
}

#r_t01 .layout_box {
	width: 442px;
	left: 0;
}

/* 02.スーペリア テラス */
#r_t02 {
	width: 950px;
	height: 1237px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_t02_2.jpg) no-repeat center top/ 950px auto;
}

/* SAUNA
------------------------- */

/* 01.デラックス サウナルーム */
#r_s01 {
	width: 950px;
	height: 1382px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_s01_2.jpg) no-repeat center top/ 950px auto;
}

/* 設備・アメニティ等
------------------------- */
#r_03 {
	width: 950px;
	height: 1566px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_03_3.jpg) no-repeat center top/ 950px auto;
}

#r_04 {
	width: 950px;
	height: 1650px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/r_04.jpg) no-repeat center top/ 950px auto;
}

/*======================================
FACILITIES
========================================*/
#f_01 {
	width: 950px;
	height: 1449px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/f_01_2.jpg) no-repeat center top/ 950px auto;
}

#f_02 {
	width: 950px;
	height: 1044px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/f_02_3.jpg) no-repeat center top/ 950px auto;
}

.f_lbtn {
	height: 443px;
}

.f_fotter {
	height: 502px;
}

/*======================================
ITINERARY
========================================*/
#i_01 {
	width: 950px;
	height: 1950px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/i_01.jpg) no-repeat center top/ 950px auto;
}

#i_02 {
	width: 950px;
	height: 1895px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/i_02.jpg) no-repeat center top/ 950px auto;
}

.i_lbtn {
	height: 446px;
}

.i_fotter {
	height: 507px;
}

/*======================================
ACCESS
========================================*/
#a_01 {
	width: 950px;
	height: 229px;
	position: relative;
}

.acc_btn {
	position: absolute;
	left: 255px;
	top: 79px;
}

#a_02 {
	width: 950px;
	height: 2227px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/a_02.jpg) no-repeat center top/ 950px auto;
}

#a_03 {
	width: 950px;
	height: 1462px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/a_03.jpg) no-repeat center top/ 950px auto;
}

#a_04 {
	width: 950px;
	height: 1786px;
	background: url(https://thinkgarbage.sakura.ne.jp/tomarotto/and_here/shinjuku/img/a_04.jpg) no-repeat center top/ 950px auto;
}

.a_lbtn {
	height: 530px;
}

.a_fotter {
	height: 503px;
}