
/*==================================================
スライダーのためのcss
===================================*/
/*@font-face {
	font-family: 'webnoto';
	src: url('file://///192.168.0.200/Public/htdocs/h_花ランド/サーバーアップ用/font/NotoSansJP-Medium.otf') format("opentype");
}*/

.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
   width:100%;
    margin:0 auto;
}

.slider img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
	    max-height: 130vw;
    object-fit: cover;
}

.slider li{
	position: relative;
}

.slide_head{
    width: 100%;
    height: 13vw;
    position: absolute;
    /*border-bottom: 1px solid #76a2c287;*/
    z-index: 10;
    background: rgb(255,255,255,0.9);
}

.back_left_b{
	position: absolute;
    top: 50%;
    left: 6vw;
    transform: translate(0, -50%);
}
.back_left_b div{
    height: 3vw;
    width: 3vw;
    display: block;
	border: 0.8vw solid gray;
    border-right-width: 0;
    border-bottom-width: 0;
    -webkit-transform: rotate(-45deg);
}

.slide_head p{
    font-size: 3.8vw;
    font-weight: bold;
    color: #87bd43;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: fit-content;
}

.slide_head p span{
    font-size: 3.2vw;
    font-weight: normal;
    color: #7f7f80;
    margin-right: 0vw;
}

.flower_name{
    font-size: 3.4vw;
    line-height: 4.8vw;
    color: #c3c3c3;
}



/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
}
/*ドットナビゲーションの設定*/

.slick-dots {
	position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
	height: 3.2vw;
    bottom: -5.3vw;
}

.slick-dots li {
    display: inline-block;
    margin: 0px 1.2vw;
}

.slick-dots button {
    color: transparent;
    outline: none;
        width: 2.3vw;
    height: 2.3vw;
    display: block;
    border-radius: 50%;
    background: #dcdcdd;
}

.slick-dots .slick-active button{
    background: #717071;
        width: 2.3vw;
    height: 2.3vw;
}
.back_left:hover, .tuiseki2:hover, .otoiawase:hover{
	opacity: 0.6;
}

.slider_ab{
    position: absolute;
    bottom: 1.8vw;
    left: 50%;
    transform: translate(-50%, 0);
    width: 90%;
}
































