@charset 'utf-8';
/*===========================================================================
	LAYOUT
============================================================================*/
html{overflow-y:auto;}
body{background:transparent;}
.wrap{margin-left:0 !important;}
#wrap{min-width:320px;max-width:420px;}
#content{min-width:320px;max-width:420px;}
#header{min-width:320px;max-width:420px;}
#footer{min-width:320px;max-width:420px;}
body .app-install-guide{min-width:320px;max-width:420px;}
/*===========================================================================
	Custom User Interface
============================================================================*/
#backgroundMap{position:fixed;top:0;left:420px;width:calc(100%-420px);min-height:100%;z-index:1;border-left:#dddddd 1px solid;}
#backgroundMap .btn-map-control{cursor:pointer;width:45px !important;height:45px !important;border:#dddddd 1px solid;font-size:14px;line-height:45px;text-align:center;border-radius:3px;box-shadow: 0 0 2px 0 rgba(0,0,0,0.30);background:#ffffff;color:#4990E2;position:fixed;right:25px;}
#backgroundMap .btn-map-control.on{background:#0F4F9B;color:#ffffff;}
#backgroundMap #street{top:25px;}
#backgroundMap #pano{top:25px;}
#backgroundMap #compass{top:80px;background:rgb(255,255,255,0.5) !important;width:47px !important;height:47px !important;border-width:0 !important;box-shadow:none;}
#backgroundMap #compass > img{width:31px;height:31px;margin:8px;}
#backgroundMap #cadastral{top:80px;}

#backgroundMap #onlySalesPrice{top:135px;line-height:120%;padding-top:10px;height:53px !important;box-sizing:border-box;}

#backgroundMap .rule-area{position:fixed;right:130px;bottom:5px;text-align:right;}
#backgroundMap .rule-area *{color:#888888 !important;font-size:12px;line-height:14px;}
#backgroundMap .rule-area > ul > li{display:inline-block;border-left:#888888 1px solid;margin:0 0 0 5px;padding:0 0 0 5px;height:14px;line-height:14px;}
#backgroundMap .rule-area > ul > li:first-child{margin-left:0;padding-left:0;border-left:0;}
#backgroundMap .rule-area > ul > li > a{line-height:14px;vertical-align:top;}

#building-card-area{min-width:320px;max-width:420px;}

#search-filter{min-width:320px;max-width:420px;}
/*===========================================================================
	Extend Jquery.ui
============================================================================*/


/*===========================================================================
	MODAL
============================================================================*/
.toastMessage{min-width:320px;max-width:420px;}
.gModal > .gModal-content{min-width:320px;max-width:420px;}
.modal-form-area{min-width:320px;max-width:420px;}
/*===========================================================================
	CONTENTS
============================================================================*/
body#index.study .content > .foot{min-width:320px;max-width:420px;}
body#info .content > .foot .wrap-btn{min-width:320px;max-width:420px;}

body#study .content{padding:0;}
body#study .content > .main .section.wrap-playbox{position:fixed;top:0;left:420px;width:calc(100vw - (100vw - 100%) - 420px);min-height:100vh;padding:0;background:#000;}
body#study .content > .main .section.wrap-playbox > .wrap-player{height:100vh;}
body#study .content > .main .section.wrap-playbox > .wrap-player > #ytplayer{width:calc(100vw - 420px);height:calc((100vw - 420px) * (9 / 16));max-height:100vh;position:absolute;top:calc(50% - 48px);transform: translate(0,-50%); }
body#study .content > .main .section.wrap-playbox > .wrap-play-desc{position:absolute;bottom:0;min-width:100%;}