/*!
global > color
------------------------------
*/
/*!
global > content-width
------------------------------
*/
/*!
global > font
------------------------------
*/
/*!
global > mixin
------------------------------
*/
.interview_post {
padding: 42px 0 88px;
}
.interview_ttl {
text-align: center;
}
.interview_ttl__en {
display: block;
font-size: 13px;
line-height: 1;
color: #E67339;
font-weight: 700;
letter-spacing: 0.1em;
margin-bottom: 3px;
}
.interview_ttl__jp {
font-size: 24px;
font-weight: 700;
line-height: 1.4;
letter-spacing: 0.1em;
}
.interview_head {
position: relative;
margin-bottom: 60px;
z-index: 2;
}
.interview_head__illust::before {
content: "";
position: absolute;
bottom: -55px;
right: -21px;
width: 120px;
aspect-ratio: 249/146;
background: url("../images/interview/icon_interview_01.webp") center/contain no-repeat;
z-index: -1;
}
.interview_ttl {
margin-bottom: 22px;
}
.interview_ttl__02 {
margin-bottom: 24px;
}
.interview_desc {
font-weight: 400;
text-align: center;
}
.interview_list__item:not(:last-child) {
margin-bottom: 40px;
}
.interview_list__item:nth-child(even) {
flex-direction: row-reverse;
}
.interview_list__tt {
font-size: 20px;
font-weight: 700;
margin-bottom: 10px;
color: #8B5E3C;
position: relative;
padding-left: 40px;
letter-spacing: 0.05em;
}
.interview_list__tt::before {
content: "";
position: absolute;
top: -14px;
left: 0;
width: 80px;
height: 75px;
background: url('data:image/svg+xml,') center/contain no-repeat;
z-index: -1;
}
.interview_list__dsc p {
font-size: 15px;
letter-spacing: 0px;
margin-bottom: 15px;
}
.interview_list__dsc p:last-child {
margin-bottom: 0;
}
.interview_list__img {
position: relative;
width: -moz-fit-content;
width: fit-content;
margin: 30px auto 0;
}
.interview_list__img img {
border-radius: 20px;
height: auto;
}
.interview_list__caption {
position: absolute;
top: -10px;
right: -10px;
writing-mode: vertical-rl;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.interview_list__caption > span {
font-size: 1rem;
font-weight: 700;
color: #fff;
background: url('data:image/svg+xml,') top center/cover no-repeat;
padding: 10px 5px;
letter-spacing: 0.25em;
white-space: nowrap;
}
.interview_list__caption > span:nth-child(2) {
margin-top: 46px;
}
.interview_list__note {
margin-top: 6px;
font-size: 0.875rem;
font-weight: 700;
}
.interview_time {
background-color: #FFFCDE;
border-radius: 30px 30px 0 0;
padding: 60px 0 120px;
}
.interview_schedule {
margin-bottom: 50px;
}
.interview_schedule__item {
padding-bottom: 40px;
position: relative;
padding-left: 45px;
}
.interview_schedule__item:last-child {
padding-bottom: 0;
}
.interview_schedule__item:last-child::after {
display: none;
}
.interview_schedule__item::before {
content: "";
position: absolute;
top: 2px;
left: 0;
width: 23px;
height: 23px;
border-radius: 100%;
background-color: #387c3a;
}
.interview_schedule__item::after {
content: "";
position: absolute;
top: 2px;
left: 10px;
bottom: -4px;
width: 3px;
background-color: #387c3a;
}
.interview_schedule__dt {
font-size: 1.375rem;
line-height: 1;
font-weight: 700;
color: #387c3a;
margin-bottom: 18px;
}
.interview_schedule__dd {
background-color: #fff;
padding: 20px;
border-radius: 20px;
}
.interview_schedule__tt {
color: #E67339;
font-size: 1.125rem;
margin-bottom: 6px;
font-weight: 700;
}
.interview_schedule__dsc {
font-size: 0.9375rem;
}
.interview_banner {
margin-bottom: 40px;
}
@media screen and (min-width: 768px) {
.interview_ttl__jp {
font-size: 32px;
}
.interview_head {
margin-bottom: 85px;
}
.interview_head__illust {
margin-bottom: 46px;
}
.interview_head__illust::before {
bottom: -3px;
width: 249px;
}
.interview_list__item {
display: flex;
gap: min(8.33vw, 100px);
}
.interview_list__item:not(:last-child) {
margin-bottom: min(7.08vw, 85px);
}
.interview_list__item:nth-child(even) {
margin-bottom: min(4.58vw, 55px);
gap: min(8vw, 96px);
}
.interview_list__item:nth-child(even) .interview_list__img {
margin-top: 15px;
}
.interview_list__item:nth-child(even) .interview_list__caption {
top: -20px;
right: -29px;
}
.interview_list__item:nth-child(even) .interview_list__caption > span:nth-child(2) {
margin-top: 101px;
}
.interview_list__item:nth-child(3) .interview_list__img {
margin-top: 53px;
}
.interview_list__item:nth-child(3) .interview_list__caption {
top: -20px;
right: -18px;
}
.interview_list__tt {
font-size: 26px;
padding-left: 70px;
margin-bottom: 31px;
}
.interview_list__tt::before {
width: 118px;
}
.interview_list__img {
width: 39.0625vw;
flex-shrink: 0;
margin-top: 9px;
}
.interview_list__img img {
border-radius: min(2.6041666667vw, 30px);
}
.interview_list__caption {
top: -20px;
right: -18px;
}
.interview_list__caption > span {
font-size: min(2vw, 1.5rem);
padding: min(1.33vw, 16px) min(0.75vw, 9px);
}
.interview_list__note {
font-size: 1rem;
}
.interview_time {
padding: 73px 0 235px;
border-radius: 60px 60px 0 0;
}
.interview_schedule__item::before {
top: 0;
width: 29px;
height: 29px;
}
.interview_schedule__item::after {
left: 13px;
}
.interview_schedule__dt {
font-size: 1.625rem;
}
.interview_schedule__dd {
padding: 24px 42px;
}
.interview_banner {
margin-bottom: 83px;
}
}
@media screen and (min-width: 1200px) {
.interview_list__tt.sm {
padding-left: 56px;
margin-bottom: 18px;
}
.interview_list__tt.md {
margin-bottom: 28px;
}
.interview_list__img {
width: 550px;
}
}
@media screen and (min-width: 1400px) {
.interview_list__caption {
top: -30px;
right: -35px;
}
}
/*# sourceMappingURL=maps/interview.css.map */