@charset "UTF-8";

/* base */
.m-container{width: calc(100% - 40px); max-width: 100%; margin: 0 auto;}
.w-1300{max-width: 1300px;}
.w-1400{max-width: 1400px;}

#photoBlock .block .capIn.photo__capIn { color: white; background-color:rgba(0,0,0,0.60);padding: 3px 6px; bottom: 0; right: 0;}


#tower-life .blockInfo{padding: min(6.5vw, 120px) 0 min(12.5vw, 240px);}
#tower-life .blockInfo .tit{color: #231815; font-size: 30px; line-height: 1.6; text-align: center; margin: 0 0 80px; letter-spacing: 0.1em; padding: 0 20px;}
#tower-life .blockInfo .photo{text-align: center; width: 100%; max-width: 926px; margin: 0 auto;}
#tower-life .blockInfo .photo .capOut{text-align: right;}

#tower-life .blockNav{width: 100%; display: flex; align-items:flex-start; justify-content: center; flex-wrap: wrap; padding: min(6.5vw, 120px) 0 0}
#tower-life .blockNav .item{width: 15%; background: #ffffff; border: 1px solid #D9CEB0; padding: 20px 10px; text-align: center; font-size: 14px; line-height: 1; cursor: pointer; transition: all 0.3s ease; margin: 0 1.25% 1.25% 0;}
#tower-life .blockNav .item.btnCS{pointer-events: none; color:#ccc;  background-color: #f0f0f0; border: none;font-size: 12px; position: relative;padding-top: 15px;padding-bottom: 29px;}
#tower-life .blockNav .item.btnCS:after{content:'Coming Soon';font-size: 11px;display: block; position: absolute; bottom:14px; left: 33%}
#tower-life .blockNav .item:nth-child(6n) {margin-right: 0;}
#tower-life .blockNav .item.is-active,
#tower-life .blockNav .item:hover{background: #80724A; color: #ffffff;}

#tower-life .block{padding-bottom: 140px;}
#tower-life .block .box__heading .p3{font-family: "Cinzel", serif; font-size: 18px; line-height: 2; letter-spacing: 0.1em; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); padding: 15px 0; border-left: 1px solid rgba(255, 255, 255, 0.5); border-right: 1px solid rgba(255, 255, 255, 0.5); width: 100px; text-align: center;}
#tower-life .block .tit{font-size: 16px; line-height: 2.2; margin: 10px 0 0;text-align: center;}

#tower-life .slick-arrow{position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; cursor: pointer;}
#tower-life .slick-arrow.a-left{left: 1%;}
#tower-life .slick-arrow.a-right{right: 1%;}
#tower-life .slick-arrow:hover{opacity: 0.8;}

#tower-life .bg{background: #ffffff url('../imgs/bg.png') left top / 100% auto no-repeat; opacity: 0;}
#tower-life .bg.sai-animate{opacity: 1;}

@media screen and (min-width: 769px) {
    #tower-life .block .tit-right{text-align: right;}
    #tower-life .block .tit-right span{text-align: left; display: inline-block;}
}

@media screen and (max-width: 1200px) {
    #tower-life .blockNav .item {height: 78px; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; font-size: 16px;}
}

@media screen and (max-width: 768px) {
    .w-1400{width: 100%;}
    .w-1300{width: calc(100% - 20px);}
	.box__heading .p1,.box__heading .p2{text-align: left;padding-left: 10px;}
    #tower-life .blockInfo{padding: 80px 0 40px;}
    #tower-life .blockInfo .tit{font-size: min(5.5vw, 24px);}
    #tower-life .blockInfo .photo .capOut{padding-right: 10px;}
    
    #tower-life .blockNav{padding: 40px 20px 0; justify-content: flex-start;}
    #tower-life .blockNav .item{width: 49%; font-size: min(3.2vw, 14px); padding: 15px 5px; margin: 0 2% 2% 0 !important; height: unset;}
    #tower-life .blockNav .item:nth-child(2n){margin-right: 0 !important;}

    #tower-life .block{padding-bottom: 60px;}
    #tower-life .block .box__heading .p3{font-size: min(4.1vw, 18px); right: 0; border-right: none; padding: 5px 0; width: 70px;}
    #tower-life .block .tit{font-size: min(3.7vw, 16px); line-height: 1.8; text-align: left;}

    #tower-life .slick-arrow{width: 30px;}

    #tower-life .bg{background: #ffffff url('../imgs/bg_sp.png') left top / 100% auto no-repeat;}
	.photo__capIn2{font-size: 2.8vw;}
}