@media screen and (max-width:767px) {
    .display-pc {
        display: none! important;
    }
}
@media screen and (min-width:768px) {
    .display-sp {
        display: none! important;
    }
}

#wrapper:before {
    display: inherit;
    height: inherit;
}
#wrapper, .breadcrumb {
    padding-top: 0 !important;
}
.mainframe_ > .navitopicpath_:first-child {
    margin: 0;
}
@media screen and (min-width: 768px) { 
    .wrapper_ {
        padding-top: 0;
    }
}

#main .top_area {
    width: 100%;
    color: #303030;
    background-color: #fffbf4;
    padding: calc(8 * var(--rem)) 0;
    font-feature-settings: "palt" 1;
    letter-spacing: 0.1em;
}
@media (max-width: 768px) {
    #main .top_area {
        width: 100%;
        color: #303030;
        background-color: #fffbf4;
        padding: calc(8 * var(--rem)) 0;
        font-feature-settings: "palt" 1;
        letter-spacing: 0.04em;
    }
}
@media (max-width: 768px) {
    #main .top_area {
        padding: calc(6 * var(--rem)) 0;
    }
}
#main .top_area img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
}
#main .top_area_inner {
    width: 86%;
    max-width: calc(110 * var(--rem));
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 768px) {
    #main .top_area_inner {
        max-width: none;
    }
}

#main .title {
    margin: 0px auto calc(3 * var(--rem));
    text-align: center;
}
@media (max-width: 768px) {
    #main .title {
        margin: 0px auto calc(4 * var(--rem));
    }
}

#main .appeal {
    text-align: center;
}
#main .appeal .appeal_container {
    border: calc(0.1 * var(--rem)) solid #303030;
    padding: calc(4 * var(--rem)) calc(1 * var(--rem)) calc(4.5 * var(--rem));
}
#main .appeal .appeal_sub {
    position: relative;
    width: fit-content;
    margin: 0 auto;
    padding: 0 calc(3.5 * var(--rem));
    font-size: calc(2 * var(--rem));
}
@media (max-width: 768px) {
    #main .appeal .appeal_sub {
        font-size: calc(2.4 * var(--rem));
    }
}
#main .appeal .appeal_sub:before,
#main .appeal .appeal_sub:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    width: calc(3 * var(--rem));
    height: calc(0.1 * var(--rem));
    background-color: #303030;
}
#main .appeal .appeal_sub:before {
    left: 0;
    transform: rotate(45deg);
}
#main .appeal .appeal_sub:after {
    right: 0;
    transform: rotate(-45deg);
}
#main .appeal .appeal_main {
    font-size: calc(3.2 * var(--rem));
    margin-top: calc(0.2 * var(--rem));
}
@media (max-width: 768px) {
    #main .appeal .appeal_main {
        font-size: calc(4.0 * var(--rem));
    }
}
#main .appeal .appeal_main em {
    font-style: normal;
    color: #f39d65;
}
#main .appeal .appeal_notice {
    font-size: calc(1.6 * var(--rem));
    margin-top: calc(0.6 * var(--rem));
    text-decoration: underline;
    text-underline-offset: 0.1em;
}
@media (max-width: 768px) {
    #main .appeal .appeal_notice {
        font-size: calc(2.0 * var(--rem));
    }
}
#main .appeal .appeal_attention {
    width: 100%;
    margin-top: calc(2.0 * var(--rem));
    font-size: calc(1.4 * var(--rem));
}
@media (max-width: 768px) {
    #main .appeal .appeal_attention {
        font-size: calc(2.0 * var(--rem));
    }
}

#main .series {
    width: 100%;
    margin-top: calc(10 * var(--rem));
    background-image: url(../img/bg_series.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 150vw auto;  
}
@media (max-width: 768px) {
    #main .series {
        background-position: top calc(6 * var(--rem)) center;
    }
}
#main .series .series_heading {
    width: 100%;
    text-align: center;
    font-size: calc(3.2 * var(--rem));
}
@media (max-width: 768px) {
    #main .series .series_heading {
        font-size: calc(4.8 * var(--rem));
    }
}
#main .series .series_table {
    width: 100%;
    margin: calc(5 * var(--rem)) auto 0;
    display: grid;
    grid-template-columns: calc(4 * var(--rem)) 1fr 1fr;
    border-radius: calc(2 * var(--rem));
    overflow: hidden;
}
@media (max-width: 768px) {
    #main .series .series_table {
        margin: calc(6 * var(--rem)) auto 0;
        grid-template-columns: calc(5.6 * var(--rem)) 1fr 1fr;
    }
}
#main .series .series_table .series_tablecell {
    display: flex;
    align-items: start;
    justify-content: center;
    flex-wrap: wrap;
}
#main .series .series_table .series_tablecell.series_tablecell_align_center {
    align-items: center;
}
#main .series .series_table .series_tablecell:not(.series_tablecell_last) {
    border-bottom: calc(0.2 * var(--rem)) solid #fdfcf2;
}
#main .series .series_table .series_tablecell_head {
    background-color: #878787;
    color: #ffffff;
    font-size: calc(2 * var(--rem));
    text-align: center;
    padding: calc(4.2 * var(--rem)) calc(0.2 * var(--rem));
    line-height: 1.2;
    align-items: center;
}
@media (max-width: 768px) {
    #main .series .series_table .series_tablecell_head {
        font-size: calc(2.4 * var(--rem));
        padding: calc(5.0 * var(--rem)) calc(1.0 * var(--rem));
    }
}
#main .series .series_table .series_tablecell_body {
    padding: calc(4.2 * var(--rem)) calc(2.0 * var(--rem));
}
@media (max-width: 768px) {
    #main .series .series_table .series_tablecell_body {
        padding: calc(5.0 * var(--rem)) calc(1.2 * var(--rem));
    }
}
#main .series .series_table .series_tablecell_girdle {
    /*
    background-color: #f7dedf;
    */
    background-color: rgba(247, 222, 223, 0.87);
}
#main .series .series_table .series_tablecell_shorts {
    /*
    background-color: #ebf2f8;
    */
    background-color: rgba(235, 242, 248, 0.87);
}
#main .series .series_table .series_subtitle {
    width: calc(18.4 * var(--rem));
    height: calc(4.3 * var(--rem));
    padding-top: calc(0.4 * var(--rem));
    color: #ffffff;
    font-size: calc(1.4 * var(--rem));
    text-align: center;
}
@media (max-width: 768px) {
    #main .series .series_table .series_subtitle {
        width: calc(23.0 * var(--rem));
        height: calc(5.3 * var(--rem));
        padding-top: calc(0.6 * var(--rem));
        font-size: calc(1.8 * var(--rem));
    }
}
#main .series .series_table .series_tablecell_girdle .series_subtitle {
    background: url(../img/im_balloon_girdle.png) no-repeat center center;
    background-size: contain;
}
#main .series .series_table .series_tablecell_shorts .series_subtitle {
    background: url(../img/im_balloon_shorts.png) no-repeat center center;
    background-size: contain;
}
#main .series .series_table .series_title {
    width: 100%;
    margin-top: calc(1.0 * var(--rem));
    font-size: calc(2.4 * var(--rem));
    font-family: "Noto Serif JP", serif;
    text-align: center;
    line-height: 1.4;
}
@media (max-width: 768px) {
    #main .series .series_table .series_title {
        margin-top: calc(1.8 * var(--rem));
        font-size: calc(2.6 * var(--rem));
    }
}
#main .series .series_table .series_photo {
    margin-top: calc(2.0 * var(--rem));
    width: 60%;
}
@media (max-width: 768px) {
    #main .series .series_table .series_photo {
        margin-top: calc(2.5 * var(--rem));
        width: 88%;
    }
}
#main .series .series_table .series_name {
    width: 100%;
    margin-top: calc(3.0 * var(--rem));
    font-size: calc(2.2 * var(--rem));
    text-align: center;
}
@media (max-width: 768px) {
    #main .series .series_table .series_name {
        margin-top: calc(2.5 * var(--rem));
        font-size: calc(2.6 * var(--rem));
    }
}
#main .series .series_table .series_colors {
    width: 100%;
    margin-top: calc(2.0 * var(--rem));
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: calc(1.0 * var(--rem))
}
@media (max-width: 768px) {
    #main .series .series_table .series_colors {
        margin-top: calc(3.0 * var(--rem));
        gap: calc(1.3 * var(--rem))
    }
}
#main .series .series_table .series_colors .series_color {
    width: calc(3.2 * var(--rem));
    height: calc(3.2 * var(--rem));
    border-radius: calc(1.6 * var(--rem));
    border: calc(0.3 * var(--rem)) solid #ffffff;
    background-color: #000000;
}
@media (max-width: 768px) {
    #main .series .series_table .series_colors .series_color {
        width: calc(3.0 * var(--rem));
        height: calc(3.0 * var(--rem));
        border-radius: calc(1.5 * var(--rem));
    }
}
#main .series .series_table .series_tablecell_girdle .series_colors .series_color:nth-child(1) {
    background-color: #f6e7de;
}
#main .series .series_table .series_tablecell_girdle .series_colors .series_color:nth-child(2) {
    background-color: #e9cacf;
}
#main .series .series_table .series_tablecell_girdle .series_colors .series_color:nth-child(3) {
    background-color: #343434;
}
#main .series .series_table .series_tablecell_shorts .series_colors .series_color:nth-child(1) {
    background-color: #f4cbd0;
}
#main .series .series_table .series_tablecell_shorts .series_colors .series_color:nth-child(2) {
    background-color: #c3d5e4;
}
#main .series .series_table .series_tablecell_shorts .series_colors .series_color:nth-child(3) {
    background-color: #fce8df;
}
#main .series .series_table .series_tablecell_shorts .series_colors .series_color:nth-child(4) {
    background-color: #343434;
}
#main .series .series_table .series_price {
    width: 100%;
    margin-top: calc(2.0 * var(--rem));
    font-size: calc(2.2 * var(--rem));
    text-align: center;
}
@media (max-width: 768px) {
    #main .series .series_table .series_price {
        margin-top: calc(3.5 * var(--rem));
        font-size: calc(2.6 * var(--rem));
    }
}

#main .series .series_table .series_icons {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: calc(5.8 * var(--rem))
}
@media (max-width: 768px) {
    #main .series .series_table .series_icons {
        gap: calc(3.8 * var(--rem))
    }
}
#main .series .series_table .series_icons .series_icon {
    position: relative;
    text-align: center;
}
#main .series .series_table .series_icons .series_icon:not(:first-child):before,
#main .series .series_table .series_icons .series_icon:not(:first-child):after {
    content: "";
    display: block;
    position: absolute;
    left: calc(-3.8 * var(--rem));
    top: calc(5.6 * var(--rem));
    width: calc(2 * var(--rem));
    height: calc(0.2 * var(--rem));
    background-color: #303030;
}
@media (max-width: 768px) {
    #main .series .series_table .series_icons .series_icon:not(:first-child):before,
    #main .series .series_table .series_icons .series_icon:not(:first-child):after {
        left: calc(-2.8 * var(--rem));
        top: calc(5.3 * var(--rem));
    }
}
#main .series .series_table .series_icons .series_icon:not(:first-child):before {
    transform: rotate(45deg);
}
#main .series .series_table .series_icons .series_icon:not(:first-child):after {
    transform: rotate(-45deg);
}
#main .series .series_table .series_icons .series_icon_image {
    width: calc(10.7 * var(--rem));
}
#main .series .series_table .series_icons .series_icon_description {
    margin-top: calc(1.8 * var(--rem));
    font-size: calc(1.6 * var(--rem));
}
@media (max-width: 768px) {
    #main .series .series_table .series_icons .series_icon_description {
        font-size: calc(1.8 * var(--rem));
    }
}
#main .series .series_table .series_icons .series_icon_description .series_icon_description_notice {
    font-size: calc(1.4 * var(--rem));
}

#main .series .series_table .series_size {
    font-size: calc(2.2 * var(--rem));
}
@media (max-width: 768px) {
    #main .series .series_table .series_size {
        font-size: calc(2.6 * var(--rem));
    }
}

#main .series .series_links {
    margin-top: calc(8.0 * var(--rem));
    display: flex;
    align-items: stretch;
    justify-content: start;
    flex-wrap: wrap;
    gap: calc(4.0 * var(--rem));
}
@media (max-width: 768px) {
    #main .series .series_links {
        margin-top: calc(10.0 * var(--rem));
        gap: calc(8.2 * var(--rem));
    }
}
#main .series .series_links .series_link_container {
    width: calc(50% - calc(2.0 * var(--rem)));
}
@media (max-width: 768px) {
    #main .series .series_links .series_link_container {
        width: 100%;
    }
}
#main .series .series_links .series_link_container .series_link_photo {
    width: 100%;
}

#main .series .series_links .series_link_container .series_link {
    position: relative;
    width: 75%;
    height: calc(6.4 * var(--rem));
    border-radius: calc(3.2 * var(--rem));
    border: calc(0.2 * var(--rem)) solid #ffffff;
    margin: calc(3.0 * var(--rem)) auto 0;
    font-size: calc(1.8 * var(--rem));
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 calc(1 * var(--rem)) calc(3 * var(--rem)) rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}
@media (max-width: 768px) {
    #main .series .series_links .series_link_container .series_link {
        width: 100%;
        height: calc(11.0 * var(--rem));
        border-radius: calc(5.5 * var(--rem));
        margin: calc(4.0 * var(--rem)) auto 0;
        font-size: calc(2.8 * var(--rem));
    }
}
#main .series .series_links .series_link_container .series_link:hover {
    opacity: .7;
}
#main .series .series_links .series_link_container.series_link_girdle .series_link {
    background-color: #da878e;
}
#main .series .series_links .series_link_container.series_link_shorts .series_link {
    background-color: #9fbdd9;
}
#main .series .series_links .series_link_container .series_link:before {
    content: "";
    display: block;
    position: absolute;
    right: calc(3.0 * var(--rem));
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    width: calc(1.2 * var(--rem));
    height: calc(1.2 * var(--rem));
    border-top: calc(0.2 * var(--rem)) solid #ffffff;
    border-right: calc(0.2 * var(--rem)) solid #ffffff;
    transform: rotate(45deg);
}
@media (max-width: 768px) {
    #main .series .series_links .series_link_container .series_link:before {
        right: calc(5.8 * var(--rem));
        width: calc(2.0 * var(--rem));
        height: calc(2.0 * var(--rem));
        border-top: calc(0.2 * var(--rem)) solid #ffffff;
        border-right: calc(0.2 * var(--rem)) solid #ffffff;
    }
}
#main .series .series_links .series_link_notice {
    width: 100%;
    font-size: calc(1.4 * var(--rem));
    text-align: center;
}
@media (max-width: 768px) {
    #main .series .series_links .series_link_notice {
        font-size: calc(2.1 * var(--rem));
        text-align: left;
    }
}
