body {margin:0 !important; color:#3a3a3a;}

em {font-weight: 900;}

.pc_none {display:none !important;}

.topslider{
    position: fixed;
    bottom: 3ex;
    right: 10ex;
    z-index: 100;
}

.header_box {
    width: 100%;
    height: 60px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #fff;
    display: flex;
    justify-content: space-around;
    align-items: center;
    z-index: 100;
    box-shadow: 0px 6px 6px -6px rgba(0, 0, 0, 0.2);
}

.header_box dl {display: inline-flex; vertical-align: text-top;}
.header_box dt {margin: 0 1ex;}
.header_box dd {border-right: solid 1px #ccc;}

.inquiry {
    background: #008eb0;
    padding: 5px 1em;
    border-radius: 5px;
}

.inquiry a {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.inquiry i {vertical-align: baseline; margin-right: 10px;}

.cam_fv{
    margin-top: 60px;
    aspect-ratio: 200 / 49;
    background: url(/files/uploads/50th_campaign.jpg) top center no-repeat;
    background-size: cover;
    position: relative;
}

.greeting {margin: 0 auto; padding: 5ex 0; background:#e6ebf1;
}
.greeting h2  {font-family: "Noto Serif JP",serif; font-size:5ex; font-weight:700; line-height: 3ex; padding: 1em; position: relative;}

.greeting h2:before {
    content: "";
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    border-top: solid 4px #004a8f;
}

.period {margin: 2ex auto; display: flex; justify-content: center;}
.period li {font-family: "Noto Serif JP",serif; font-size:2ex; list-style: none;}
.period .now {
    list-style-image: url(/files/uploads/triangle.png);
    text-decoration: underline;
    font-size: 2.5ex;
    font-weight: 700;
    color: #004a8f;
}

.detail {
    width: 100vw;
    max-width: 1100px;
    margin: 2ex auto 10ex;
    font-family: "Noto Serif JP",serif;
}

.detail h3 {
    font-size:3.5ex;
    text-align: center;
    color: #004a8f;
    padding-top: 2ex;
    margin-bottom: 3ex;
    border-bottom: solid 1px #004a8f;
}
.detail h3 span {font-size:1.2ex; color:#0db2e7;}

.detail_inner { display: flex; justify-content: space-between; align-items: center;}

.detail_inner p {text-align: center;}
.detail_inner p span{font-size:3.5ex; font-weight: 700; margin: 0 1ex; background:linear-gradient(transparent 60%, #f7f06e 60%);}
.detail_inner ul {padding: 2ex 4ex; display: grid; justify-content: center; color:#0db2e7; font-weight: 700;}

.price_50 { background: #e6ebf1; font-family: "Noto Serif JP",serif; padding-bottom: 5ex;}

.price_50_inner { width: 100vw; max-width: 1100px; margin: 2ex auto 10ex;}

.price_50_inner h3 {
    font-size:3.5ex;
    text-align: center;
    color: #004a8f;
    padding-top: 2ex;
    margin-bottom: 3ex;
    border-bottom: solid 1px #004a8f;
}
.price_50_inner h3 span {font-size:1.2ex; color:#0db2e7;}

.price_area {background: white; padding: 1ex;}
.price_area h5 { font-size: 2.5ex; margin-left: 2ex; color:#0db2e7; margin: 2ex 0;}
.price_area table { width:100%; margin:5ex 0;}
.price_area table span {font-size: 3ex;}
.price_area td, .price_area th {border:solid 1px #ccc; width:16%;}
.price_area img {width:22px;}

.typeA {background:#ebf5ec; color:#56b879; text-align: center;}
.typeB {background:#eaf6fd; color:#00b9ef; text-align: center;}
.typeC {background:#e9e6f3; color:#7b59a3; text-align: center;}
.typeD {background:#fdeeed; color:#ef857d; text-align: center;}
.typeE {background:#fffeee; color:#dbb400; text-align: center;}
.border_none {border:none !important;}
.caption {background:#efefef;}

/* ■■■■■■■■■■■■■■■■■■■■　以下はタブレット表示用（1100px以下）のCSS　■■■■■■■■■■■■■■■■■■■■ */

@media screen and (max-width: 1100px) {

.topslider { bottom: 1ex; right: 1ex;}
.topslider img { width: 8vw;}

.detail_inner{display:list-item;}
.detail_inner img{ margin-top: 3ex; width: 100%; height: auto;}
}

.conversion {width: 50ex; margin: 10ex auto;}

/* ■■■■■■■■■■■■■■■■■■■■　以下はタブレット表示用（780px以下）のCSS　■■■■■■■■■■■■■■■■■■■■ */

@media screen and (max-width: 780px) {

body { overflow-x: hidden;}

.sp_none { display: none !important;}
.pc_none { display: unset !important;}

.topslider img { width: 12vw;}

.header_box dt { margin :0;}
.header_box dt img { width:80%; height: auto;}

.inquiry a { font-size: 1.5vh; white-space: nowrap;}

.cam_fv {
    aspect-ratio: 78 / 114;
    background: url(/files/uploads/50th_campaign_sp.jpg) top center no-repeat;
    background-size: cover;
    position: relative;
}

.greeting h2 { font-size: 7.5vw;}


period .now { font-size: 2ex;}

.greeting h2:before {bottom: 10px;}

.period .now{ font-size: 2ex;}
}