@charset "UTF-8";










/*画像の横幅を100%にしてレスポンシブ化*/
img{width: 100%;height: auto;vertical-align: bottom;}

/*メイン画像下に余白をつける*/
.gallery{margin:0 0 20px 0;}

/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
position: absolute;/*絶対配置にする*/
z-index: 3;
top: 42%;
cursor: pointer;/*マウスカーソルを指マークに*/
outline: none;/*クリックをしたら出てくる枠線を消す*/
border-top: 2px solid #ccc;/*矢印の色*/
border-right: 2px solid #ccc;/*矢印の色*/
height: 25px;
width: 25px;
}

.slick-prev {left:2.5%;transform: rotate(-135deg);}

.slick-next {right:2.5%;transform: rotate(45deg);}

/*選択するサムネイル画像の設定*/
.choice-btn {width:92%; margin: auto;}
.choice-btn li{cursor: pointer;outline: none;background:#333;width: 18.4%!important;
margin: 0 2% 0 0;}
.choice-btn li:last-child {margin: 0;}
.choice-btn li img{opacity: 0.4;}
.choice-btn li.slick-current img{opacity: 1;}
.wrapper{width:94%;max-width:900px;margin:0 auto;}
ul{margin:0;padding: 0;list-style: none;}
a{color: #333;}
a:hover,
a:active{text-decoration: none;}
.list_btn_back {position: absolute;bottom:0;left: 0;width: 100%;}

.list_btn {position: relative;}
.list_btn span {z-index: 999;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 auto;
padding: 8px 25px 8px 10px;
background: #FFF;
color: #465050;
font-size: 12px;
line-height: 1;
font-weight: 600;
border: 1px solid #465050;
transition: 0.3s;
text-decoration: none;
text-align: center;
}
.list_btn span::after {
content: '';
width: 8px;
height: 8px;
border-top: 1px solid #465050;
border-right: 1px solid #465050;
transform: rotate(45deg);
margin: 0 0 0 10px;
position: absolute;
top: 35%;
right: 10px;
}

@media screen and (max-width: 1060px) {
.list_btn_back {position: absolute;bottom:0;left: 0;width: 100%;}

.list_btn {position: relative;}
.list_btn span {z-index: 999;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 auto;
padding: 8px 25px 8px 10px;
background: #FFF;
color: #465050;
font-size: 1.8vw;
line-height: 1;
font-weight: 600;
border: 1px solid #465050;
transition: 0.3s;
text-decoration: none;
text-align: center;
}
.list_btn span::after {
content: '';
width: 8px;
height: 8px;
border-top: 1px solid #465050;
border-right: 1px solid #465050;
transform: rotate(45deg);
margin: 0 0 0 10px;
position: absolute;
top: 35%;
right: 10px;
}
}
@media screen and (max-width: 767px) {
.list_btn_back {position: absolute;bottom: 1vw;right: 1vw;}
.list_btn {position: relative;}
.list_btn span {z-index: 999;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 auto;
padding: 5px 25px 5px 10px;
background: #FFF;
color: #465050;
font-size: 2.2vw;
line-height: 1;
font-weight: 600;
border: 1px solid #465050;
transition: 0.3s;
text-decoration: none;
text-align: center;
}
.list_btn span::after {
content: '';
width: 6px;
height: 6px;
border-top: 1px solid #465050;
border-right: 1px solid #465050;
transform: rotate(45deg);
margin: 0 0 0 10px;
position: absolute;
top: 35%;
right: 10px;
}

}