@charset "UTF-8";

body.top h2,body.category section h2{
  font-size:7vw;font-weight:500;letter-spacing:.1em;text-align:center;margin-bottom:1.25em;
}
body.top h2 span,body.category section h2 span{font-size:3vw;font-weight:normal;letter-spacing:2px;line-height:1.6;display:block;padding-top:.5em;}
body.top h2.small{font-size:3.5vw;}

.mainimg{
  width:100%;
  position: relative;
  overflow: hidden;
}
.top_mainimg{
  min-height: 140vw;
}
.mainimg .img{
  width:100%;
  position: relative;
  padding: 140% 0 0 0;
}
.mainimg .img:before{position: absolute;background:rgba(0, 0, 0, .3);content:"";top:0;width:100%;height:100%;z-index:2;}
.mainimg .img img{position: absolute;top: 50%;left: 50%;width: auto;height: 100%;object-fit: cover;transform: translate(-50%, -50%);}
.mainimg .wrap{padding:0;}
.mainimg h1{width:70%;position:absolute; top:5.5vh; left:6%; transform: translate(-0%,-0%);z-index:3;animation: fadeIn 0.5s ease 0s 0.5 normal;-webkit-animation: fadeIn 0.5s ease 0s 0.5 normal;}
.mainimg h1 img{margin-bottom:1.25em;width:75%;}
.mainimg h1 span{display:block;color:#dbff31;font-size:2.5vw;letter-spacing:.5px;}
.mainimg .text{width:84%;z-index:4;}
.mainimg .text p{font-size:3.25vw;color:#fff;}
.mainimg .text p span{font-size:5vw;font-weight:bold;display:block;letter-spacing:5px;margin-bottom:.4em;}

body.contents .mainimg .text{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 84%;colo:#fff;}
body.contents .mainimg .text h1{font-size:6.5vw;color:#fff;margin-bottom:1em;}
body.contents .mainimg .text h2{font-size:4.5vw;color:#fff;text-align:center;font-weight:bold;}

@keyframes fade-in {from {opacity: 0;transform: translateY(100px);}to {opacity: 1;transform: translateY(0);}}
.swiper-container {width: 100%;}
.swiper-container .swiper-wrapper .swiper-slide {background-repeat: no-repeat;background-size: cover;background-position: center;}
.swiper-container .swiper-wrapper .swiper-slide p {position: absolute;bottom: 7%;left: 8%;width:84%;z-index:4;}
.swiper-container .swiper-wrapper .swiper-slide-active p {animation-name: fade-in;animation-duration: .5s;animation-delay: .5s;animation-fill-mode: both;}

body.top section,body.category section{padding:2.75em 0 3.5em;}
section.glbk{background:#efefef;}

.top-news{padding:0;}
.top-news ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.top-news li{width:47.5%;margin-bottom:2em;position: relative;overflow: hidden;}
.top-news li a{width:100%;}
.top-news li .img{
  position: relative;
  overflow: hidden;
  margin-bottom:1em;
  width:100%;
  /* padding: 50% 0 0 0; */
  padding: 66.6666% 0 0 0;
}
.top-news li .img img{
  position: absolute;
  width:100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  display: block;
  transition: all .5s ease-in-out;
}
.top-news li p{font-size:3.1vw;line-height:1.6;}
.top-news li p.date{font-size:2.5vw;font-weight:normal;letter-spacing:1px;color:#777;margin-bottom:.25em;}
section.pickup .top-news li{width:100%;margin-bottom:2.5em;}
section.pickup .top-news li:last-child{margin-bottom:0em;}
section.pickup .top-news li .img{margin-bottom:0;}
section.pickup .top-news li .txt{position:absolute;bottom:0;padding:.75em;color:#fff;width:100%;background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .8) 90%);}
section.pickup .top-news li p.date{color:#eee;}

body.contents .top-news li .img{padding: 60% 0 0 0;background:#000;}
body.contents .top-news li .img img{top: 50%;left: 50%;transform: translate(-50%, -50%);width:100%;height:auto;}
body.contents section.pickup .top-news li .txt{padding:1em;}
body.contents section.pickup .top-news li p{font-size:3.4vw;font-weight:bold;}
body.contents section.pickup .top-news li p.date{background:#3de3d9;color:#fff;padding:.4em .6em;display:inline-block;position:absolute;top:0;right:0;line-height:1.2;font-size:3vw;font-weight:500;}
body.contents section.pickup .top-news li p.st-txt{font-size:2.5vw;font-weight:normal;}
body.contents section.pickup .top-news li .img{padding-top:60%;}
body.contents section.pickup .top-news li .img img{top: 50%;left: 50%;transform: translate(-50%, -50%);width:100%;height:auto;}

.link{text-align:center;}
.top-link-bt{display:block;font-size:2.75vw;text-align:center;font-weight:300;border:1px solid #aaa;padding:1em 1.5em;letter-spacing:3px;width:60%;margin:0 auto;position:relative;}
.top-link-bt:before{position:absolute; top: 50%; right: 24px; transform: translate(-0%,-50%);content: ''; width:1px;height:8px;background:#333;}
.top-link-bt:after{position:absolute; top: 50%; right: 20px; transform: translate(-0%,-50%);content: ''; width:9px;height:1px;background:#333;}

.top-sns{padding:0;}
.top-sns ul{padding:.5em 0 0;display: flex; flex-wrap: wrap; justify-content: space-between;}
.top-sns li{margin-bottom:1.5em;width:47%;}
.top-sns li:nth-child(9),.top-sns li:nth-child(10) {margin-bottom:0;}
.top-sns li:last-child{margin-bottom:0;}
.top-sns li.twitter {padding:.5em;border:1px solid #ccc!important;}
.top-sns li a.link-banner{display:block;width:85%;margin:0 auto 1em;}

/* category top
------------------------------------------- */
body.category .container{padding-top:26%;}
body.category .mainimg h1{width:100%;position:static;text-align:center;color:#222;font-size:5vw;font-weight:700;letter-spacing:5px;}
body.category .mainimg h1 span{font-size:3vw;font-weight:normal;letter-spacing:3px;line-height:1.6;display:block;padding-top:.5em;color:#222;}

/* rental category top
------------------------------------------- */
body.contents .container{padding-top:17%;}
body.studio-category .mainimg .img{padding: 50% 0 0 0;}
body.studio-category .mainimg .img img{width:100%;height:auto;}

body.studio-category .mainimg h1{font-weight:500;text-transform:uppercase;}
body.studio-category .mainimg h1 span{color:#fff;}
body.studio-category .container section:nth-child(even){background:#efefef;}
body.studio-category .container section h2{text-transform:uppercase;}

/* blog post
------------------------------------------- */
.post-wrap{padding:0 3%;}
.post-wrap p.category{color:#cc0000;font-size:3vw;margin-bottom:.75em;letter-spacing:1px;font-weight:bold;}
.post-wrap h1{font-size:5.5vw;margin-bottom:.2em;font-weight:600;line-height:1.4;}
.post-wrap p.date{font-size:2.4vw;font-weight:normal;letter-spacing:1px;color:#777;margin-bottom:3em;}
.post-wrap .post-box{font-size:3.25vw;line-height:1.9;margin-bottom:2.5em;word-break:break-all;overflow:hidden;}
.post-wrap .post-box h2{font-size:5vw;font-weight:600;text-align:left;margin:1.5em 0 .75em;letter-spacing: 0;line-height:1.4;}
.post-wrap .post-box h3,.post-wrap .post-box h4,.post-wrap .post-box h5{font-size:5vw;font-weight:600;text-align:left;margin:1.5em 0 .75em;letter-spacing: 0;line-height:1.4;}
.post-wrap .post-box img{max-width:100%;display:block;height:auto;margin:1em auto 0;}
.post-wrap .post-box iframe{width:100%;height:200px;}
.post-wrap .post-box a{font-weight:bold;}
.post-wrap .post-box a:hover{color:#cc0000;}

.post-navi{display: flex; flex-wrap: wrap; justify-content: center;padding:2em 0 3em;}
.post-navi div{padding:0 1.5em;position:relative;letter-spacing:1px;}
.post-navi div.prev i{padding-right:.5em;}
.post-navi div.next i{padding-left:.5em;}
.post-navi div.blind {color:#ccc;}

@media screen and (min-width: 768px) {
  body.top h2,body.category section h2{font-size:4vw;margin-bottom:1.5em;}
  body.top h2 span,body.category section h2 span{font-size:2.3vw;}
  body.top h2.small{font-size:2.5vw;}

  .top_mainimg{
    min-height: 115vw;
  }
  .mainimg .img{width:100%;position: relative;padding: 115% 0 0 0;}	
  .mainimg h1{position:absolute; top:7.5%; left:7%;}
  .mainimg h1 img{margin-bottom:1.75em;}
  .mainimg h1 span{font-size:2vw;}	
  .mainimg .text p{font-size:2.75vw;}
  .mainimg .text p span{font-size:4.5vw;}
    
  body.top section,body.category section{padding:4.5em 0 5em;}
    
  .top-news li{margin-bottom:3em;}
  .top-news li p{font-size:2.5vw;line-height:1.6;}
  .top-news li p.date{font-size:1.75vw;}
  section.pickup .top-news li .txt{padding:1.25em}
  body.contents section.pickup .top-news li .txt{padding:2em;}
  body.contents section.pickup .top-news li p{font-size:3.25vw;font-weight:bold;margin-bottom:.25em;}
  body.contents section.pickup .top-news li p.date{font-size:2.5vw;}
  body.contents section.pickup .top-news li p.st-txt{font-size:2.25vw;}
    
  .top-link-bt{font-size:2vw;width:50%;}
  .top-link-bt:before{height:12px;right: 26px;}
  .top-link-bt:after{width:13px;}	
    
  .top-sns ul{padding:0 2.5%;}
  .top-sns li{margin-bottom:2em;}
  .top-sns li a.link-banner{display:block;width:75%;margin:0 auto 2em;}
  .top-sns li .fb-page{display:block;margin:0 auto;}

  /* category top
  ------------------------------------------- */
  body.category .container{padding-top:22%;}
  body.category .mainimg h1{font-size:3vw;}
  body.category .mainimg h1 span{font-size:2.3vw;}

  /* contents top
  ------------------------------------------- */
  body.contents .container{padding-top:15%;}	
    
  /* blog post
  ------------------------------------------- */
  .post-wrap{padding: 0 0;}
  .post-wrap p.category{font-size:2.4vw;margin-bottom:1em;}	
  .post-wrap h1{font-size:4vw;}
  .post-wrap p.date{font-size:1.6vw;margin-bottom:4em;}
  .post-wrap .post-box{font-size:2.2vw;margin-bottom:3.5em;}
  .post-wrap .post-box h2{font-size:3vw;margin:1.5em 0 .75em;}
  .post-wrap .post-box h3,.post-wrap .post-box h4,.post-wrap .post-box h5{font-size:3vw;margin:1.5em 0 .75em;}
    
}

@media screen and (min-width: 897px) {
  body.top h2,body.category section h2{font-size:2.8vw;margin-bottom:1.5em;}
  body.top h2 span,body.category section h2 span{font-size:1vw;padding-top:0;}
  body.top h2.small{font-size:1.25vw;}
  
  .top_mainimg{
    min-height: 55.5vw;
  }
  .mainimg .img {
    width: 100%;
    position: relative;
    padding: 55.5% 0 0 0;
  }
  .top .mainimg .img {
    aspect-ratio: 3 / 2;
  }
  .mainimg .wrap{padding:0;width:100%;}
  .mainimg h1{width:35%; top:12.5%; left:7%;}
  .mainimg h1 span{font-size:1.2vw;}	
  .mainimg .text p{font-size:1.25vw;text-align:right;}
  .mainimg p:hover{color:#dbff31;}
  .mainimg .text p span{font-size:2.4vw;margin-bottom:.4em;}
  .swiper-container .swiper-wrapper .swiper-slide p {position: absolute;bottom: 8%;left:inherit;right:7%;width:40%;}	
    
  body.top section,body.category section{padding:3.5em 0 4em;}
    
  .top-news ul:before{content:"";display: block;width:23%;order:1;}
  .top-news ul:after{content:"";display: block;width:23%;}		
  .top-news li{margin-bottom:1.5em;width:23%;display:block;}
    
  .top-news li div{width:100%;}
  .top-news li div.txt{padding:0 0;}	
  /* .top-news li .img{padding: 49% 0 0 0;margin-bottom:1em;}	 */
  .top-news li p{font-size:1.2vw;line-height:1.6;}
  .top-news li p.date{font-size:.8vw;}
    
  section.pickup .top-news li{width:31%;margin-bottom:0;}
  /* section.pickup .top-news li .img{padding: 50% 0 0 0;} */
  section.pickup .top-news li .txt{padding:1em;}	
  section.pickup .top-news li p{font-size:1vw;}
  section.pickup .top-news li p.date{font-size:.7vw;}
    
  .top-news .top-link-bt{font-size:1vw;}
  .top-link-bt{font-size:1.1vw;width:30%;}
    
  .top-sns ul{padding:1em 0 0;}
  .top-sns li{width:19%;margin-bottom:1em;}
  .top-sns li.twitter {height:380px;overflow: hidden;}
    
  /* category top
  ------------------------------------------- */
  body.category .container{padding-top:11%;}
  body.category .mainimg h1{font-size:2vw;}
  body.category .mainimg h1 span{font-size:1vw;}
    
  /* contents top
  ------------------------------------------- */
  body.contents .container{padding-top:6.75%;}	
  body.contents .mainimg .img	{padding: 40% 0 0 0;}
  body.contents .mainimg .img img{width:100%;height:auto;}
  body.contents .mainimg .text{width: 70%;}
  body.contents .mainimg .text h1{font-size:3.5vw;}
  body.contents .mainimg .text h2{font-size:2vw;}
  body.contents .mainimg .text p{text-align:left;}
  body.contents .mainimg .text p:hover{color:#fff;}
  body.studio-category .mainimg .img{padding: 25% 0 0 0;}
  body.studio-category .mainimg .text h1{font-size:3vw;}

  body.contents section.pickup .top-news li .txt{padding:1em;}
  body.contents section.pickup .top-news li p{font-size:1vw;}
  body.contents section.pickup .top-news li p.date{font-size:.9vw;}
  body.contents section.pickup .top-news li p.st-txt{font-size:.8vw;}	
    
  /* blog post
  ------------------------------------------- */
  .post-wrap p.category{font-size:1.4vw;margin-bottom:1.5em;}		
  .post-wrap h1{font-size:2.3vw;}
  .post-wrap p.date{font-size:1vw;margin-bottom:4em;}
  .post-wrap .post-box{font-size:1.2vw;margin-bottom:3.5em;}
  .post-wrap .post-box h2{font-size:1.8vw;margin:1.5em 0 1em;}
  .post-wrap .post-box h3,.post-wrap .post-box h4,.post-wrap .post-box h5{font-size:1.8vw;margin:1.5em 0 1em;}
  .post-wrap .post-box img{margin:2em auto;display:block;height:auto;}
  .post-wrap .post-box iframe{width:80%;margin:0 auto;height:300px;}	
}

@media screen and (min-width: 1280px) {
/* body.top h2,body.category section h2{font-size:1.8vw;margin-bottom:1.5em;}
body.top h2 span,body.category section h2 span{font-size:.9vw;adding-top:.25em;} */

.mainimg h1{width:34%; top:13.5%; left:8%;}
.mainimg h1 img{margin-bottom:3em;}	
.mainimg h1 span{font-size:.8vw;}		
.mainimg .text p{font-size:1vw;}
.mainimg .text p span{font-size:2vw;}
	
body.top section,body.category section{padding:4em 0 4.5em;}
	
.top-news ul{padding:0 0;}
.top-news li{margin-bottom:4em;}	
.top-news li .img{margin-bottom:1.5em;}	
.top-news li p{font-size:.8vw;}
.top-news li p.date{font-size:.6vw;}
.top-news .link{right:10%;top:2%;}
.top-news .top-link-bt{font-size:.65vw;}
section.pickup .top-news li .txt{padding:1.5em;}
section.pickup .top-news li p{font-size:.9vw;}	
	
.top-link-bt{font-size:.8vw;width:20%;}

.top-sns ul{margin:0 auto;padding:0 0;}
.top-sns li{margin-bottom:1.5em;}
.top-sns li img{width:90%;display:block;margin:0 auto;}	
	
/* category top
------------------------------------------- */
body.category .container{padding-top:9%;}
body.category .mainimg h1{font-size:1.8vw;}
body.category .mainimg h1 span{font-size:.9vw;}	
	
/* contents top
------------------------------------------- */
body.contents .container{padding-top:4.75%;}
body.contents .mainimg .text h1{font-size:2.75vw;margin-bottom:.5em;}
body.contents .mainimg .text h2{font-size:1.5vw;}
body.studio-category .mainimg .text h1{font-size:2.25vw;}
	
	
/* blog post
------------------------------------------- */
.post-wrap .wrap{width:1100px;margin:0 auto;}
.post-wrap p.category{font-size:1.2vw;margin-bottom:1.5em;}		
.post-wrap h1{font-size:1.9vw;}
.post-wrap p.date{font-size:.8vw;margin-bottom:5em;}
.post-wrap .post-box{font-size:1vw;margin-bottom:6%;}
.post-wrap .post-box h2{font-size:1.5vw;margin:2em 0 1.25em;}
.post-wrap .post-box h3,.post-wrap .post-box h4,.post-wrap .post-box h5{font-size:1.5vw;margin:2em 0 1.25em;}
.post-wrap .post-box img{margin:3em auto;display:block;height:auto;}
.post-wrap .post-box iframe{width:600px;max-width:600px;margin:0 auto;height:300px;}		

}

@media screen and (min-width: 1440px) {
body.top section,body.category section{padding:4em 0 4.5em;}
.top-sns ul{width:1200px;}

/* blog post
------------------------------------------- */	
.post-wrap p.category{font-size:1vw;}		
.post-wrap h1{font-size:1.7vw;}
.post-wrap p.date{font-size:.8vw;}
.post-wrap .post-box{font-size:.9vw;}
	
/* contents top
------------------------------------------- */
body.contents .container{padding-top:4%;}
	
}