@media only screen and (min-width: 320px) and (max-width:992px) {
	
	body, html{position: relative;height: auto !important;overflow: scroll !important}
	
	.tran-wrapper, .landing-wrapper{position: relative;top:auto;left: auto;float: left;transform: scale(1);opacity: 1;height:  100% !important;pointer-events: auto }
	#main{display: none}
	
	.landing-wrapper{background: url(img/ssw_web_mockup_mobile.png) center center no-repeat;background-size: 80%}
	
	/* landing */
	.landing-logo-1,.landing-logo-2,.landing-logo-3{display: none}
	
	/* header */
	.logo{position: fixed;left:15px;top:15px;width: 180px;z-index: 99;transform: translateY(0%)}
	.close-btn{top: 15px;right: 15px;width: 30px;height: 30px}
	.menu-list li{width: 100%;margin: 10px 0}
	header{padding: 30px 0;top:0px;text-align: center;opacity: 0;pointer-events: none;transform: translateY(-100vh)}
	header.active{transform: translateY(0);pointer-events: auto;opacity: 1}
	.menu-btn{display: block;width: 100%;text-align: center;position: fixed;right: 15px;top: 15px;background: #FFF;z-index: 98;cursor: pointer; ;background: url(img/menu-btn.svg) center center no-repeat;background-size: 80%;width: 30px;height: 30px;border-radius: 100%;border: 3px solid #FFF}
	.menu-btn.active{border: 3px solid #333;background: url(img/close-btn-b.svg) center center no-repeat;background-size: 80%;}
	.menu-list{overflow: hidden;position: absolute;top:50%;left: 0;width: 100%;transform: translateY(-50%)}
	.menu-list h4{font-size: 1.6em}
	.menu-list li{margin-bottom: 20px}
	.menu-btn.showup{display: none}
	.menu-list li:nth-child(1){display: none}
	.ss-list{right: calc(50% - 75px);bottom: 60px}
	
	.lang-btn{bottom: 0;width: 100%;height: 40px;top:auto;right: 0}
	
	
	/* home */
	.side-item{display: none}
	.single-block,.photo-block{position: relative !important;top:auto !important;left: auto !important;right: auto !important;width: 280px !important; height:  396px !important;padding: 20px;margin: 0 auto}
	.image-wrapper{width: 100% !important;height: auto !important}
	.single-block-inner{width: 100%;height: 100%}
	.pan-wrapper{position: relative;padding: 80px 0 ;height: auto !important;overflow: hidden}
	.icon-ball{width: 65px;height: 65px;left: -20px;top:25%}
	
	/* listing */
	.single-block-gra1{top: 31%}
	.single-block-gra2{height: 54%;top:36%}
	.single-block-gra{height: 60%;top:30%}
	.image-wrapper{max-width: 360px !important;margin: 0 auto}
	.single-block-inner img{bottom: auto;top:0}
	.image-wrapper { display: flex; flex-direction: column; }
	.single-block-loc-1{order:4}
	.single-block-loc-2{order:5}
	.single-block-loc-3{order:6}
	.single-block-loc-4{order:1}
	.single-block-loc-5{order:3}
	.single-block-loc-6{order:2}
	.single-block-loc-7{order:7}
	
	/* single */
	.single-content-area,.single-title-wrap,.single-content-area-exhibit{padding:  15px;width: calc(100% - 30px);transform: translateX(0%);position: relative;top:auto;left: auto;overflow: hidden;height: auto}
	.single-title-wrap{padding-top: 120px}
	.single-content,.single-exhibit{overflow: scroll;background: #FFF}
	.single-title-wrap h2{margin-bottom: 0}
	.back-btn{right: 17px;top:17px;position: absolute;width: 33px;height: 33px}
	.youtube-player{height: 52vw}
	.storybook-wrap img{width: 50% !important}
	
	/* popup */
	.popup-resources .popup-inner{width: calc(100% - 30px);}
	.popup-about{overflow: scroll}
	.popup-about .popup-inner{position: relative;overflow: hidden;height: auto;width: calc(100% - 30px);padding: 15px;padding-top: 120px }
	.about-icon{display: none}
	
	.popup-wrap .popup-inner{padding:30px 15px;width: 80vw}
	
	/* exhibition */
	.photo-thum-list{width: 100%}
	.photo-thum-list li{padding:0 15px;width: calc(50% - 30px)}
	.photo-thum{height: 28vw}
	 .single-content-area-exhibit{padding:60px 0;width: 100%}
	 .photo-alumb-wrap{position: relative}
	 .single-content-area-exhibit.open{width: 100%}
	 .flex-inner-image{height: 60vw !important}
	 .photo-slides{margin-top: 20px}
	
}
@media only screen and (min-width: 1024px) and (max-width:6000px) {







@media(min-width:768px) {
}