@charset "UTF-8";
/* CSS Document */



.modal_wrap{
	position: fixed;
	top:0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	display: none;
	overflow-y: scroll;

}
.modal_bg{
	background-color: rgba(0, 0, 0, 0.6);
	width: 100%;
	height: 100%;
	position: fixed;
}
.modal_inner{
	width: 100%;
 	max-width: 1100px;
 	position: absolute;
 	top: 10%;
 	left: 50%;
 	transform:translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	padding:0 50px;
}
.modal_eria{
	background:#ffffff;
	padding:8%;
	position: relative;
}
.modal_close_btn{
	
}
.modal_bottom_space{
	height: 50px;
}
.modal_tl{
	font-size: 17px;
	margin-bottom: 40px;
}
.modal_close_btn{
	cursor: pointer;
	position: absolute;
	top: 20px;
	right: 20px;
	
}
.modal_close_btn_line{
	width: 20px;
	height: 20px;
	position: relative;
}
.modal_close_btn_line::before,
.modal_close_btn_line::after{
	content: '';
	position: absolute;
	top: 50%;
	width: 20px;
	height: 1px;
	background-color: var(--text-color);
}
.modal_close_btn_line::before{
	transform: rotate(45deg);
}
.modal_close_btn_line::after{
	transform: rotate(-45deg);
}


/*--------モーダル内slick-----------------*/

/*メイン画像下に余白をつける*/

.gallery{
	margin:0 0 40px 0;
}

/*矢印の設定*/

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

.slick-prev {/*戻る矢印の位置と形状*/
    left:-3%;
    transform: rotate(-135deg);
}

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

/*選択するサムネイル画像の設定*/

.choice-btn li{
	cursor: pointer;
	outline: none;
	background:#333;
	width:192px!important;
	margin-right: 20px;
}

.choice-btn li img{
	opacity: 0.6;/*選択されていないものは透過40%*/
	transition: .3s;
}
.choice-btn li img:hover{
	opacity: 0.8;
}

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

.choice-btn .slick-track {
	transform: unset !important;/*画面幅サイズ変更に伴うサムネイル固定*/
}
.modal_eria .choice_1p{
	width:96px!important;
}
.gallery_sp{
	display: none;
}
.slick-track{
	margin-left: 0;
	margin-right: 0;
}