@charset "utf-8";

/*-----------------------------------------------------------
intro
-----------------------------------------------------------*/ 

.men01-img-box01 {
	aspect-ratio: 288 / 366;
	height: auto;
	align-self: flex-start;
}

.men01-img-box01 .img-fit, .men01-img-box02 .img-fit {
	height: auto !important;	
}

.men01-img-box02 {
	aspect-ratio: 304 / 387;
}

.mens01-text-block {
    top: 0;
    left: 0;
}

.mens01-text-box {
    text-shadow: 0 2px 3px #555;
}

.mens01-row:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(85, 85, 85, .5);
}

/*-----------------------------------------------------------
Recommend
-----------------------------------------------------------*/ 

.check-block {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 12px;
    max-width: 380px !important;
}

/*-----------------------------------------------------------
Menu
-----------------------------------------------------------*/ 

.mens03-menu-block {
	border: 1px solid var(--gray03);
    position: relative;
    padding: 40px 15px;
}

.menu-title-box {
    padding: 10px 20px 10px 20px;
    position: absolute !important;
    top: -28px;
    left: 0;
    width: 100%;
    margin: 0 auto 0 auto;
    right: 0;
}

/*16px-26px*/

.menu-title {
    background-color: var(--base-body-bg);
    display: inline-block;
    padding: 0 15px 0 15px;
    font-size: clamp(1rem, 0.8483rem + 0.6472vw, 1.625rem);
}

.menu-item {
    max-width: 820px;
    width: 100%;
    margin: 40px auto 0;
    padding: 0 0 30px 0;
    border-bottom: 1px solid var(--gray03);
}

.menu-item-row {
    display: flex;
  	flex-direction: row;
    align-items: flex-end;
}

.mens02-img-box01,.mens03-img-box01 {
	height: auto;
	align-self: flex-start;
    aspect-ratio: 371 / 491;
}

.mens02-img-box01 .img-fit, .mens03-img-box01 .img-fit {
	height: auto !important;	
}

.mens-link01.banner-link {
    max-width: 1440px;
    width: 94%;
}

.mens-link01 .link-img-box {
    min-height: 215px !important;
}

.banner-link {
    margin: 35px 0 auto auto;
}

.banner-link:first-child {
	margin: 35px auto 0 0;
}

.banner-link:first-child .banner-arrow {
    position: absolute;
    bottom: 0;
    right: 0;
	left: auto;
    max-width: 160px;
    width: 15%;
}

.banner-arrow {
    position: absolute;
    bottom: 0;
    left: 0;
    max-width: 160px;
    width: 15%;
}

.mens-link01 .banner-link-inner {
	width: 75.82%;
    padding: 30px 0 0;
    justify-content: flex-start;
}

/*16-32px*/
.mens-link-text-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    font-size: clamp(1.125rem, 0.9126rem + 0.9061vw, 2rem);
}

.rec-menu-title-box:before, .rec-menu-title-box:after {
    content: "";
    position: absolute;
    width: 25%;
    height: 1px;
    background: #838383;
    top: 50%;
    left: auto;
  	right: 0;
    transform: translateY(-50%);
    z-index: 1;
}

.rec-menu-title-box:after {
  	right: auto;
    left: 0;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:576px) {
  
/*-----------------------------------------------------------
Recommend
-----------------------------------------------------------*/ 
  
.check-block {
    grid-template-columns: repeat(2, 1fr);
    max-width: 890px !important;
    /* gap: 15px; */
}
  
.mens-link01 .banner-link-inner {
    padding: 60px 0 0;
}
  
}/* min-width: 576px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:768px) {
  
.banner-link {
	width: 95%;
	margin: 90px 0 0 auto;
}
  
.banner-link:first-child {
	margin: 60px auto 0 0;
}
  
.mens-link01 .link-img-box {
    min-height: 400px !important;
}
  
.mens-link01 .banner-link-inner {
    padding: 90px 0 0;
}
  
.rec-menu-title-box:before, .rec-menu-title-box:after {
    width: 30%;
}

  
}/* min-width: 768px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:1024px) {
  
.mens01-row:after {
    content: none;
}
  
/*-----------------------------------------------------------
Menu
-----------------------------------------------------------*/ 
  
.mens03-menu-block {
    padding: 60px 25px;
}
   
.menu-title-box {
    padding: 0 25px 0 25px;
    top: -20px;
}
  
.banner-link {
    margin: 120px 0 0 auto;
}
  
.mens-link01 .link-img-box {
    min-height: 480px !important;
}
  
.rec-menu-title-box:before, .rec-menu-title-box:after {
    width: 38%;
}

}/* min-width: 1024px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:1400px) {
  
/*-----------------------------------------------------------
Menu
-----------------------------------------------------------*/ 

.menu-title-box {
    padding: 0 65px 0 65px;
}
  
  
.rec-menu-title-box:before, .rec-menu-title-box:after {
    width: 42%;
}
  
.mens-link01 .link-img-box {
    min-height: 520px !important;
}
  

}/* min-width: 1400px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */