@charset "UTF-8";

/* タブ
------------------------------------------------------------ */
.ab_tab_list{
    display:flex;
    justify-content:space-between;
    background:#fff;
}
.ab_tab_list li{
    width:calc(100% / 2);
    padding:10px 0;
    background:#f6f6f6;
    text-align:center;
    cursor:pointer;
}
.ab_tab_list li:nth-of-type(1){
    border-right:2px solid #eee;
}
/* タブ選択時 */
.ab_tab_list li.current{
    position:relative;
    background:#fff;
    pointer-events:none;
}
/* 黒帯（top_tabは上、under_tabは下） */
.ab_tab_list li.current::after{
    position:absolute;
    left:0;
    content:"";
    width:100%;
    height:4px;
    background:#333;
}
.ab_tab_list.top_tab li.current::after{
    top:0;
}
.ab_tab_list.under_tab li.current::after{
    bottom:0;
}
/* 選択時の三角（top_tabは下、under_tabは上） */
.ab_tab_list li.current::before{
    position:absolute;
    content:"";
    bottom:-8px;
    left:50%;
    width:0;
    height:0;
    border-style:solid;
    border-width:8px 6px 0 6px;
    border-color:#333 transparent transparent transparent;
    transform:translateX(-50%);
}
.ab_tab_list.under_tab li.current::before{
    top:-8px;
    border-width:0 6px 8px 6px;
    border-color:transparent transparent #333 transparent;
}
/* タブに対応のコンテンツ表示・非表示 */
.ab_test_tab{
    display:none;
}
.ab_test_tab.show{
    display:block;
}

/* 共通
------------------------------------------------------------ */
.contents_wrap{
    max-width:1040px;
    margin:0 0 20px;
    background:#fff;
}
.contents_wrap *,
.contents_wrap *::before,
.contents_wrap *::after{
    box-sizing:border-box;
}
/* 画像 */
.contents_wrap picture,
.contents_wrap img{
    display:block;
}
.contents_wrap img{
    max-width:100%;
    backface-visibility:hidden;
}
.contents_wrap .ct_box{
    margin:0 15px 20px;
    border:none;
}
.contents_wrap sup{
    padding:0 2px;
    font-size:12px;
    vertical-align:top;
}

/* 見出し
------------------------------------------------------------ */
.contents_wrap .main_heading {
    margin:0 0 15px;
    padding:30px 15px 5px;
}

/* 特長
------------------------------------------------------------ */
.features_wrap_inner{
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:stretch;
    position:relative;
    margin:0 0 30px;
}
.features_wrap_inner:last-child{
    margin:0 0 15px;
}
.features_wrap_inner:not(:last-child)::after{
    position:absolute;
    left:9px;
    bottom:-20px;
    content:"";
    width:0;
    height:0;
    border-style:solid;
    border-width:10px 8px 0 8px;
    border-color:#75757c transparent transparent transparent;
}
.features_wrap_inner > dt,
.features_wrap_inner > dd,
.plan_list dt{
    border-radius:20px;
}
.features_wrap_inner > dt{
    display:flex;
    justify-content:center;
    align-content:center;
    align-items:stretch;
    padding:15px 5px;
    background:#fdd23c;
    writing-mode:vertical-rl;
    -webkit-writing-mode:vertical-rl;
    -ms-writing-mode:tb-rl;
}
.features_wrap_inner > dt span{
    font-weight:bold;
}
.features_wrap_inner > dd{
    width:calc(100% - 50px);
    padding:20px;
    border:1px solid #01b08e;
}
.features_wrap_inner > dd h3{
    margin:0 0 10px;
    color:#01b08e;
    font-weight:bold;
    font-size:20px;
    line-height:1.2;
}
.features_wrap_inner > dd h3 span{
    display:inline-block;
    margin:0 0 0 10px;
    padding:0 15px;
    border-radius:20px;
    border:1px solid #01b08e;
    font-weight:normal;
    font-size:14px;
}
.plan_list dt{
    display:inline-block;
    margin:0 0 10px;
    padding:0 15px;
    background:#d14e98;
    color:#fff;
    font-weight:bold;
    text-align:center;
}
.plan_list dd ol li:nth-child(1)::before{
    content:"\02460";
}
.plan_list dd ol li:nth-child(2)::before{
    content:"\02461";
}
.plan_list dd ol li:nth-child(3)::before{
    content:"\02462";
}
.features_att h3,
.features_att h3 + p{
    color:#01b08e;
    font-weight:bold;
}
.features_att h3 + p{
    margin:0 0 10px;
    font-size:20px;
    line-height:1.4;
}
.features_att ul{
    margin:0 0 30px;
}
.features_att ul li,
.features_att p:last-of-type{
    font-size:12px;
}

/* ポイント
------------------------------------------------------------ */
.point_wrap{
    padding:40px 20px 30px;
    border:2px solid #d14e98;
    border-radius:20px;
}
.point_wrap .point_wrap_inner:nth-child(1){
    margin:0 0 20px;
    padding:0 0 20px;
    border-bottom:1px dashed #d14e98;
}
.point_wrap_inner dt,
.point_wrap_inner dd{
    margin:0 0 10px;
}
.point_wrap_inner dt{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    min-height:72px;
    padding:0 0 0 82px;
    color:#d14e98;
    font-weight:bold;
    font-size:20px;
    line-height:1.4;
    background-repeat:no-repeat;
    background-position:left top;
    background-size:72px;
}
.point_wrap_inner dt span,
.point_wrap_inner dt span small{
    display:block;
}
.point_wrap_inner dt span{
    width:160px;
    padding:10px 0;
    border:1px solid #d14e98;
    border-radius:50%;
    font-size:16px;
    text-align:center;
}
.point_wrap_inner dt span small{
    font-size:12px;
}
.point_wrap .point_wrap_inner:nth-child(1) dt{
    background-image:url(images/point01_head.png);
}
.point_wrap .point_wrap_inner:nth-child(2) dt{
    background-image:url(images/point02_head.png);
}
.point_wrap_inner dd:last-of-type{
    padding:20px;
    border-radius:10px;
    background:#f1f1ee;
}
.point_wrap_inner dd:last-of-type img{
    margin:0 auto;
}
.point_wrap_inner dd:last-of-type figure figcaption{
    margin:0 0 10px;
}

/* 保障内容
------------------------------------------------------------ */
.scroll_att{
    font-size:14px;
}
.scroll_area{
    position:relative;
    overflow:auto;
    margin:0 0 15px;
}
.scroll_area img{
    width:1040px;
    max-width:none;
}
.guarantee_supplement{
    margin:0 0 15px;
    padding:10px 15px;
    border-radius:6px;
    background:#8ac226;
    color:#fff;
    font-weight:bold;
    text-align:center;
}
.guarantee_att{
    font-size:12px;
}
.guarantee_att p{
    display:table;
}
.guarantee_att p span{
    display:table-cell;
    white-space:nowrap;
    padding:0 5px 0 0;
}
.features_att ul li,
.features_att p:last-of-type,
.guarantee_att ul li{
    position:relative;
    padding:0 0 0 15px;
}
.features_att ul li::before,
.features_att p:last-of-type::before,
.guarantee_att ul li::before{
    position:absolute;
    content:"";
    top:4px;
    left:0;
    width:10px;
    height:10px;
    border-radius:100%;
    background:#333;
}
.guarantee_att ul li:nth-child(4) strong{
    color:#cd002c;
    font-weight:bold;
}
.guarantee_att ul li:nth-child(4)::before{
    background:#cd002c;
}

/* 画面サイズ別調整
---------------------------------------------------------------- */
@media screen and (min-width:480px){
    .plan_list{
        display:flex;
        align-items:center;
    }
    .plan_list dt{
        margin:0;
    }
    .plan_list dd{
        padding:0 15px;
    }
    .point_wrap_inner dd{
        margin:0 0 10px 80px;
    }
}
@media screen and (min-width:768px){
    .scroll_att{
        display:none;
    }
    .scroll_area img{
        width:100%;
    }
}