@charset "utf-8";
.sec_headline .ttl {
	color: #000;
	font-size: clamp(1.6rem,1.3095238vw,2.2rem);
	background: none;
	-webkit-text-fill-color: unset;
    margin: 0;
}
.sec_head {
	z-index: 1 !important;
	padding-bottom: clamp(60px,9.523809vw,50px) !important;
}
.sec_plan {
    position: relative;
    z-index: 0;
    padding: clamp(60px,9.523809vw,160px) 0 clamp(60px,9.523809vw,120px);
}

.sec_variation {
    padding-top: 0 !important;
}
.sec_variation .bg_bottom {
    position: absolute;
    z-index: -1;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
}
.sec_variation .bg_bottom img {
    height: 100%;
    object-fit: cover;
}
.variation_list .item {
    padding: 0 15px;
}
.variation_list .plan_item {
    color: #fff;
    cursor: pointer;
    position: relative;
    z-index: 0;
    padding: 10px;
}
.variation_list .plan_item .pos_link {
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.variation_list .plan_item .bg_wave {
    opacity: 0.7;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 30px);
    z-index: 1;
}
.variation_list .plan_item:before {
    content: "";
    background: #958f89;
    /*background: linear-gradient(30deg, rgba(110, 107, 102, 1) 0%, rgba(140, 138, 130, 1) 33%, rgba(244, 238, 228, 1) 81%, rgba(102, 101, 98, 1) 100%);*/
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -2;
    top: 0;
    left: 0;
}
.variation_list .plan_item:after {
    content: "";
    background: #312E2C;
    background: linear-gradient(30deg, rgba(49, 46, 44, 1) 0%, rgba(79, 73, 61, 1) 33%, rgba(183, 160, 143, 1) 81%, rgba(41, 39, 36, 1) 100%);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    top: 0;
    left: 0;
    transition: all 0.5s ease-in-out;
    opacity: 0;
    visibility: hidden;
}
.variation_list .plan_item:hover:after {
    opacity: 1;
    visibility: visible;
}
.variation_list .plan_item .box {
	padding: 20px 20px 30px;
	border: 1px solid #fff;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.variation_list .plan_item .box .plan_name {
    font-size: clamp(1.8rem,1.66666vw,2.8rem);
    letter-spacing: 0.05em;
    line-height: 1;
    margin: 0 0 clamp(30px,7.14285vw,90px);
}
.variation_list .plan_item .box .plan_name .lg { font-size: 285%; }
.variation_list .plan_item .box .plan_name .med { font-size: 142%; }
.variation_list .plan_item .box .plan_type {
    font-size: clamp(1.2rem,0.95238vw,1.6rem);
    letter-spacing: 0.05em;
    line-height: 1;
    margin: 0 0 clamp(15px,1.785714vw,30px);
}
.variation_list .plan_item .box .plan_type .numb { font-size: 250%; }
.variation_list .plan_item .box .plan_type .med { font-size: 150%; }
.variation_list .plan_item .box .plan_size {
    font-size: clamp(1rem,0.71428vw,1.2rem);
    letter-spacing: 0.18em;
    line-height: 1;
    margin: 0 0 clamp(15px,2.083333vw,35px);
}
.variation_list .plan_item .box .plan_size .txt {
    text-align: center;
    display: flex;
    gap: 15px;
    justify-content: center;
    align-items: flex-end;
    flex-wrap: wrap;
}
.variation_list .plan_item .box .plan_size .numb { font-size: 350%; line-height: 0.8; }
.variation_list .plan_item .box .plan_size .med { font-size: 233%; line-height: 0.8; }
.variation_list .plan_item .box .plan_viewmore {
    text-align: center;
    margin-top: 30px;
}
.variation_list .plan_item .box .plan_viewmore .txt {
    display: inline-block;
    border: 1px solid #fff;
    border-radius: 26px;
    background: rgba(255,255,255,0.15);
    font-size: clamp(1.2rem,0.89285vw,1.5rem);
    letter-spacing: 0;
    padding: 10px;
    width: 100%;
    max-width: 212px;
}
.variation_list .slick-arrow {
    height: clamp(20px, 1.4881vw, 25px);
    width: clamp(20px, 1.4881vw, 25px);
    z-index: 10;
}
.variation_list .slick-next { right: -15px;}
.variation_list .slick-prev { left: -15px;}
.variation_list .slick-arrow:before {
    content: "";
    display: block;
    z-index: 2;
    height: 100%;
    width: 100%;
    border: solid #3e3a39;
	border-width: 0 2px 2px 0;
	display: inline-block;
	padding: 2px;
}
.variation_list .slick-arrow::before { 
	transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
.variation_list .slick-next::before {
    transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
@media screen and (max-width: 1000px) {
    .variation_list { padding: 0 15px; }
    .variation_list .slick-next { right: 0;}
    .variation_list .slick-prev { left: 0;}
    .variation_list .plan_item .box { padding: 15px; }
    .variation_list .plan_item .box .plan_size .txt {
        justify-content: flex-start;
        letter-spacing: 0.1em;
        gap: 5px;
     }
}
@media screen and (max-width: 767px) {
    .variation_list .plan_item .box { padding: 15px 30px; }
}