@charset "UTF-8";.calendar-container{display:flex;flex-direction:column;justify-content:center;gap:8px;width:640px}@media only screen and (width <= 750px){.calendar-container{margin-bottom:10px;width:100%}}.calendar-container>div{display:flex;gap:40px;color:#000}@media only screen and (width <= 750px){.calendar-container>div{overflow-x:scroll;width:88vw;margin-inline:calc(50% - 45vw);padding-inline:10px;scroll-snap-type:x proximity;gap:20px;box-sizing:border-box}}.calendar-container>div .calendar{width:300px;background-color:#fff;padding:5px}@media only screen and (width <= 750px){.calendar-container>div .calendar{width:80vw;flex-shrink:0;scroll-snap-align:center}}.calendar-container>div .calendar caption{position:relative;padding-inline:12px;padding-block:8px;background-color:#e4e4e4}.calendar-container>div .calendar caption .flex-row{display:flex;flex-direction:row}.calendar-container>div .calendar caption .flex-row.bottom{align-items:flex-end}.calendar-container>div .calendar caption .flex-row.gap{gap:.25rem}.calendar-container>div .calendar caption .month-year-title{display:flex;flex-direction:column;min-width:5em;text-align:left;font-size:.6em}.calendar-container>div .calendar caption .strong{font-weight:700;font-size:200%;line-height:1}.calendar-container>div .calendar tr{display:flex;flex-direction:row}.calendar-container>div .calendar tr th,.calendar-container>div .calendar tr td{text-align:center;flex:1}.calendar-container>div .calendar tr th{padding-block:0;font-size:.6em}.calendar-container>div .calendar tr td{aspect-ratio:1;display:flex;justify-content:center;align-items:center;line-height:1}@media only screen and (width <= 750px){.calendar-container>div .calendar tr td{font-size:1.2em}}.calendar-container>div .calendar tr .holiday,.calendar-container>div .calendar tr .Sunday{color:#fd6f6f}.calendar-container>div .calendar tr .Saturday{color:#446eff}.calendar-container>div .calendar tr .notThisMonth{color:#b3b3b3}.calendar-container>div .calendar tr .notThisMonth.holiday,.calendar-container>div .calendar tr .notThisMonth.Sunday{color:#ffb8b8}.calendar-container>div .calendar tr .notThisMonth.Saturday{color:#a6bafd}.calendar-container>div .calendar tr .circle:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);border-radius:100vmax;border:3px solid;padding-top:80%;width:80%}.calendar-container>div .calendar tr .today,.calendar-container>div .calendar tr .delivery-date{position:relative}.calendar-container>div .calendar tr .today span:before,.calendar-container>div .calendar tr .delivery-date span:before{content:"";display:block;width:10px;height:10px;position:absolute;top:-20px;left:50%;transform:translate(-50%) rotate(45deg) skew(10deg,10deg)}.calendar-container>div .calendar tr .today:before{border-color:#1c328b}.calendar-container>div .calendar tr .today span:before{background:#1C328B}.calendar-container>div .calendar tr .today span:after{content:"契約開始";display:inline-block;position:absolute;left:50%;top:-15px;border-radius:3px;line-height:1.5;font-weight:400;color:#fff;width:max-content;padding:3px;transform:translate(-50%) translateY(-100%);background:#1C328B;font-size:.9rem}.calendar-container>div .calendar tr:first-child .today span:before{top:unset;bottom:-20px}.calendar-container>div .calendar tr:first-child .today span:after{top:unset;bottom:-15px;transform:translate(-50%) translateY(100%)}.calendar-container>div .calendar tr .delivery-date:before{border-color:#f20044}.calendar-container>div .calendar tr .delivery-date span:before{background:#F20044}.calendar-container>div .calendar tr:has(.delivery-date){position:relative}.calendar-container>div .calendar tr:has(.delivery-date):after{content:"STEP2の案内メールが届きます。";display:inline-block;position:absolute;top:-15px;left:50%;border-radius:3px;line-height:1.5;color:#fff;width:max-content;padding:3px;background:#F20044;transform:translate(-50%) translateY(-100%);font-size:.9rem}.calendar-container>div .calendar tr:has(.delivery-date:first-child):after{left:5px;transform:translateY(-100%)}.calendar-container>div .calendar tr:has(.delivery-date:last-child):after{left:unset;right:5px;transform:translateY(-100%)}.calendar-container>div .calendar~.calendar caption:before{content:"6ヶ月後";display:inline-block;position:absolute;background-color:#f20044;top:50%;transform:translateY(-50%) translate(-100%);left:-14px;padding-inline:45px;height:32px;line-height:32px;color:#fff}.calendar-container>div .calendar~.calendar caption:after{content:"";position:absolute;top:50%;transform:translateY(-50%);left:-15px;border-top:20px solid transparent;border-bottom:20px solid transparent;border-left:20px solid #F20044}.calendar-container>p{color:#4b6c9f;font-size:11px}