@charset "UTF-8";

h1{ text-align: left; }
h2{ 
    text-align: left; 
    margin-top: 2%;
}
.main-content{ 
    width: 98%;
    margin: 0px auto;
    text-align: left; 
}
.text-adjust{ display: inline-block; }

/* グループホーム説明 */
.group-home-explain{
    width: 100%;
    height: auto;
    text-align: left;
}

/* らいふはうす説明 */
.life-house-explain{
    width: 100%;
    height: auto;
    text-align: left;
}

/* 施設画像 */
.appearance-image-box{
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}
.life-house-image{
    width:100%;
    height:auto;
    object-fit: contain;
    border:solid 2px var(--logo-color);
    margin: 1% 0;
}
/* スマホの横画面対応 */
@media screen and ( max-height:450px ) {
    .appearance-image-box{
        width: 75%;
        height: auto;
        margin-left: auto;
        margin-right: auto;
    }
}

/* 画像スライダー */
.slide-show{
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;

    
}
@media screen and ( max-height:450px ) {
    .slide-show{
        width: 75%;
        height: auto;
        margin-left: auto;
        margin-right: auto;
        
    }
}
.select-button{
    width:90%;
    margin-left: auto;
    margin-right: auto;
}
.life-house-obj.gallery li{ 
    width: 100%;
    aspect-ratio: 4/3;
    background-color: white; 
    border-radius: 1em;
    border:solid 2px var(--logo-color);
    box-sizing: border-box;
}
.select-button li{ 
    width: 100%;
    aspect-ratio: 1/1;
    background-color: white; 
    cursor: pointer;
	outline: none;
    list-style:none;
    border:solid 1.5px var(--logo-color);
    box-sizing: border-box;
}

.life-house-obj.gallery img{
    width: 100%;
    height:100%;
    padding-top: 1em;
    padding-bottom: 1em;
    margin-left: auto;
    margin-right: auto;
    vertical-align: bottom;
    object-fit: contain;
}
.select-button img{
    width: auto;
    height: 98%;
    padding-top: 1%;
    padding-bottom: 1%;
    margin-left: auto;
    margin-right: auto;
    object-fit: contain;
}
.life-house-obj.gallery{ margin: 0 0 5% 0; }
.gallery.life-house-obj li{ list-style: none; }
/* 矢印設定 */
.slick-prev,
.slick-next{
    position: absolute;/*絶対配置にする*/
	z-index: 2;
    top: 50%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 3px solid black;/*矢印の色*/
    border-right: 3px solid black;/*矢印の色*/
    height: 25px;
    width: 25px;
}
/*戻る矢印の位置と形状*/
.slick-prev {
    left:2.5%;
    transform: translateY(-50%) rotate(-135deg);
}

/*次へ矢印の位置と形状*/
.slick-next {
    right:2.5%;
    transform: translateY(-50%) rotate(45deg);
}

/*選択するサムネイル画像の設定*/
.select-button li img{
	opacity: 0.4;/*選択されていないものは透過40%*/
}

.select-button li.slick-current img{
	opacity: 1;/*選択されているものは透過しない*/
}

.select-button .slick-track {
	transform: unset !important;/*画面幅サイズ変更に伴うサムネイル固定*/
}

/* 印刷用施設画像 */
.print-image-list{
    display: none;   
}
/* 事業所詳細 */
.office-detail{
    width:  100%;
    background: white;
    border-collapse: collapse;
    border-bottom: 4px #ffffff solid;

}
.office-detail tr td{
    padding-top: 2%;
    padding-bottom: 2%;
    padding-left: 5%;
    border-bottom: 3px var(--background-green) solid;
}

.office-detail .title{
    width: 25%;
    font-weight: bold;
}

/* 事業所詳細のレスポンシブ対応*/
@media screen and ( max-width:800px ) {
    
    .office-detail tr td{
        display:flex;
        justify-content: left;
        text-align: left;
        padding-top: none;
        padding-bottom: none;
        padding-left: 5%;
        border-bottom: none;
    
    }
    .office-detail tr{
        border-bottom: 3px var(--background-green) solid;
    }
    .office-detail .title{
        width: 100%;
        font-weight: bold;
    }
    .lf-access{
        display: flex;
        flex-flow: column;
    }
    
}

/* GoogleMap */
.google-map-box{ width:100%; }
.lh-google-map{
    width: 100%;
    aspect-ratio: 4/3; 
}
/* スマホの横画面対応 */
@media screen and ( max-height:450px ) {
    .google-map-box{
        width:75%;
        margin-left: auto;
        margin-right: auto;
    }
}

/* 印刷用CSS */
@media print{
    
    .print-invisible{ display: none; }

    .print-visible-image-list{
        display: flex;
        flex-wrap: wrap;
    }
    .print-image-box{
        width: 50%;
        aspect-ratio: 1/1;
    }
    .print-image-box img{
        width: 100%;
        height:100%;
        padding-top: 1em;
        padding-bottom: 1em;
        margin-left: auto;
        margin-right: auto;
        vertical-align: bottom;
        object-fit: contain;
    }
    
}