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

.sp-dsp{ display: none;}
.pc-dsp{ display: inherit;}
.gray-wall{ background: #efefef;}

body.post section h2{letter-spacing:1px;}

/*==================
Rental Studio top
==================*/
.rental-wrap{padding:4em 0 3em;}
.rental-wrap h2{font-size:30px;}
.rental-lead{ padding: 1em 0 1em;width: 100%;text-align: justify;}
.fnt-pnk{margin:1em auto 0;color:#ff3371;display:block;border:3px solid;padding:.5em;font-weight:bold;text-align: center;}
.fnt-pnk i{padding-right:.5em;}
.studio-map{ padding: 0 0;position:relative;display: flex; flex-wrap: wrap; justify-content: space-between;align-items: center;}
.studio-map div{width:52%;}
.studio-map div.map-area{width:45%}
.studio-map div img{width:100%; height: auto;}
.map-area{width: 42%;font-size:1vw;}
.map-area span{ color: #000; border-right: solid 1px #000; padding: 0 .5em; display: inline-block; line-height: 1;}
.map-area a > span{ color: #ff3371;}
.map-area a:nth-child(1) spa,.map-area span:nth-child(1){ padding-left: 0;}
.map-area p.area-ttl{ font-weight: bold;}
.map-area p.area-name{ padding-bottom: 1em;}

.rental-latest{margin-bottom:1em;}
.stage-span{padding-bottom:0em;line-height:1.1;}

/*==================
Rental Studio page
==================*/
.room-top{background:#efefef;padding:5em 0 4em;}
.room-top .wrap{background:#fff;padding:3.5em 3em 4em;}
.room-top .room-wrap{ display: flex; justify-content: space-between;padding-top:3em;}
.room-top .room-left{ width: 46%; padding: .5em 0 0;}
.room-top .room-right{ width: 46%; padding: 0 0;}

.room-top h1{font-size: 28px; text-align:left;font-weight: 700;line-height:1.4;width:100%;border-bottom:1px dotted #ccc;padding:0 .25em .25em;position:relative;}
.room-top h1 span{text-transform: uppercase;font-family:'Barlow Semi Condensed', sans-serif;font-weight: 300;font-size:24px;position:absolute;right:.25em;top: 50%; transform: translate(-0%,-50%);letter-spacing:.05px;color:#aaa;}
.room-top h1 p.event-day{position:absolute;right:.25em;top: -.3em;}
.room-top h1 p.event-day span{position:static;font-weight: 600;font-size:18px;padding-left:.5em;color:#000;}
.room-top h1.audition-h1 p.event-day,.room-top h1.audition-h1 p.event-day span{color:#ff3371;}

.room-left .shop_image{ background: none; margin: 0 auto 2em !important; width: 100%;}
.room-left .slide-room img{ width: 100%!important; margin:0;}
.room-left .shop_image dl{ width: 100%; padding: 0; margin: 0px 0 40px;}
.room-left .shop_image dd{ padding:0 0; position:relative;}
.room-left .shop_image .slick-next{ right: 10px; color: #fff !important; z-index: 1;}
.room-left .shop_image .slick-prev{ left: 10px; color: #fff  !important; z-index: 1;}
.room-left .shop_image ul.slick-dots{ width: 100px;bottom: 1.5em;}
.room-left ul.slick-dots{ position: absolute; display: flex; bottom: 1.5em; left:50%; transform: translate(-50%,0);justify-content: space-around; align-items: center; align-content: center; width: 20vw;}
.room-left ul.slick-dots li button{ position: relative; border: none; padding: 0;width: 12px; height: 12px; background: none;}
.room-left ul.slick-dots li button::before{ content: ""; position: absolute; top: 0; left: 0; background: #555; width: 12px; height: 12px; border-radius: 50%;}
.room-left ul.slick-dots li.slick-active button::before{ background: #fff;}


.room-top .shop-txt{padding: 0;}
.room-top .shop-txt p{ padding: 0; font-size: 16px; line-height: 1.8;}

.room-right h2{ text-align: left; font-size: 28px; font-weight:500;letter-spacing:0;margin-bottom:1em;}
.room-right h2 span{ display: inline-block; padding-left: 1em;}

.studio-eq {margin: 0 0;}
.studio-eq table {font-size: 14px; line-height:1.6;border-top: 1px solid #bbb; border-left: 1px solid #bbb; margin-bottom:4em; word-wrap: break-word; width:100%;}
.studio-eq table th {padding:15px;width:33%;border-right:1px solid #bbb; border-bottom:1px solid #bbb;font-weight:bold;vertical-align:middle;}
.studio-eq table td {padding:15px;border-right:1px solid #bbb;border-bottom:1px solid #bbb!important;vertical-align:middle;}


.room-right ul{margin-bottom:4em;}
.room-right ul:last-child{margin-bottom:0;}
.room-right li{margin-bottom:1em;position:relative;padding-left:2.5em;font-size:16px;}
.room-right li:before{position:absolute;left:0;font-size:18px;top: 50%; transform: translate(-0%,-50%);font-family: fontAwesome;}
.room-right li.station:before{content: "\f238";}
.room-right li.add:before{content: "\f041";left:.1em;}
.room-right li.tel{font-size:32px;padding-left:1.4em;font-family:'Barlow Semi Condensed', sans-serif;font-weight: 500;margin-bottom:.5em;color: #3cafad;}
.room-right li.tel:before{content: "\f10b";left:.1em;font-size:28px;color:#000;}
.room-right li.mail{font-size:22px;font-family:'Barlow Semi Condensed', sans-serif;font-weight: 400;padding-left:2em;}
.room-right li.mail:before{content: "\f003";}
.room-right li.web{font-size:22px;font-family:'Barlow Semi Condensed', sans-serif;font-weight: 400;padding-left:2em;}
.room-right li.web:before{content: "\f108";}
.room-right li a{color: #3fc2c0;}
.room-right li a:hover{color: #217c7b;}

.under section.studio  {padding: 0 0 3em;}
.under section.studio h2.small{letter-spacing:1px;}


/*==================
Event
==================*/

.event-info{ padding: 0 0 .25em; margin: 0 0 1em; display: flex; justify-content: space-between; align-items: center;border-bottom:1px dotted #ccc;}
p.event-day{font-weight: 600;font-family:'Barlow Semi Condensed', sans-serif;font-size:40px!important;line-height:1!important;}
p.event-day span{font-size:18px!important;padding-left:.5em;}
p.event-place{font-size: 12px;line-height:1.4;padding-top:5px;}
p.event-place span{display: block; text-align: right;font-weight:bold;font-size: 14px;}

/*PAST EVENT*/
.event-past{padding:0;}
.event-past h2{margin-bottom:1em;}
.event-past p{width: 100%; display: flex; flex-wrap: wrap; justify-content: start; margin:1em 0 0;font-weight:bold;padding:0;}
.event-past p span{display:block;}
.event-past a{width:6.6%;text-align:center;padding:0;font-weight:normal;}

.room-right p.event-tag{width:100%;padding:0;margin-top:.5em;}
.room-right p.event-tag span{display:inline-block;background: #000; color: #fff; font-size:14px; padding: .25em .75em;font-weight: 400;font-family:'Barlow Semi Condensed', sans-serif;}
.room-right p.event-tag span + span{ margin-left: .5em;}
.room-right .event-info{ padding: 0 0 .25em; margin: 0em 0 2em; display: flex; justify-content: space-between; align-items: center;border-bottom:none;}

.room-top h1{padding-right:20%;}
.room-top .event-txt{padding: 0;word-break: break-all;}
.room-top .event-txt div{background-color:#fff!important;width:100%;}
.room-top .event-txt p{ padding: 0; font-size: 15px; line-height: 1.8!important;color:#000;}
.room-top .event-txt b,.room-top .event-txt strong{font-weight:bold;}
.room-top .event-txt span{color:#000!important;}
.room-top .event-txt a{font-size: 16px;color:#ff3371 !important;text-align:center;}
.room-top .event-txt iframe{width:100%;}

@media screen and (max-width: 1199px){
.studio-map {padding:0 0;}
}

@media screen and (min-width: 897px){
body.post{background:#efefef;}
#content-under{padding-top:6%;}
body.contents .room-top h2{text-align:left;margin-bottom: .75em;}
body.contents .room-top h2 span{display:inline;padding-left:.5em;}	
.under section.studio h2.small{font-size:1.2vw;}
}

@media screen and (max-width: 768px){
.sp-dsp{ display: inherit;}
.pc-dsp{ display: none;}	
	
/*==================
Rental Studio
==================*/
.rental-wrap{padding:3em 2em 2em;}
.rental-wrap h2{font-size:4.5vw;line-height:1.4;}
.rental-lead{padding:1.5em 0 1.5em;font-size:2.75vw;}
.fnt-pnk{margin-top:0em;padding:1em;border:2px solid;font-size:2.75vw;text-align: justify;}
.fnt-pnk i{display:block;padding-right:0em;text-align:center;padding-bottom:.5em;}
.wide9{width:92%!important;margin:0 auto;}
.studio-map{display:block;}
.studio-map div{width:100%;}
.studio-map div.map-area{width:100%}	
.studio-map > img{ max-width: none;width:100%;}
.mapimg{ width: 100%;}
.map-area{ position: inherit; width: 100%; margin: 10% auto 0; right: auto;font-size:2.75vw;}
    
.event-banner{ width: 95%; margin: 5vw auto;}
    
.page-event{ width: 95%; margin-bottom: 60px;}
.page-event .list{ flex-wrap: wrap;}
.page-event .date{ width: 15%;}
.page-event .ttl{ width: 85%;}
.page-event .ttl p{ letter-spacing: normal; padding: 0 0 0 1em; font-size: .88em;}
.page-event .deta{ width: 100%; padding-bottom: .25em;}
.about-imgs{ margin-bottom: 6vh;}
	
/*==================
Rental Studio page
==================*/
#content-under{padding:0;}
.room-top{padding:0 0 0;}
.room-top .wrap{padding:0 0 2em;}
.room-top .room-wrap{ display: block;padding-top:0em;}
.room-top .room-left{ width: 100%; position:relative; padding: 0 0;}
.room-top .room-right{ width: 100%; position:relative; padding: 2em 4em 0;}

.room-left h1{font-size: 5vw; font-weight: 700;text-align:center;line-height:1.4;margin-bottom:.5em;border-bottom:none;padding:.5em 2em 0;}

.room-left .shop_image{margin: 4em auto 0 !important;}
.room-left .shop_image dl{ width: 100%; padding: 0; margin: 0px 0 2em;}
.room-left .shop_image dd{ padding:0 0;}
.room-left .shop_image ul.slick-dots{ width: 100px;bottom: 1em;}
.room-left ul.slick-dots{bottom: 1em; width: 20vw;}
.room-left ul.slick-dots li button{width: 10px; height: 10px;}
.room-left ul.slick-dots li button::before{width: 10px; height: 10px;}

.room-top .shop-txt{padding: 0 4em;margin-bottom:2.5em;}
.room-top .shop-txt p{font-size: 2.75vw; line-height: 1.7;}

.room-right h2{ text-align:center; font-size: 5.5vw;letter-spacing:0;margin-bottom:.5em;}
.room-right h2 span{ display:block; padding-left:0em;font-size: 2.5vw;font-weight:normal;}

.studio-eq {margin: 0 0;}
.studio-eq table {font-size: 2.75vw; line-height:1.6;}
.studio-eq table th {padding:1em;width:100%;display:block;text-align:left;background:#f6f6f6;}
.studio-eq table td {padding:1em;width:100%;display:block;}

.room-right ul{margin-bottom:2.5em;}
.room-right ul:last-child{margin-bottom:0;}
.room-right li{margin-bottom:1em;position:relative;padding-left:0;padding-top:1.5em;font-size:3.75vw;text-align:center;}
.room-right li:before{position:absolute;font-size:3.75vw;top: 0%;left:50%;transform: translate(-50%,-0%);font-family: fontAwesome;}
.room-right li.add:before{left:50%;}
.room-right li.tel{font-size:7vw;padding-left:0;padding-top:.75em;margin-bottom:.5em;color: #3cafad;line-height:1.1;}
.room-right li.tel:before{left:50%;font-size:5vw;color:#000;}
.room-right li.mail{font-size:5vw;padding-left:0em;padding-top:1em;}
.room-right li.web{font-size:5vw;padding-left:0em;padding-top:1em;line-height:1.3;}
	
.under section.studio{padding: 0 0 3em;}
.under section.studio h2.small{font-size:3.5vw;}

/*==================
EVENT
==================*/
p.event-day{font-size: 8vw!important;}
p.event-day span{font-size: 3vw!important;}
p.event-place {line-height: 1.3; font-size: 2.5vw!important;}
p.event-place span{font-size: 3vw!important;}	
	
/*PAST EVENT*/
.event-past{width:100%;}
.event-past h2{margin-bottom:1em;}
.event-past p{font-size:3vw;display:block;margin:1em 0 0;text-align:center;}
.event-past p span{display:block;}
	
}

@media screen and (max-width: 480px){
.rental-wrap{padding:1.5em 1em 2em;}
.rental-wrap h2{font-size:5.5vw;}
.rental-wrap p.rental-lead{font-size:3.5vw;}
.fnt-pnk{font-size:3.75vw;}
.map-area{font-size:3.25vw;}
	
.room-top .room-right{ width: 100%; position:relative; padding: 1em 1.5em 0;}	
.room-top .room-left{ width: 100%; position:relative; padding: 0 0;}
.room-left h1{font-size: 5.5vw;padding:0 1em 0;}
.room-left .shop_image{margin: 2em auto 0 !important;}	
.room-top .shop-txt{padding: 0 1.5em;margin-bottom:1.5em;}
.room-top .shop-txt p{font-size: 3.75vw; line-height: 1.8;}
	
.room-right h2{font-size: 6.5vw;}
.room-right h2 span{font-size: 3.5vw;}

.studio-eq table {font-size: 3.75vw; line-height:1.6;}
	
.room-right li{margin-bottom:1.5em;position:relative;padding-left:0;padding-top:2em;font-size:3.75vw;text-align:center;}
.room-right li:before{font-size:4.75vw;}
.room-right li.tel{font-size:7vw;padding-left:0;padding-top:1em;margin-bottom:.5em;color: #3cafad;line-height:1.1;}
.room-right li.tel:before{left:50%;font-size:6vw;color:#000;}
.room-right li.mail{font-size:5vw;padding-left:0em;padding-top:1.5em;}
.room-right li.web{font-size:5vw;padding-left:0em;padding-top:1.5em;line-height:1.3;}
	 
section.studio h3{text-align:center;font-size:5vw;margin:0 0 1em;}

}